3

我有以下样式和列表框：

<Style x:Key="LwHListBoxItemStyle" TargetType="ListBoxItem">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="VerticalContentAlignment" Value="Top"/>
    <Setter Property="Padding" Value="24, 0, 24, 0" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListBoxItem">
                <Border x:Name="LayoutRoot" BorderBrush="#FFCCCCCC" BorderThickness="0, 0, 0, 1" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver"/>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TransparentBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Duration="0" To=".5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ContentContainer"/>
                                    <DoubleAnimation Duration="0" To="0.6" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="LayoutRoot" d:IsOptimized="True"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<ListBox x:Name="lbxContainer" Height="Auto" Width="Auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" VerticalAlignment="Top" ItemContainerStyle="{StaticResource LwHListBoxItemStyle}" />

我使用 Expression Blend 来创建样式。我希望 ListBoxItem 在禁用时具有 60% 的不透明度。我正在使用 ListBoxItems 以编程方式填充 ListBox，这些 ListBoxItems 根据某些条件设置了 IsEnabled 属性。我已经通过调试器并确认 ListBoxItems 确实有 IsEnabled = false，所以我的结论是我的 xaml 一定有问题。是否有什么我遗漏或做错了导致项目在禁用时变得不透明？

ListBox 位于白色背景上，内容为黑色文本。不透明度应该使它变灰。如果我将不透明度添加到正常的视觉状态，它会按正常状态显示，但也会显示为禁用状态。我知道禁用的项目实际上是禁用的，因为我无法单击它们。我认为下面的代码会将正常状态显示为不透明但禁用不透明的项目。

<VisualState x:Name="Normal">
    <Storyboard>
        <DoubleAnimation Duration="0" To="0.6" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="LayoutRoot" d:IsOptimized="True"/>
    </Storyboard>
</VisualState>

更新：我很确定我的禁用状态有问题。即使我将背景更改为蓝色，我在禁用状态下添加的任何内容都不会保留。我正在以编程方式创建 ListBoxItems 并将内容属性设置为我创建的用户控件。这会引起问题吗？这对我来说没有意义，因为我可以将正常状态设置为 60% 的不透明度并且它可以工作，那么为什么禁用状态不能呢？

4

2 回答 2

1

您不应该在控件模板中使用 ContentControl。您应该改用 ContentPresenter。通过让 ContentControl 显示另一个 ContentControl 的内容，您可能会遇到奇怪的问题。

除此之外，如果 ListBoxItem.Content 不是控件，ListBoxItem 只会进入“禁用”状态。如果 ListBoxItem.Content 是一个控件，那么即使 ListBoxItem.IsEnabled 为 false，它也会转换为“正常”状态。

于 2011-03-05T00:50:32.367 回答
0

您已经为 ListBoxItem 创建了样式，但没有为 ListBox 本身创建样式。而且你不必，必然。问题是默认情况下 ListBox 具有白色背景。

所以第一步是像这样将 ListBox 背景设置为透明...

<ListBox x:Name="lbxContainer" Background="Transparent" Height="Auto" Width="Auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" VerticalAlignment="Top" ItemContainerStyle="{StaticResource LwHListBoxItemStyle}" />

然后我只是对您的 ListBoxItem 样式进行了一些更改...

<Style x:Key="LwHListBoxItemStyle" TargetType="ListBoxItem">
    <Setter Property="Background" Value="White"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="VerticalContentAlignment" Value="Top"/>
    <Setter Property="Padding" Value="24, 0, 24, 0" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListBoxItem">
                <Border x:Name="LayoutRoot" BorderBrush="#FFCCCCCC" Background="{TemplateBinding Background}" BorderThickness="0, 0, 0, 1" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver"/>
                            <VisualState x:Name="Disabled">
                                <Storyboard>                                            
                                    <DoubleAnimation Duration="0" To="0.6" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="LayoutRoot" />
                                    <DoubleAnimation Duration="0" To="0.6" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ContentContainer"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

现在只要 ListBox 周围的容器不是白色的，由于 Opacity 设置，禁用的 ListBoxItem 应该看起来是半透明的。

例如...

<Grid Background="Black">
    <ListBox x:Name="lbxContainer" Background="Transparent" Height="Auto" Width="Auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" VerticalAlignment="Top" ItemContainerStyle="{StaticResource LwHListBoxItemStyle}">
        <ListBoxItem Content="enabled a" />
        <ListBoxItem Content="disabled b" IsEnabled="False"/>
        <ListBoxItem Content="enabled c"/>
    </ListBox>
</Grid>

会是这个样子...

残疾人风格

于 2011-02-16T02:00:37.920 回答