question

65010773 avatar image
0 Votes"
65010773 asked ·

How to change the color of the arrow of the combobox in uwp

Hi

I would like to modify the color of the arrow of the combobox how can i do ?

windows-uwp
· 1
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Hi, does the following method help? Have you solved your issue?

0 Votes 0 · ·

1 Answer

FayWang-MSFT avatar image
1 Vote"
FayWang-MSFT answered ·

Hello,

Welcome to Microsoft Q&A!


If you want to change the color of Arrow in the ComboBox, you can try to modify the default style of ComboBox. You can right-Click on your ComboBox from the visual designer, then click on Edit Template -> Edit a copy. This will create the default template for the ComboBox . In the style, you will find the following line:

 <FontIcon x:Name="DropDownGlyph" AutomationProperties.AccessibilityView="Raw" Grid.Column="1" FontFamily="{ThemeResource SymbolThemeFontFamily}" Foreground="{ThemeResource ComboBoxDropDownGlyphForeground}" FontSize="12" Glyph="&#xE0E5;" HorizontalAlignment="Right" IsHitTestVisible="False" Margin="0,10,10,10" Grid.Row="1" VerticalAlignment="Center"/>


This FontIcon which named DropDownGlyph represents the Arrow and its Foreground is set as {ThemeResource ComboBoxDropDownGlyphForeground}, so you can change the Foreground to the color you want(e.g. Foreground="Red"). In addition, in the Focused VisualState, when the ComboBox gets focus, it will set the Foreground of DropDownGlyph as {ThemeResource ComboBoxDropDownGlyphForegroundFocused}, you also need to change its Foreground setting in the style, for example:

 <VisualState x:Name="Focused">
     <Storyboard>
         ......
         <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownGlyph" Storyboard.TargetProperty="Foreground">
             <DiscreteObjectKeyFrame KeyTime="0" Value="Red"/>
         </ObjectAnimationUsingKeyFrames>
      </Storyboard>
 </VisualState>

Or you can override these theme brushes resources used by ComboBox.

 <Page.Resources>
         <SolidColorBrush x:Key="ComboBoxDropDownGlyphForeground" Color="Red" />
         <SolidColorBrush x:Key="ComboBoxDropDownGlyphForegroundFocused" Color="Red" />
 </Page.Resources>


· Share
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.