第一个话说看起来效果不错,不过就是鼠标点击的时候无法改变颜色,
第二个虽然样式有些差,但是可以把第一个的样式放到下面去就OK了。
具体效果看这里
http://bbs.csdn.net/topics/390328614
这个是自己曾经遇到的问题,非常感谢2位大神的帮助,下面是2个源码,直接贴上去就可以运行
<UserControl.Resources> <Style x:Key="ListBoxItemStyle1" targettype="ListBoxItem"> <Setter Property="Padding" Value="3"/> <Setter Property="HorizontalContentAlignment" Value="Left"/> <Setter Property="VerticalContentAlignment" Value="Top"/> <Setter Property="Background" Value="Transparent"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="TabNavigation" Value="Local"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate targettype="ListBoxItem"> <Grid Background="{TemplateBinding Background}"> <visualstatemanager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="normal"/> <VisualState x:Name="MouSEOver"> <Storyboard> <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="rectangle"> <EasingColorKeyFrame KeyTime="0" Value="#FF90322A"/> <EasingColorKeyFrame KeyTime="0:0:0.4" Value="White"/> </ColorAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="disabled"/> </VisualStateGroup> <VisualStateGroup x:Name="SelectionStates"> <VisualState x:Name="Unselected"/> <VisualState x:Name="Selected"/> </VisualStateGroup> <VisualStateGroup x:Name="Focusstates"> <VisualState x:Name="Focused"/> <VisualState x:Name="Unfocused"/> </VisualStateGroup> </visualstatemanager.VisualStateGroups> <Rectangle x:Name="rectangle" Width="75" Height="25" RadiusX="5" RadiusY="5" stroke="Black" Margin="52,69,0"> <Rectangle.Fill> <LinearGradientBrush StartPoint="1,0"> <GradientStop Color="#BD5E54" Offset="0.0"/> <GradientStop Color="#90322A" Offset="0.9"/> </LinearGradientBrush> </Rectangle.Fill> </Rectangle> <TextBlock Text="{Binding FunctionName}" HorizontalAlignment="Center"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </UserControl.Resources> <Grid x:Name="LayoutRoot" Background="White"> <ListBox HorizontalAlignment="Left" Height="100" VerticalAlignment="Top" Width="200" ItemContainerStyle="{StaticResource ListBoxItemStyle1}" > <ListBoxItem Content="ListBoxItem"/> <ListBoxItem Content="ListBoxItem"/> <ListBoxItem Content="ListBoxItem"/> <ListBoxItem Content="ListBoxItem"/> </ListBox> <Button Content="Button" HorizontalAlignment="Center" VerticalAlignment="Center" Width="75" Visibility="Collapsed"/> </Grid> </UserControl>
第二个
<UserControl.Resources> <Style x:Key="ListBoxItemStyle1" targettype="ListBoxItem"> <Setter Property="Padding" Value="3"/> <Setter Property="HorizontalContentAlignment" Value="Left"/> <Setter Property="VerticalContentAlignment" Value="Top"/> <Setter Property="Background" Value="Transparent"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="TabNavigation" Value="Local"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate targettype="ListBoxItem"> <Grid Background="{TemplateBinding Background}"> <visualstatemanager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="normal"/> <VisualState x:Name="MouSEOver"> <Storyboard> <DoubleAnimation Duration="0" To=".35" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="fillColor"/> </Storyboard> </VisualState> <VisualState x:Name="disabled"> <Storyboard> <DoubleAnimation Duration="0" To=".55" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="contentPresenter"/> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="SelectionStates"> <VisualState x:Name="Unselected"/> <VisualState x:Name="Selected"> <Storyboard> <DoubleAnimation Duration="0" To=".75" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="fillColor2"/> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="Focusstates"> <VisualState x:Name="Focused"> <Storyboard> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Visibility" Storyboard.TargetName="FocusVisualElement"> <discreteObjectKeyFrame KeyTime="0"> <discreteObjectKeyFrame.Value> <Visibility>Visible</Visibility> </discreteObjectKeyFrame.Value> </discreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="Unfocused"/> </VisualStateGroup> </visualstatemanager.VisualStateGroups> <!--以下两句是关键!!--> <Rectangle x:Name="fillColor" Fill="#FFff0000" IsHitTestVisible="False" Opacity="0" RadiusY="1" RadiusX="1"/> <Rectangle x:Name="fillColor2" Fill="#FF00ff00" IsHitTestVisible="False" Opacity="0" RadiusY="1" RadiusX="1"/> <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}"/> <Rectangle x:Name="FocusVisualElement" RadiusY="1" RadiusX="1" stroke="#FF6DBDD1" strokeThickness="1" Visibility="Collapsed"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </UserControl.Resources>