Question

我有一个列表视图，该列表视图的数据模板在该滑动控件中具有一个Swipe Control和一个文本块。现在，“滑动”控件的“正确项目”中有3个项目，例如： 1.添加 2.编辑 3.删除

我想根据条件显示正确的项目。如果文本块没有字符串，则在向右滑动时仅显示“添加”。如果文本块中存在字符串，则在滑动时显示其他2。

通过滑动控件在UWP中有什么方法可以实现这一点吗？

Answer 1

您可以使用绑定根据绑定到Textblock的{{1}}属性的模型内容来更改SwipeControl的滑动项目编号。

以下是澄清示例：

在App.xaml中，添加Text资源，

SwipeItems

这里是<Application.Resources> <SymbolIconSource x:Key="AddIcon" Symbol="Add"/> <SymbolIconSource x:Key="EditIcon" Symbol="Edit"/> <SymbolIconSource x:Key="DeleteIcon" Symbol="Delete"/> <SwipeItems x:Key="ThreeItems" Mode="Reveal"> <SwipeItem Text="Edit" IconSource="{StaticResource EditIcon}"/> <SwipeItem Text="Delete" IconSource="{StaticResource DeleteIcon}"/> <SwipeItem Text="Add" IconSource="{StaticResource AddIcon}"/> </SwipeItems> <SwipeItems x:Key="OneItem" Mode="Reveal"> <SwipeItem Text="Add" IconSource="{StaticResource AddIcon}"/> </SwipeItems> </Application.Resources>类，该类绑定到ListView的项目：

Model

在MainPage.xaml中，有一个ListView，

public class Model
{
    public string Content { get; set; }
    public SwipeItems Swips
    {
        get
        {
            if (string.IsNullOrEmpty(Content))
            {
                return (SwipeItems)Application.Current.Resources["OneItem"];
            }
            else
            {
                return (SwipeItems)Application.Current.Resources["ThreeItems"];
            }
        }
    }
}

这是MainPage.xaml.cs，

<ListView x:Name="sampleList" ItemsSource="{x:Bind ListSource}">
    <ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        </Style>
    </ListView.ItemContainerStyle>
    <ListView.ItemTemplate>
        <DataTemplate x:DataType="local:Model">
            <SwipeControl x:Name="ListViewSwipeContainer"
                      LeftItems="{x:Bind Swips}"
                      Height="60">
                <StackPanel Orientation="Vertical">
                    <TextBlock Text="{x:Bind Content}" FontSize="18"/>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="Text Item details" FontSize="12"/>
                    </StackPanel>
                </StackPanel>
            </SwipeControl>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

相反，您还可以通过使用ListView的ItemTemplateSelector属性引用不同的ListView ItemTemplate来实现此效果。您需要实现自己的DataTemplateSelector，以根据Model的内容为空还是空返回相应的public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); ListSource = new ObservableCollection<Model>(); ListSource.Add(new Model { Content = "first" }); ListSource.Add(new Model { }); ListSource.Add(new Model { Content = "Second" }); ListSource.Add(new Model { Content = "Third" }); } public ObservableCollection<Model> ListSource; }。

UWP滑动控件-根据条件列出项目

1 个答案: