我正在努力处理ComboBox控件的样式,更具体地说,是从下拉菜单中选择项的背景色。所选项目是否采用特定的主题键颜色?在下面的例子中,我想改变的背景颜色是浅灰色。
3df52oht1#
如果你想改变ComboBoxItem的风格,你需要修改ComboBoxItem的默认风格。ComboBoxItem使用一些系统值作为不同状态的背景。我做了一个简单的演示,你可以参考。
ComboBoxItem
XAML:
<Page.Resources> <Style TargetType="ComboBoxItem" x:Key="MyItemStyle"> <Setter Property="Foreground" Value="{ThemeResource ComboBoxItemForeground}" /> <Setter Property="Background" Value="{ThemeResource ComboBoxItemRevealBackground}" /> <Setter Property="BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrush}" /> <Setter Property="BorderThickness" Value="{ThemeResource ComboBoxItemRevealBorderThemeThickness}" /> <Setter Property="TabNavigation" Value="Local" /> <Setter Property="Padding" Value="{ThemeResource ComboBoxItemRevealThemePadding}" /> <Setter Property="HorizontalContentAlignment" Value="Stretch" /> <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ComboBoxItem"> <Grid x:Name="LayoutRoot" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Control.IsTemplateFocusTarget="True"> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="LayoutRoot" /> </Storyboard> </VisualState> <VisualState x:Name="PointerOver"> <VisualState.Setters> <Setter Target="LayoutRoot.(RevealBrush.State)" Value="PointerOver" /> <Setter Target="LayoutRoot.Background" Value="Azure" /> <Setter Target="LayoutRoot.BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrushPointerOver}" /> <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ComboBoxItemForegroundPointerOver}" /> </VisualState.Setters> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="LayoutRoot" /> </Storyboard> </VisualState> <VisualState x:Name="Disabled"> <VisualState.Setters> <Setter Target="LayoutRoot.Background" Value="{ThemeResource ComboBoxItemRevealBackgroundDisabled}" /> <Setter Target="LayoutRoot.BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrushDisabled}" /> <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ComboBoxItemForegroundDisabled}" /> </VisualState.Setters> </VisualState> <VisualState x:Name="Pressed"> <VisualState.Setters> <Setter Target="LayoutRoot.Background" Value="{ThemeResource ComboBoxItemRevealBackgroundPressed}" /> <Setter Target="LayoutRoot.BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrushPressed}" /> <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ComboBoxItemForegroundPressed}" /> <Setter Target="LayoutRoot.(RevealBrush.State)" Value="Pressed" /> </VisualState.Setters> <Storyboard> <PointerDownThemeAnimation Storyboard.TargetName="LayoutRoot" /> </Storyboard> </VisualState> <VisualState x:Name="Selected"> <VisualState.Setters> <Setter Target="LayoutRoot.Background" Value="Yellow" /> <Setter Target="LayoutRoot.BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrushSelected}" /> <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ComboBoxItemForegroundSelected}" /> </VisualState.Setters> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="LayoutRoot" /> </Storyboard> </VisualState> <VisualState x:Name="SelectedUnfocused"> <VisualState.Setters> <Setter Target="LayoutRoot.Background" Value="{ThemeResource ComboBoxItemRevealBackgroundSelectedUnfocused}" /> <Setter Target="LayoutRoot.BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrushSelectedUnfocused}" /> <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ComboBoxItemForegroundSelectedUnfocused}" /> </VisualState.Setters> </VisualState> <VisualState x:Name="SelectedDisabled"> <VisualState.Setters> <Setter Target="LayoutRoot.Background" Value="{ThemeResource ComboBoxItemRevealBackgroundSelectedDisabled}" /> <Setter Target="LayoutRoot.BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrushSelectedDisabled}" /> <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ComboBoxItemForegroundSelectedDisabled}" /> </VisualState.Setters> </VisualState> <VisualState x:Name="SelectedPointerOver"> <VisualState.Setters> <Setter Target="LayoutRoot.Background" Value="Red" /> <Setter Target="LayoutRoot.BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrushSelectedPointerOver}" /> <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ComboBoxItemForegroundSelectedPointerOver}" /> <Setter Target="LayoutRoot.(RevealBrush.State)" Value="PointerOver" /> </VisualState.Setters> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="LayoutRoot" /> </Storyboard> </VisualState> <VisualState x:Name="SelectedPressed"> <VisualState.Setters> <Setter Target="LayoutRoot.Background" Value="Green" /> <Setter Target="LayoutRoot.BorderBrush" Value="{ThemeResource ComboBoxItemRevealBorderBrushSelectedPressed}" /> <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ComboBoxItemForegroundSelectedPressed}" /> <Setter Target="LayoutRoot.(RevealBrush.State)" Value="Pressed" /> </VisualState.Setters> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="InputModeStates"> <VisualState x:Name="InputModeDefault" /> <VisualState x:Name="TouchInputMode"> <VisualState.Setters> <Setter Target="ContentPresenter.Margin" Value="{ThemeResource ComboBoxItemRevealThemeTouchPadding}" /> </VisualState.Setters> </VisualState> <VisualState x:Name="GameControllerInputMode"> <VisualState.Setters> <Setter Target="ContentPresenter.Margin" Value="{ThemeResource ComboBoxItemRevealThemeGameControllerPadding}" /> </VisualState.Setters> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <ContentPresenter x:Name="ContentPresenter" Content="{TemplateBinding Content}" ContentTransitions="{TemplateBinding ContentTransitions}" ContentTemplate="{TemplateBinding ContentTemplate}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Page.Resources> <Grid> <ComboBox x:Name="FontsCombo" Header="Fonts" Height="200" Width="200" ItemsSource="{x:Bind fonts}" DisplayMemberPath="Source" ItemContainerStyle="{StaticResource MyItemStyle}"/> </Grid>
我更改了指针滑过颜色、选定颜色、选定指针滑过颜色和选定按下颜色。
1条答案
按热度按时间3df52oht1#
如果你想改变
ComboBoxItem
的风格,你需要修改ComboBoxItem
的默认风格。ComboBoxItem
使用一些系统值作为不同状态的背景。我做了一个简单的演示,你可以参考。XAML:
我更改了指针滑过颜色、选定颜色、选定指针滑过颜色和选定按下颜色。