Does defining a style for a WPF control override the ArcGIS Pro Theme Style?

[VidmasKondratas]

I have an ArcGIS Pro AddIn I’m developing and I’m having an issue with ArcGIS Pro Theme Styles being overwritten (I think). I need to change a property in a ComboBox based on an event trigger. This needs to be done in the WPF control’s “Style” section. However, when I do this it seems to overwrite the ArcGIS Pro Theme Style (see below). Is this expected behavior and is there a way I can avoid this?

<ComboBox Width="60" MaxDropDownHeight="540" HorizontalContentAlignment="Center" ItemsSource="{Binding Concentrations}" SelectedValuePath="ManiceCode" SelectedValue="{Binding CT, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">

               <ComboBox.Style>

                              <Style TargetType="{x:Type ComboBox}">

                                             <Setter Property="DisplayMemberPath" Value="Description" />

                              </Style>

               </ComboBox.Style>

</ComboBox>

[GKmieliauskas]

Hi Vidmas,

Esri uses default combobox style in ArcGIS Pro.

https://github.com/Esri/arcgis-pro-sdk/wiki/proguide-style-guide#combo-boxCombo Box

Default Style: Yes

ArcGIS Pro provides default styling for text content of a Combo box control, including mouse over behavior and selection highlight. If needed, style the individual properties such as Background/Foreground by using Esri brushes.

<ComboBox Background="{DynamicResource Esri_BackgroundPressedBrush}"            Foreground="{DynamicResource Esri_TextMenuBrush}">                 <ComboBoxItem >Item1</ComboBoxItem>                 <ComboBoxItem >Item2</ComboBoxItem>                 <ComboBoxItem >Item3</ComboBoxItem> </ComboBox>

So one of the ways is to set comboboxitem template (add additional Setter from my code to your combobox style) :

                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                                        <TextBlock Text="{Binding Name}" Style="{DynamicResource Esri_TextBlockRegular}" />
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>

P.s. Your buttons at the bottom of window (Reset, Cancel, Ok) needs Esri style too to look like in others ArcGIS Pro windows (Style="{DynamicResource Esri_SimpleButton}")

[VidmasKondratas]

I already tried this. It doesn't work for me. Have you tested this with the "Dark Theme" while adding a style section to the combobox? All the comboboxes in Pro use the "Dark Theme" when in "Dark Theme" by default (like the dark ones in the attached picture). Open any out-of-the-box tool in Pro while in "Dark Theme" and look what the comboboxes look like. Doing the dynamic resource brushes from the Esri style guide still just switches everything to "Light Theme" for me after adding the <ComboBox.Style> section. The items in the comboboxes still are using the "Dark Theme" however which makes them unreadable. I'm suspecting because I haven't added a "Style" section to the items. The "Style" section contains a "BasedOn" property to allow inheritance, but you can't use it with dynamic resources and I don't know how to set this. It appears that adding a "Style" section will override any Esri styles. 

[CharlesMacleod · Accepted solution]

Add the based on attribute to your style and you will be good to go. Is there some reason that does not work for you?

<ComboBox.Style>
   <Style TargetType="{x:Type ComboBox}" BasedOn="{StaticResource {x:Type ComboBox}}">
       ....
   </Style>
</ComboBox.Style>‍‍‍‍‍‍‍‍‍‍

[VidmasKondratas]

Yes, that works. Thanks! I was missing how to set the "BasedOn" property correctly:

BasedOn="{StaticResource {x:Type ComboBox}}"

So adding this ComboBoxStyle with the "BasedOn" property above as a static resource and setting all the ComboBox styles to it is giving me the exact behavior and look that I was expecting:

<controls:ProWindow.Resources>
	<ResourceDictionary>
		<Style x:Key="ComboBoxStyle" TargetType="{x:Type ComboBox}" BasedOn="{StaticResource {x:Type ComboBox}}">
			<Style.Triggers>
				<DataTrigger Binding="{Binding ElementName=DescriptionCheckBox, Path=IsChecked}" Value="True">
					<Setter Property="DisplayMemberPath" Value="Description" />
				</DataTrigger>
				<DataTrigger Binding="{Binding ElementName=DescriptionCheckBox, Path=IsChecked}" Value="False">
					<Setter Property="DisplayMemberPath" Value="ManiceCode" />
				</DataTrigger>
			</Style.Triggers>
		</Style>
		<ResourceDictionary.MergedDictionaries>
			<extensions:DesignOnlyResourceDictionary Source="pack://application:,,,/ArcGIS.Desktop.Framework;component\Themes\Default.xaml"/>
		</ResourceDictionary.MergedDictionaries>
	</ResourceDictionary>
</controls:ProWindow.Resources>

<ComboBox x:Name="cboCT" Style="{StaticResource ComboBoxStyle}" Width="60" MaxDropDownHeight="540" HorizontalContentAlignment="Center" ItemsSource="{Binding Concentrations}" SelectedValuePath="ManiceCode" SelectedValue="{Binding CT, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" /> ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[GKmieliauskas]

Hi Vidmas,

It was part of my code.