WPF在触发器中设置ListBoxItem背景

时间:2013-06-11 18:15:13

标签: wpf background triggers

我正在对我在相关stackoverflow帖子上找到的代码做一点修改。我使用触发器对IsMouseOver和IsSelected上的ListBoxItem背景进行了细微更改。在我的版本中,我想使用渐变作为背景:

  <Style x:Key="ListboxItemStyle" TargetType="{x:Type ListBoxItem}">
        <Setter Property="Margin" Value="1,2,1,1"/>
        <Setter Property="HorizontalAlignment" Value="Stretch" />
        <Setter Property="Background" Value="White" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListBoxItem}">
                    <Grid>
                        <Border Background="{TemplateBinding Background}" />
                        <Border Background="LightGray" Margin="0,0">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition />
                                    <RowDefinition />
                                </Grid.RowDefinitions>
                                <!--<Border Margin="2,1,2,0" Grid.Row="0" Background="#57FFFFFF" />-->
                                <Border Margin="2,1,2,0" Grid.Row="0">
                                   <Border.Background >
                                        <LinearGradientBrush StartPoint=".5,0" EndPoint="0.5,1" >
                                            <GradientStop Color="White" Offset="0" />
                                            <GradientStop Color="LightGray" Offset="1" />
                                        </LinearGradientBrush>
                                    </Border.Background>
                                </Border>
                            </Grid>
                        </Border>
                        <ContentPresenter Margin="0,5" />
                    </Grid>
                    <ControlTemplate.Triggers>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsMouseOver" Value="True" />
                                <Condition Property="IsSelected" Value="False"/>
                            </MultiTrigger.Conditions>
                            <!--<Setter Property="Background" Value="#CCCBAF00" />
                            <Setter Property="Opacity" Value="0.8" />-->
                           <Setter Property="Background">
                                <Setter.Value>
                                    <LinearGradientBrush StartPoint=".5,0" EndPoint="0.5,1" Opacity="0.8">
                                        <GradientStop Color="#CCC9BA5C" Offset="0" />
                                        <GradientStop Color="#CCCBAF00" Offset="1" />
                                    </LinearGradientBrush>
                                </Setter.Value>
                           </Setter>
                        </MultiTrigger>
                        <Trigger Property="IsSelected" Value="True">
                            <!--<Setter Property="Background" Value="#CCCB6400" />
                            <Setter Property="Opacity" Value="0.8" />-->
                            <Setter Property="Background">
                                <Setter.Value>
                                    <LinearGradientBrush StartPoint=".5,0" EndPoint="0.5,1" Opacity="0.8">
                                        <GradientStop Color="#CCCD8B4C" Offset="0" />
                                        <GradientStop Color="#CCCB6400" Offset="1" />
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="ListBoxStyle" TargetType="{x:Type ListBox}">
        <Setter Property="ItemContainerStyle" Value="{DynamicResource ListboxItemStyle}" />
        <Setter Property="Margin" Value="3,3,2,1" />
    </Style>

但它不适用于此修改。谢谢!

2 个答案:

答案 0 :(得分:2)

只需切换

<Border Background="LightGray" Margin="0,0">

类似

<Border Background="LightGray" Margin="0,0" Opacity="0.5">

制作^^ Border透视

答案 1 :(得分:1)

我可以看到你有一个Border控件重叠另一个。第一个边框(其背景绑定到模板)将永远不可见。因此,当您在触发器中更改ListBoxItem的背景时,您看不到它,因为它隐藏在另一个边框下方。 您可以只有一个边框控件,也可以将第二个边框控件的可见性设置为隐藏在触发器中。