列表框项容器样式，带转换器的数据模板

本文关键字：转换器 数据 样式 列表 | 更新日期: 2023-09-27 17:52:50

我有数据模板和转换器嵌入列表框。

<DataTemplate x:Key="DataTemplate">
            <Border x:Name="ListItemBorder" 
                    Margin="0,2,0,0" 
                    VerticalAlignment="Stretch"
                    HorizontalAlignment="Stretch"
                    Background="{Binding Converter={StaticResource BackgroundConvertor}}">
                <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
                    <TextBlock...
                    <Image ...
                </Grid>
            </Border>
        </DataTemplate>

上面代码中的转换器BackgroundConvertor将在列表框的4项中添加2项绿色作为背景。

当我们点击项目时，我也给列表框应用了样式。

<Style x:Key="ListItemSelectorStyle" TargetType="ListBoxItem">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property ="Foreground" Value="Black" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBoxItem">
                        <Border x:Name="ListBoxItem" Background="{TemplateBinding Background}" 
                                    HorizontalAlignment="{TemplateBinding HorizontalAlignment}" 
                                    VerticalAlignment="{TemplateBinding VerticalAlignment}" 
                                    BorderBrush="{TemplateBinding BorderBrush}" 
                                    BorderThickness="{TemplateBinding BorderThickness}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListItemBorder" Storyboard.TargetProperty="Background">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="#c9ebf2" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="SelectionStates">
                                    <VisualState x:Name="Unselected"/>
                                    <VisualState x:Name="Selected">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListItemBorder" Storyboard.TargetProperty="Background">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="#c9ebf2" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="ListItemBorder" 
                                    BorderBrush="Transparent" Background="#e3e8f0">
                                <ContentControl x:Name="ContentContainer" 
                                                ContentTemplate="{TemplateBinding ContentTemplate}" 
                                                Content="{TemplateBinding Content}" 
                                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
                                                Margin="{TemplateBinding Padding}" 
                                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </Border>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

当我点击列表项时，样式根本没有被应用。该样式将为所选项目设置背景。

我做错了什么?

我正在开发Windows Phone 8应用程序。

列表框项容器样式，带转换器的数据模板

你必须修改你的VisualState代码:

Storyboard.TargetProperty="{TemplateBinding Background}"

使用绑定和转换器时必须设置Path属性:

Background="{Binding Converter={StaticResource BackgroundConvertor}, Path=PROPERTY}"
相关文章：