【问题标题】:xamarin forms: swipe to deletexamarin 形式:滑动删除
【发布时间】:2016-03-01 14:21:00
【问题描述】:

如何在我的笔记列表应用程序中添加滑动以删除。我正在使用 xamarin 表单。我在 xamarin 表单示例中搜索过,但找不到它。我还尝试了使用 menuItem 等的列表视图性能选项,但我不知道如何在我的代码中进行调整。任何人都可以帮我解决这个问题吗? 我的代码如下:

public partial class MyPage
{
    List<Note> notes;
    string NotesFile {
        get {
            var documents = Environment.GetFolderPath (Environment.SpecialFolder.Personal);
            return System.IO.Path.Combine (documents, "notes.json");
        }
    }
    public MyPage()
    {
        BuildContent();
        LoadNotes ();
        ReloadListContents ();

        AddNoteButton.Clicked += (sender, args) => {
            var note = new Note("typ...");
            notes.Add(note);
            EditNote(note);
        };

        NoteListView.ItemTapped += (sender, row) =>
        {
            NoteListView.SelectedItem = null;
            Note note = (Note)row.Item;
            EditNote(note);
        };

        buttonDelete.Clicked += (sender, args) =>{
            notes.RemoveAt(0);
            DisplayAlert("Delete", "Row deleted", "OK");
        };
    }

} 我的页面.cs

{
    public ListView NoteListView = new ListView ();
    public Button AddNoteButton;
    public Button buttonDelete;
    private void BuildContent() 
    {
        AddNoteButton = new Button
        {
            Text = "Add New Note",
            TextColor = Color.White,
            HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.Center
        };
        buttonDelete = new Button
        {
            Text = "Delete Note ",
            TextColor = Color.White,
            HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.Center
        };

        Content = new StackLayout
        {
            BackgroundColor = Color.Black,
            Children = {
                new Label {
                    Text = "Note Taker",
                    TextColor = Color.White
                },
                NoteListView,
                AddNoteButton,
                buttonDelete
            }
        };
    }

【问题讨论】:

标签: c# json xamarin-forms


【解决方案1】:

我用 CS 代码而不是 XAML(我的首选)来回答这个问题,如果有人想要 Xaml 响应,请在下面发表评论,我会在 CS 旁边写 XAML。

因此,要完成您在 Xamarin.Forms 中对 ListView 元素提出的要求,您必须首先创建您希望在 ListView 中的每个单元格中显示数据的 ViewCell 并为其提供上下文操作。这是一个例子:

   public class CustomViewCell : ViewCell
        {
            public CustomViewCell()
            {
                //instantiate each element we want to use.
                var image = new CircleCachedImage
                {
                    Margin = new Thickness(20, 10, 0, 10),
                    WidthRequest = App.ScreenWidth * 0.15,
                    HeightRequest = App.ScreenWidth * 0.15,
                    Aspect = Aspect.AspectFill,
                    BorderColor = Color.FromHex(App.PrimaryColor),
                    BorderThickness = 2,
                    HorizontalOptions = LayoutOptions.Center
                };
                var nameLabel = new Label
                {
                    Margin = new Thickness(20, 15, 0, 0),
                    FontFamily = "Lato",
                    FontAttributes = FontAttributes.Bold,
                    FontSize = 17
                };
                var locationLabel = new Label
                {
                    Margin = new Thickness(20, 0, 0, 5),
                    FontFamily = "Lato",
                    FontSize = 13
                };
                //Create layout
                var verticaLayout = new StackLayout();
                var horizontalLayout = new StackLayout() { BackgroundColor = Color.White };

                //set bindings
                nameLabel.SetBinding(Label.TextProperty, new Binding("Name"));
                locationLabel.SetBinding(Label.TextProperty, new Binding("Location"));
                image.SetBinding(CircleCachedImage.SourceProperty, new Binding("Image"));

                //Set properties for desired design
                horizontalLayout.Orientation = StackOrientation.Horizontal;
                horizontalLayout.HorizontalOptions = LayoutOptions.Fill;
                image.HorizontalOptions = LayoutOptions.End;


                //add views to the view hierarchy
                horizontalLayout.Children.Add(image);
                verticaLayout.Children.Add(nameLabel);
                verticaLayout.Children.Add(locationLabel);
                horizontalLayout.Children.Add(verticaLayout);

                //HERE IS THE MOST IMPORTANT PART
                var deleteAction = new MenuItem { Text = "Delete", IsDestructive = true }; // red background


                deleteAction.Clicked += async (sender, e) => {
                    //Here do your deleting / calling to WebAPIs
                    //Now remove the item from the list. You can do this by sending an event using messaging center looks like: 
                    //MessagingCenter.Send<TSender,string>(TSender sender, string message, string indexOfItemInListview)
                };
                // add to the ViewCell's ContextActions property
                ContextActions.Add(deleteAction);

                // add to parent view
                View = horizontalLayout;
            }
        }

现在您必须对您的 ListView 执行以下操作:

listView = new ListView();
lstView.ItemTemplate = new DataTemplate(typeof(CustomViewCell));

在您拥有 ListView 的同一内容页面中,您还必须订阅 MessagingCenter,以侦听与上述自定义视图单元格中设置的相同参数。如果您以前没有使用过 MessagingCenter,请阅读提供的链接。在此方法中,您必须从列表视图中删除项目,并将索引发送到此方法。

如果有人需要任何进一步的解释,请在下面发表评论,我会编辑这篇文章。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-11-16
    • 2021-09-08
    • 1970-01-01
    • 2023-01-16
    相关资源
    最近更新 更多