<ListView SelectionMode="Multiple"> 时更改 ListViewItem 的布局

Question

我有一个 ListView，其中 SelectionMode 设置为 Multiple。这会在每个 ListViewItem 前面添加复选框。是否可以更改布局以便我可以更改复选框的颜色和位置？

你可以在这里看到我的 ListView 代码：

<ListView x:Name="lstCategories" Grid.Row="2" Margin="20,10,20,0" ItemsSource="{Binding Categories}" SelectionMode="Multiple">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
            </Style>

        </ListView.ItemContainerStyle>
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <TextBlock Text="{Binding}" Style="{StaticResource TextBlockStyle}" />
                    <Rectangle Style="{StaticResource DividerStyle}"/>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

运行此 XAML 时得到的结果是：http://i.stack.imgur.com/WYvUN.png， 但我需要这样的东西：http://i.stack.imgur.com/vmtaQ.png

我知道您可以调整模板以更改单个控件，但我不知道在 ListViewItem 中如何更改它。

Answer 1

  <Style TargetType="ListViewItem">
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="TabNavigation" Value="Local" />
            <Setter Property="IsHoldingEnabled" Value="False" />
            <Setter Property="Margin" Value="{ThemeResource ListViewItemMargin}" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Top" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <Border x:Name="OuterContainer" RenderTransformOrigin="0.5,0.5">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <PointerDownThemeAnimation Storyboard.TargetName="TiltContainer" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="CheckboxPressed">
                                        <Storyboard>
                                            <PointerDownThemeAnimation Storyboard.TargetName="CheckboxTiltContainer" />
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="NormalRectangle" Storyboard.TargetProperty="Fill">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedBackgroundThemeBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CheckGlyph" Storyboard.TargetProperty="Fill">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedForegroundThemeBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0"
                                                         Storyboard.TargetName="contentPresenter"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="{ThemeResource ListViewItemDisabledThemeOpacity}" />
                                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                                       Storyboard.TargetName="NormalRectangle"
                                                                       Storyboard.TargetProperty="Stroke">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledBorderThemeBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                                       Storyboard.TargetName="CheckGlyph"
                                                                       Storyboard.TargetProperty="Fill">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledForegroundThemeBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                                       Storyboard.TargetName="SelectedBorder"
                                                                       Storyboard.TargetProperty="BorderBrush">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                                       Storyboard.TargetName="SelectedEarmark"
                                                                       Storyboard.TargetProperty="Fill">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                                       Storyboard.TargetName="SelectedGlyph"
                                                                       Storyboard.TargetProperty="Fill">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition From="Pressed" To="Normal">
                                            <Storyboard>
                                                <PointerUpThemeAnimation Storyboard.TargetName="TiltContainer" />
                                            </Storyboard>
                                        </VisualTransition>
                                    </VisualStateGroup.Transitions>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="SelectionStates">
                                    <VisualState x:Name="Unselected" />
                                    <VisualState x:Name="Selected">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0"
                                                         Storyboard.TargetName="CheckGlyph"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="1" />
                                            <DoubleAnimation Duration="0"
                                                         Storyboard.TargetName="SelectedCheckMark"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="1" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="SelectedUnfocused">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0"
                                                         Storyboard.TargetName="CheckGlyph"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="1" />
                                            <DoubleAnimation Duration="0"
                                                         Storyboard.TargetName="SelectedCheckMark"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="1" />
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="DataVirtualizationStates">
                                    <VisualState x:Name="DataAvailable" />
                                    <VisualState x:Name="DataPlaceholder">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                                       Storyboard.TargetName="PlaceholderTextBlock"
                                                                       Storyboard.TargetProperty="Visibility">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                                       Storyboard.TargetName="PlaceholderRect"
                                                                       Storyboard.TargetProperty="Visibility">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="MultiSelectStates">
                                    <VisualState x:Name="NoMultiSelect" />
                                    <VisualState x:Name="ListMultiSelect">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0"
                                                         Storyboard.TargetName="CheckboxContainerTranslateTransform"
                                                         Storyboard.TargetProperty="X"
                                                         To="0" />
                                            <DoubleAnimation Duration="0"
                                                         Storyboard.TargetName="ContentBorderTranslateTransform"
                                                         Storyboard.TargetProperty="X"
                                                         To="{ThemeResource ListViewItemContentTranslateX}" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="GridMultiSelect">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0"
                                                         Storyboard.TargetName="SelectedBorder"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="1" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition From="ListMultiSelect"
                                                      GeneratedDuration="0:0:0.15"
                                                      To="NoMultiSelect" />
                                        <VisualTransition From="NoMultiSelect"
                                                      GeneratedDuration="0:0:0.15"
                                                      To="ListMultiSelect" />
                                    </VisualStateGroup.Transitions>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="ReorderModeStates">
                                    <VisualState x:Name="ReorderEnabled">
                                        <Storyboard>
                                            <DropTargetItemThemeAnimation Storyboard.TargetName="OuterContainer" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Reorderable">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ContentScaleTransform" Storyboard.TargetProperty="ScaleX">
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.075" Value="1.05" />
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.2" Value="1.0" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ContentScaleTransform" Storyboard.TargetProperty="ScaleY">
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.075" Value="1.05" />
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.2" Value="1.0" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="ReorderDisabled" />
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition From="ReorderEnabled"
                                                      GeneratedDuration="00:00:00.2"
                                                      To="ReorderDisabled" />
                                    </VisualStateGroup.Transitions>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="ReorderHintStates">
                                    <VisualState x:Name="NoReorderHint" />
                                    <VisualState x:Name="BottomReorderHint">
                                        <Storyboard>
                                            <DragOverThemeAnimation Direction="Bottom"
                                                                Storyboard.TargetName="ReorderHintContent"
                                                                ToOffset="{ThemeResource ListViewItemReorderHintThemeOffset}" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="RightReorderHint">
                                        <Storyboard>
                                            <DragOverThemeAnimation Direction="Right"
                                                                Storyboard.TargetName="ReorderHintContent"
                                                                ToOffset="{ThemeResource ListViewItemReorderHintThemeOffset}" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="TopReorderHint">
                                        <Storyboard>
                                            <DragOverThemeAnimation Direction="Top"
                                                                Storyboard.TargetName="ReorderHintContent"
                                                                ToOffset="0" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="LeftReorderHint">
                                        <Storyboard>
                                            <DragOverThemeAnimation Direction="Left"
                                                                Storyboard.TargetName="ReorderHintContent"
                                                                ToOffset="0" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="0:0:0.2" To="NoReorderHint" />
                                    </VisualStateGroup.Transitions>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border.RenderTransform>
                                <ScaleTransform x:Name="ContentScaleTransform" />
                            </Border.RenderTransform>
                            <Grid x:Name="ReorderHintContent" Background="Transparent">
                                <Border x:Name="CheckboxTiltContainer"
                                    Margin="{ThemeResource ListViewItemMultiselectCheckBoxMargin}"
                                    HorizontalAlignment="Left"
                                    VerticalAlignment="Top">
                                    <Border x:Name="CheckboxOuterContainer">
                                        <Border.Clip>
                                            <RectangleGeometry Rect="0,0,25.5,25.5" />
                                        </Border.Clip>
                                        <Grid x:Name="CheckboxContainer">
                                            <Grid.RenderTransform>
                                                <TranslateTransform x:Name="CheckboxContainerTranslateTransform" X="{ThemeResource ListViewItemContentOffsetX}" />
                                            </Grid.RenderTransform>
                                            <Rectangle x:Name="NormalRectangle"
                                                   Width="25.5"
                                                   Height="25.5"
                                                   Fill="{ThemeResource CheckBoxBackgroundThemeBrush}"
                                                   Stroke="{ThemeResource CheckBoxBorderThemeBrush}"
                                                   StrokeThickness="{ThemeResource CheckBoxBorderThemeThickness}" />
                                            <Path x:Name="CheckGlyph"
                                              Width="18.5"
                                              Height="17"
                                              HorizontalAlignment="Center"
                                              VerticalAlignment="Center"
                                              Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z"
                                              Fill="{ThemeResource CheckBoxForegroundThemeBrush}"
                                              FlowDirection="LeftToRight"
                                              IsHitTestVisible="False"
                                              Opacity="0"
                                              Stretch="Fill"
                                              StrokeLineJoin="Round"
                                              StrokeThickness="2.5" />
                                        </Grid>
                                    </Border>
                                </Border>
                                <Border x:Name="ContentContainer">
                                    <Border x:Name="TiltContainer">
                                        <Border x:Name="ContentBorder"
                                            Background="{TemplateBinding Background}"
                                            BorderBrush="{TemplateBinding BorderBrush}"
                                            BorderThickness="{TemplateBinding BorderThickness}">
                                            <Border.RenderTransform>
                                                <TranslateTransform x:Name="ContentBorderTranslateTransform" />
                                            </Border.RenderTransform>
                                            <Grid>
                                                <ContentPresenter x:Name="contentPresenter"
                                                              Margin="{TemplateBinding Padding}"
                                                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                                              Content="{TemplateBinding Content}"
                                                              ContentTemplate="{TemplateBinding ContentTemplate}"
                                                              ContentTransitions="{TemplateBinding ContentTransitions}" />

                                                <TextBlock x:Name="PlaceholderTextBlock"
                                                       Margin="{TemplateBinding Padding}"
                                                       AutomationProperties.AccessibilityView="Raw"
                                                       Foreground="{x:Null}"
                                                       IsHitTestVisible="False"
                                                       Opacity="0"
                                                       Text="Xg" />
                                                <Rectangle x:Name="PlaceholderRect"
                                                       Fill="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}"
                                                       IsHitTestVisible="False"
                                                       Visibility="Collapsed" />
                                            </Grid>
                                        </Border>
                                    </Border>
                                </Border>
                                <Border x:Name="SelectedBorder"
                                    BorderBrush="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}"
                                    BorderThickness="{ThemeResource GridViewItemMultiselectBorderThickness}"
                                    IsHitTestVisible="False"
                                    Opacity="0">
                                    <Grid x:Name="SelectedCheckMark"
                                      Width="34"
                                      Height="34"
                                      HorizontalAlignment="Right"
                                      VerticalAlignment="Top"
                                      Opacity="0">
                                        <Path x:Name="SelectedEarmark"
                                          Data="M0,0 L40,0 L40,40 z"
                                          Fill="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}"
                                          Stretch="Fill" />
                                        <Path x:Name="SelectedGlyph"
                                          Width="17"
                                          Height="14.5"
                                          Margin="0,1,1,0"
                                          HorizontalAlignment="Right"
                                          VerticalAlignment="Top"
                                          Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z"
                                          Fill="{ThemeResource ListViewItemCheckThemeBrush}"
                                          FlowDirection="LeftToRight"
                                          Stretch="Fill" />
                                    </Grid>
                                </Border>
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>