当鼠标悬停时,我希望更改我的ComboBox
箭头
的颜色。目前我只发现在箭头周围有一个小正方形
,并在Mouse Over
为True
时更改它:
<Trigger Property="UIElement.IsMouseOver" Value="True">
<Setter Property="Panel.Background" TargetName="ButtonBorder" Value="White"/>
</Trigger>
当Mouse Over
为false
时:
<Trigger Property="UIElement.IsMouseOver" Value="false">
<Setter Property="Panel.Background" TargetName="ButtonBorder" Value="Transparent"/>
</Trigger>
Edit
<ControlTemplate TargetType="ToggleButton" x:Key="ComboBoxToggleButtonTemplate"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition Width="20" /> </Grid.ColumnDefinitions> <Border Grid.ColumnSpan="2" Name="Border" BorderBrush="{StaticResource ComboBoxNormalBorderBrush}" CornerRadius="0" BorderThickness="1, 1, 1, 1" Background="Transparent" /> <Border Grid.Column="1" Margin="1, 1, 1, 1" BorderBrush="#444" Name="ButtonBorder" CornerRadius="0, 0, 0, 0" BorderThickness="0, 0, 0, 0" Background="#FF998F8F" /> <Path Name="Arrow" Grid.Column="1" Data="M0,0 L0,2 L4,6 L8,2 L8,0 L4,4 z" HorizontalAlignment="Center" Fill="#444" VerticalAlignment="Center" /> </Grid> <ControlTemplate.Triggers> <Trigger Property="UIElement.IsMouseOver" Value="True"> <Setter Property="Panel.Background" TargetName="ButtonBorder" Value="Transparent"/> <Setter Property="Shape.Fill" TargetName="Arrow" Value="Gainsboro"/> </Trigger> <Trigger Property="UIElement.IsMouseOver" Value="false"> <Setter Property="Panel.Background" TargetName="ButtonBorder" Value="Transparent"/> <Setter Property="Shape.Fill" TargetName="Arrow" Value="Gray"/> </Trigger> <Trigger Property="ToggleButton.IsChecked" Value="True"> <Setter Property="Panel.Background" TargetName="ButtonBorder" Value="WhiteSmoke"/> <Setter Property="Shape.Fill" TargetName="Arrow" Value="#FF8D979E"/> </Trigger> <Trigger Property="UIElement.IsEnabled" Value="False"> <Setter Property="Panel.Background" TargetName="Border" Value="{StaticResource ComboBoxDisabledBackgroundBrush}"/> <Setter Property="Panel.Background" TargetName="ButtonBorder" Value="{StaticResource ComboBoxDisabledBackgroundBrush}"/> <Setter Property="Border.BorderBrush" TargetName="ButtonBorder" Value="{StaticResource ComboBoxDisabledBorderBrush}"/> <Setter Property="TextElement.Foreground" Value="{StaticResource ComboBoxDisabledForegroundBrush}"/> <Setter Property="Shape.Fill" TargetName="Arrow" Value="#999"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> <Style TargetType="{x:Type ComboBox}" > <Setter Property="UIElement.SnapsToDevicePixels" Value="True"/> <Setter Property="FrameworkElement.OverridesDefaultStyle" Value="True"/> <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/> <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/> <Setter Property="ScrollViewer.CanContentScroll" Value="True"/> <Setter Property="TextElement.Foreground" Value="Black"/> <Setter Property="FrameworkElement.FocusVisualStyle" Value="{x:Null}"/> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate TargetType="ComboBox"> <Grid> <ToggleButton Name="ToggleButton" Grid.Column="2" ClickMode="Press" Focusable="False" IsChecked="{Binding Path=IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" Template="{StaticResource ComboBoxToggleButtonTemplate}"/> <ContentPresenter Name="ContentSite" Margin="5, 3, 23, 3" IsHitTestVisible="False" HorizontalAlignment="Left" VerticalAlignment="Center" Content="{TemplateBinding ComboBox.SelectionBoxItem}" ContentTemplate="{TemplateBinding ComboBox.SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"/> <TextBox Name="PART_EditableTextBox" Margin="3, 3, 23, 3" IsReadOnly="{TemplateBinding IsReadOnly}" Visibility="Hidden" Background="Transparent" HorizontalAlignment="Left" VerticalAlignment="Center" Focusable="True" > <TextBox.Template> <ControlTemplate TargetType="TextBox" > <Border Name="PART_ContentHost" Focusable="False" /> </ControlTemplate> </TextBox.Template> </TextBox> <!-- Popup showing items --> <Popup Name="Popup" Placement="Bottom" Focusable="False" AllowsTransparency="True" IsOpen="{TemplateBinding ComboBox.IsDropDownOpen}" PopupAnimation="Slide" > <Grid Name="DropDown" SnapsToDevicePixels="True" MinWidth="{TemplateBinding FrameworkElement.ActualWidth}" MaxHeight="{TemplateBinding ComboBox.MaxDropDownHeight}"> <Border Name="DropDownBorder" Background="Transparent" Margin="0, 1, 0, 0" CornerRadius="0" BorderThickness="1,1,1,1" BorderBrush="{StaticResource ComboBoxNormalBorderBrush}"/> <ScrollViewer Margin="4" SnapsToDevicePixels="True"> <ItemsPresenter KeyboardNavigation.DirectionalNavigation="Contained" /> </ScrollViewer> </Grid> </Popup> </Grid> <ControlTemplate.Triggers> <Trigger Property="ItemsControl.HasItems" Value="False"> <Setter Property="FrameworkElement.MinHeight" TargetName="DropDownBorder" Value="95"/> </Trigger> <Trigger Property="UIElement.IsEnabled" Value="False"> <Setter Property="TextElement.Foreground" Value="{StaticResource ComboBoxDisabledForegroundBrush}"/> </Trigger> <Trigger Property="ItemsControl.IsGrouping" Value="True"> <Setter Property="ScrollViewer.CanContentScroll" Value="False"/> </Trigger> <Trigger Property="ComboBox.IsEditable" Value="True"> <Setter Property="KeyboardNavigation.IsTabStop" Value="False"/> <Setter Property="UIElement.Visibility" TargetName="PART_EditableTextBox" Value="Visible"/> <Setter Property="UIElement.Visibility" TargetName="ContentSite" Value="Hidden"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- endregion -->
顺便说一下,我还想在鼠标悬停时更改Border
的颜色。