0

我正在使用自定义视图单元格和渲染器实现滑动删除功能。我有一个像这样的列表视图：

https://i.stack.imgur.com/AzBQk.png

滑动时会显示一个按钮，如下所示

https://i.stack.imgur.com/S87uj.png

但是，在单击删除按钮（成功从列表中删除项目）后，移动到删除单元格位置的视图单元格仍然暴露了删除按钮：

https://i.stack.imgur.com/aMwux.png

有人知道如何阻止这种情况发生吗？我的自定义渲染器只是公开了 OnFling() 和 OnScroll() 事件。

我也尝试过使用 Xamarin 表单 Pan Gesture Recogniser 进行类似的操作，并遇到了同样的问题。

编辑 1：添加了代码片段

自定义视图单元格 xaml

<ViewCell xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="SwipeViewCell" xmlns:local="CustomControls">
<Grid x:Name="SwipeViewCellGrid">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="70*"/>
        <ColumnDefinition Width="30*"/>
    </Grid.ColumnDefinitions>
    <StackLayout x:Name="HiddenContainer" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Grid.Column="1"/>
    <local:GestureStackLayout x:Name="SwipeContainer" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Grid.ColumnSpan="2" Grid.Column="0"/>
</Grid>

自定义视图单元 .cs：

public partial class SwipeViewCell : ViewCell
{       

    private View _swipeContent;
    private View _hiddenContent; 


    public SwipeViewCell()
    {
        InitializeComponent();

        SwipeContainer.SwipeLeft += SwipeContainer_SwipeLeft;
        SwipeContainer.SwipeRight += SwipeContainer_SwipeRight; 
    }

    public View SwipeContent
    {
        get
        {
            return _swipeContent;
        }
        set
        {
            _swipeContent = value;
            SwipeContainer.Children.Add(SwipeContent);
            OnPropertyChanged();
        }
    }

    public View HiddenContent
    {
        get
        {
            return _hiddenContent;
        }
        set
        {
            _hiddenContent = value;
            HiddenContainer.Children.Add(HiddenContent);
            OnPropertyChanged();
        }
    }

    private void SwipeContainer_SwipeRight(object sender, EventArgs e)
    {
        SwipeContainer.TranslateTo(SwipeContainer.X, 0, 250, Easing.Linear);
    }

    private void SwipeContainer_SwipeLeft(object sender, EventArgs e)
    {
        SwipeContainer.TranslateTo(SwipeContainer.X - HiddenContainer.Width, 0, 250, Easing.Linear);
    }

}

查看型号：

public class ViewModel
{

    private ObservableCollection<string> _data;     

    public ViewModel()
    {
         Data = new ObservableCollection<string>();
         Data.Add("a");
         Data.Add("c");
         Data.Add("b");
    }

    public ObservableCollection<string> Data
    {
        get { return _data; }
        set
        {
            _data= value;
            OnPropertyChanged();
        }
    }

     public ICommand Delete
    {
        get
        {
            return new Command((e) =>
            {
                _data.Remove(e as string);                    
                Data = _data
            });
        }
    }

}

XAML：

 <ListView ItemsSource="{Binding Data}" x:Name="Model" HorizontalOptions="FillAndExpand" IsVisible="True" VerticalOptions="FillAndExpand" SeparatorVisibility="Default" SeparatorColor="Black">
                <CustomControls:MultiListView.ItemTemplate>
                    <DataTemplate>                       
                            <CustomControls:SwipeViewCell  x:Name="Item">
                                <CustomControls:SwipeViewCell.SwipeContent>
                                    <StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="White">
                                        <Label Text="{Binding }"/>
                                    </StackLayout>
                                </CustomControls:SwipeViewCell.SwipeContent>
                                <CustomControls:SwipeViewCell.HiddenContent>
                                    <Button Text="Delete" Command="{Binding Delete}"  BindingContext="{Binding Source={x:Reference Model}, Path=BindingContext}" CommandParameter="{Binding Source={x:Reference Item}, Path=BindingContext}"  BackgroundColor="Red"></Button>
                                </CustomControls:SwipeViewCell.HiddenContent>
                            </CustomControls:SwipeViewCell>                          
                    </DataTemplate>
                <ListView.ItemTemplate>
            <ListView>
4

1 回答 1

-1

在下面的完整示例中，您如何做到这一点，对我来说效果很好：

1-添加一个包含一个数字的类，该数字已显示在您的列表视图中

 public class NumberClass
    {
        public string Number{ get; set; }
    }

2-尝试使用ObservableCollection如下NumberClass：

public class NumberClassList : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;
        public System.Collections.ObjectModel.ObservableCollection<NumberClass> _items;
        public ObservableCollection<NumberClass> Items
        {
            get { return _items; }
            set { _items = value; OnPropertyChanged("Items"); }
        }
        protected virtual void OnPropertyChanged(string propertyName)
        {
            if (PropertyChanged == null)
                return;
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }

        public SerialClassList(List<NumberClass> itemList)
        {
            Items = new ObservableCollection<NumberClass>();
            foreach (NumberClassitm in itemList)
            {
                Items.Add(itm);
            }
        }
    }

3-把你的号码列表放在List<NumberClass>

    public List<NumberClass> allItems;

4-使用 NumberClassList 如下：

 NumberClassList items;
    items = new NumberClassList(allItems);

5-将您的项目来源设置ListView如下：

ItemsSource = items.Items;

6-DataTemplate为您创建一个ListView如下： 注意：删除按钮和数字具有相同的绑定

DataTemplate dt = new DataTemplate(() =>
            {
                var Number = new Label
                {
                    TextColor=Color.Black,
                    FontAttributes=FontAttributes.Bold,
                    HorizontalOptions = LayoutOptions.StartAndExpand
                };
               Number.SetBinding(Label.TextProperty, new Binding("Number"));
                var Deletebutton = new Button { Text = "Delete", HorizontalOptions = LayoutOptions.StartAndExpand  };
                Deletebutton.SetBinding(Button.CommandParameterProperty, new Binding("Number"));
                Deletebutton.Clicked += DeleteSerial;
                return new ViewCell
                {
                    View = new StackLayout
                    {
                        Orientation = StackOrientation.Horizontal,
                        VerticalOptions = LayoutOptions.FillAndExpand,                          
                        Children =
                        {
                            Number,
                            Deletebutton
                        }
                    }
                };
            });
 YourListView.ItemTemplate = dt;

7-这是删除按钮的实现： 

 public void DeleteSerial(object sender,EventArgs e)
            {
                var item = (Xamarin.Forms.Button)sender;
                SerialClass listitem = (from itm in items.Items
                                        where itm.Number == item.CommandParameter.ToString()
                             select itm)
                            .FirstOrDefault<SerialClass>();
            items.Items.Remove(listitem);             
        }
于 2017-03-02T15:26:24.010 回答