删除的ListView项目按钮 [英] Delete button on ListView items

问题描述

我开始开发UWP。我试图创建一个的ListView 填充 X：绑定。现在我想对所有单个项目的删除它们创建一个按钮。类似的Windows 10邮件：

I'm starting to develop for UWP. I'm trying to create a ListView populated with x:bind. Now I want to create a button on all single items for delete them. Something like Windows 10 Mail:

我已经创建了：

<ListView x:Name="listActivity" ItemsSource="{x:Bind list}" Grid.Column="0" Header="Activity List" HorizontalAlignment="Center" Width="auto" IsItemClickEnabled="True" ItemClick="showDel">
    <ListView.ItemTemplate>
        <DataTemplate x:DataType="vm:Activity">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="3*"/>
                    <ColumnDefinition Width="1*"/>
                </Grid.ColumnDefinitions>
                <TextBlock x:Name="txt" Text="{x:Bind name}" Grid.Column="0"/>
                <Button x:Name="delItem" Click="delActivity" Grid.Column="1" Visibility="Collapsed" Background="Transparent" Margin="100, 0, 0, 0">
                    <SymbolIcon Symbol="Delete"/>
                </Button>
            </Grid>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

我要改变 delItem 按钮的能见度，但是从C＃我不能用集合称之为名称。我该怎么做？

I want to change the visibility of delItem button, but from C# I can't call it with set Name. How I can do that?

推荐答案

我建议用结合执行此操作。

I recommend to perform this operation by using binding.

a）新属性添加到名为可见类活动

a) Add a new property to your class Activity named Visible

public class Activity : INotifyPropertyChanged
{
    public string Name { get; set; }

    private bool _visible; 
    public bool Visible {
        get { return _visible; }
        set
        {
            _visible = value;
            RaisePropertyChanged("Visible");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected void RaisePropertyChanged(string name)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(name));
        }
    }
}

B）也声明一个新的类转换布尔能见度

b) Declare also a new class to convert boolean to visibility

public class BooleanToVisibilityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        return (value is bool && (bool)value) ? Visibility.Visible : Visibility.Collapsed;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        return value is Visibility && (Visibility)value == Visibility.Visible;
    }
}

C）和最后更新绑定。不要忘了单向模式设置。

c) And finally update your binding. Don't forget the OneWay mode setting.

<Page.Resources>
    <local:BooleanToVisibilityConverter x:Key="VisibilityConverter"/>
</Page.Resources>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <ListView ItemsSource="{x:Bind Activities}">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="local:Activity">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="3*"/>
                        <ColumnDefinition Width="1*"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock x:Name="txt" Text="{x:Bind Name}" Grid.Column="0"/>
                    <Button x:Name="delItem" Click="delItem_Click" Grid.Column="1" Visibility="{x:Bind Visible, Mode=OneWay, Converter={StaticResource VisibilityConverter}}" Background="Transparent" Margin="100, 0, 0, 0">
                        <SymbolIcon Symbol="Delete"/>
                    </Button>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

您现在可以通过code直接访问的可视性或控制。全code如下，以供参考。

You can now access the Visibility or your control directly by code. Full code below for reference.

using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

namespace App1
{
public sealed partial class MainPage : Page
{ 
    public List<Activity> Activities { get; set; }

    public MainPage()
    {
        this.InitializeComponent();

        Activities = new List<Activity>();
        Activities.Add(new Activity { Name = "Activity1", Visible = true });
        Activities.Add(new Activity { Name = "Activity2", Visible = false });
    }

    private void delItem_Click(object sender, RoutedEventArgs e)
    {
        Activities.First().Visible = false;
    }
}

public class BooleanToVisibilityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        return (value is bool && (bool)value) ? Visibility.Visible : Visibility.Collapsed;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        return value is Visibility && (Visibility)value == Visibility.Visible;
    }
}

public class Activity : INotifyPropertyChanged
{
    public string Name { get; set; }

    private bool _visible; 
    public bool Visible {
        get { return _visible; }
        set
        {
            _visible = value;
            RaisePropertyChanged("Visible");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected void RaisePropertyChanged(string name)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(name));
        }
    }
}
}

这篇关于删除的ListView项目按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！