Question

我想更改复选框的模板，该模板在UWP的ListView上具有SelectionMode = Multiple的情况下显示。我不需要复选框，但需要自定义UI。我的应用程序从SelectionMode = None更改为SelectionMode = Multiple，然后返回，我想保留滑动动画。我的列表显示带有金额的项目，选择后，我要选择金额，而不是复选框。图片应该形象化我的想法： screenshot 我是否需要通过绑定到可见性来手工创建它？在这种情况下，如何创建“滑动”动画？

关于， user3650130

Answer 1

我将编辑答案以使其在以后完成。目前，我将首先分享方向。

实际上，您可以从（程序文件）\ Windows Kits \ 10 \ DesignTime \ CommonConfiguration \ Neutral \ UAP \\ Generic文件夹中找到generic.xaml
您将在其中看到带有x：key =“ ListViewItemExpanded”的ListviewItem样式，此文件将在以后使用。

在代码中说，如果您具有列表视图，则可以将上述样式放入itemcontainerstyle中，例如：

 <ListView  SelectionMode="Multiple">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
                <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
                <Setter Property="BorderBrush" Value="{x:Null}" />
                <Setter Property="BorderThickness" Value="0" />
                <Setter Property="Background" Value="Transparent" />
                <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
                <Setter Property="TabNavigation" Value="Local" />
                <Setter Property="IsHoldingEnabled" Value="True" />
                <Setter Property="Padding" Value="12,0,12,0" />
                <Setter Property="HorizontalContentAlignment" Value="Left" />
                <Setter Property="VerticalContentAlignment" Value="Center" />
                <Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}" />
                <Setter Property="MinHeight" Value="{ThemeResource ListViewItemMinHeight}" />
                <Setter Property="AllowDrop" Value="False" />
                <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
                <Setter Property="FocusVisualMargin" Value="0" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListViewItem">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="80"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <ComboBox Grid.Column="0">
                                    <x:String>1</x:String>
                                    <x:String>2</x:String>
                                </ComboBox>
                                <ContentPresenter Grid.Column="1"/>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ListView.ItemContainerStyle>

        <x:String>1</x:String>
        <x:String>2</x:String>
        <x:String>3</x:String>
        <x:String>4</x:String>
        <x:String>5</x:String>
        <x:String>6</x:String>
    </ListView>

您会发现您只能看到自己的内容，对吗？这里的实际问题与 MultiSelectSquare 有关，边框是样式中的fonticon，它控制此处的复选框的行为。我们需要删除它，然后将combox放在那里。但这会导致异常，因为某些转换/动画的目标是此边界。我们需要对其进行修改以使其起作用。您可以先从这个方向开始。

我修改了上面的代码，并在控制模板中添加了以下行：

                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="80"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <ComboBox Grid.Column="0">
                                <x:String>1</x:String>
                                <x:String>2</x:String>
                            </ComboBox>
                            <ContentPresenter Grid.Column="1"/>
                        </Grid>

如您所见，如果添加它，您将同时看到内容和组合框。但是，正如我已经提到的，如果只是这样做，我们将错过功能和动画，我们还需要基于默认样式来修改视觉状态。

好。因此，您现在了解了关键点。然后，我们需要考虑默认模板，请从generic.xaml搜索ListViewItemExpanded资源。注意边界称为“ MultiSelectSquare”吗？与动画有关的有四件事：“ MultiSelectSquare”“ MultiSelectClipTransform”“ MultiSelectCheckBoxTransform”“ MultiSelectCheck”。一个简单的演示就像将FontIcon替换为Combobox，但将MultiSelectCheck保留为Combobox的名称。然后删除visualstategroup中有关MultiSelectCheck的所有动画。您将看到尽管显示了一个复选框，但单击它实际上是弹出一个combox。

但是对于复杂的演示，您必须为每种状态自己编写自己的动画。

更改ListView SelectionMode模板

1 个答案: