更改 ListView 项目选择样式 [英] Change ListView item selection style

问题描述

如何在 Windows 应用商店应用程序的 ListView 中更改 ListView 项目选择样式?我想更改颜色、边距并删除复选框.我试图在 Blend 中更改各种模板，但我无法弄清楚这个 :-(.

How do I change the ListView item selection style in a ListView in a Windows Store app? I want to change color, margins and remove the checkbox. I have tried to change all kinds of templates in Blend but I can’t figure out this one :-(.

XAML 代码:

<Page
x:Class="WindowsStoreListViewSelectionTest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:WindowsStoreListViewSelectionTest"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Page.DataContext>
    <local:BasicData/>
</Page.DataContext>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <ListView ItemsSource="{Binding ListData}" SelectedIndex="1">
    </ListView>
</Grid>

C# 代码:

public class BasicData
{
    public BasicData()
    {
        _ListData = new ObservableCollection<object>();
        ListData.Add("Alfa");
        ListData.Add("Beta");
        ListData.Add("Gamma");
    }

    private ObservableCollection<object> _ListData;

    public ObservableCollection<object> ListData
    {
        get
        {
            return _ListData;
        }
    }
}

推荐答案

所以问题终于解决了:-).这是针对 Windows 8.1 项目的其他初学者的分步指南.它适用于 Blend(一个很棒的工具 - 花一些时间来学习如何使用它)但我很确定它在 Visual Studio 中或多或少是相同的.

So the problem was finally solved :-). Here is a step-by-step guide for other beginners with a Windows 8.1 project. It’s for Blend (a great tool – spend some time to learn how to use it) but I’m pretty sure it’s more or less the same for Visual Studio.

右键单击列表视图并选择:

Right click on the list view and select:

• 编辑其他模板
• 编辑生成的项目容器 (ItemContainerStyle)
• 编辑副本
• 输入名称

然后生成的样式如下所示:

Then a style is generated that looks like this:

<Style x:Key="ListViewItemStyle1" 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="True"/>
    <Setter Property="Margin" Value="0,0,18,2"/>
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="VerticalContentAlignment" Value="Top"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListViewItem">
                <ListViewItemPresenter 
                    CheckHintBrush="{ThemeResource ListViewItemCheckHintThemeBrush}" 
                    CheckBrush="{ThemeResource ListViewItemCheckThemeBrush}" 
                    ContentMargin="4" 
                    ContentTransitions="{TemplateBinding ContentTransitions}" 
                    CheckSelectingBrush="{ThemeResource ListViewItemCheckSelectingThemeBrush}" 
                    DragForeground="{ThemeResource ListViewItemDragForegroundThemeBrush}" 
                    DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}" 
                    DragBackground="{ThemeResource ListViewItemDragBackgroundThemeBrush}" 
                    DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}" 
                    FocusBorderBrush="{ThemeResource ListViewItemFocusBorderThemeBrush}" 
                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
                    Padding="{TemplateBinding Padding}" 
                    PointerOverBackgroundMargin="1" 
                    PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}" 
                    PointerOverBackground="{ThemeResource ListViewItemPointerOverBackgroundThemeBrush}" 
                    ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}" 
                    SelectedPointerOverBorderBrush="{ThemeResource ListViewItemSelectedPointerOverBorderThemeBrush}" 
                    SelectionCheckMarkVisualEnabled="True" 
                    SelectedForeground="{ThemeResource ListViewItemSelectedForegroundThemeBrush}" 
                    SelectedPointerOverBackground="{ThemeResource ListViewItemSelectedPointerOverBackgroundThemeBrush}" 
                    SelectedBorderThickness="{ThemeResource ListViewItemCompactSelectedBorderThemeThickness}" 
                    SelectedBackground="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}" 
                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

通过更改 SelectionCheckMarkVisualEnabled 值可以轻松删除复选标记.

The check mark is easily removed by changing the SelectionCheckMarkVisualEnabled value.

这篇关于更改 ListView 项目选择样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！