Apply theme and keep App.XAML styles

Question

I have defined some styles in App.XAML like:

</Style>

Then I apply a theme in MainWindow.xaml.cs:

SfSkinManager.SetVisualStyle(this, VisualStyles.Office2016Colorful);

But this overrides all app level styles like padding and merging in this sample.

I even tried this:

SfSkinManager.ApplyStylesOnApplication = true;
SfSkinManager.SetVisualStyle(this, VisualStyles.Office2016Colorful);

But the problem here is that the theme is not applied to the Buttons.

How can I keep my styles, or somehow merge my styles into Syncfusion themes?

Senthil Kumaran Rajan · Answer

Hi Mahdi

Thank you for contacting Syncfusion Support.

Query : How can I keep my styles, or somehow merge my styles into Syncfusion themes?

In order to merge the style and override it in an application level, the BasedOn property should be used. Please find the code for the same from below:

Code:[XAML]

<Application.Resources>

<ResourceDictionary.MergedDictionaries>

</ResourceDictionary.MergedDictionaries>

</Style>

</ResourceDictionary>

</Application.Resources>

We have also attached the sample for your reference.

Sample : http://www.syncfusion.com/downloads/support/forum/139079/ze/SKINMA~2-954459314

Please find the link for UG documentation regarding how to override the theme using BasedOn property .

UG Link: https://help.syncfusion.com/wpf/skinmanager/how-to/override-syncfusion-themes

Note: Since whenever we applied the theme using SfSkinManager, it will apply in hierarchy like from App.XAML, window level , Visual Parent of control and then it will apply to control. So when you try to set in codebehind, the theme won’t be applied directly.

Please try the above solution and let us know if it is helpful.

Regards

Senthil

Mahdi Ehsanifar · Answer

Hi Senthil, Thank you for your response.Some problems sill remain. I try to set all styles in the App.XAML, but in your approach, I have to set the style property for each button. How can I avoid this repetition?Secondly, I'm actually defining a style for target type of Control, and assign it to most of the controls such as the button (I avoided mentioning it to simplify my question). Now, what should I use in isntead of Source property of ResourceDictionary, and instead of DefaultButtonStyle in the BasedOn property of the Style (Something like DefaultControlStyle, but it does not work)?App.XAML:Code:[XAML]

Senthil Kumaran Rajan · Answer

Hi Mahdi Thank you for the update. Query #1: I try to set all styles in the App.XAML, but in your approach, I have to set the style property for each button. How can I avoid this repetition? If the style has been applied in App.XAML, then it will apply for all the controls of the same TargetType without using the Style property. We have modified the sample for the same and it can be downloaded from the below location. Sample: http://www.syncfusion.com/downloads/support/forum/139079/ze/SkinManagerapp_modified421810135 Query #2:Secondly, I'm actually defining a style for target type of Control, and assign it to most of the controls such as the button (I avoided mentioning it to simplify my question). Now, what should I use in isntead of Source property of ResourceDictionary, and instead of DefaultButtonStyle in the BasedOn property of the Style (Something like DefaultControlStyle, but it does not work)? In our SfSkinManager, we would maintain style property for each controls and provided the key using BasedOn property. Syntax: Style Eg: DefaultListBoxItemStyle And the path which is used in ResourceDictionary source would be the file name maintained for each themes and in format like below: /Syncfusion.Themes.Office2016Colorful.WPF;Component/Tools/MS Control/ControlName.xaml" Please refer the below UG link for further reference. https://help.syncfusion.com/wpf/skinmanager/overview Query #3: Moreover, I'm using some other controls like the SfDataGrid. Do I need to repeat all of these works for other controls to apply the theme?Yes, if you want to apply the theme for controls, you need to follow the above steps as explained in our example by replacing the TargetType as SfDataGrid. Regards Senthil

Mahdi Ehsanifar · Answer

Hello Senthil,

Thank you for your response.

So in your solution, I need to repeat defining margin and padding for each MS and non-MS control I'm using, and there is no way to overrid them for all controls once and keep their theme.
Is there any way to do this programmatically?

Furthermore, when I define the Office2016Colorful theme for MS controls and SfDataGrid at the same time in App.XAML, and run the project, the header foreground of SfDataGrid is changed to black! And when I remove the resource dictionary of the "MS control.xaml", everything is OK!

<ResourceDictionary.MergedDictionaries>

</ResourceDictionary.MergedDictionaries>

Regards,
Mmahdi

Senthil Kumaran Rajan · Answer

Hi Mahdi, 
 
Thank you for your update. 
 
We are analyzing the reported behavior in SfDataGrid. We will update the analyzed details before the end of August 9th, 2018. 
 
Regards, 
Senthil

Senthil Kumaran Rajan · Answer

Hi Mahdi,

Thank you for your patience.

Query 1 : So in your solution, I need to repeat defining margin and padding for each MS and non-MS control I'm using, and there is no way to overrid them for all controls once and keep their theme.
Is there any way to do this programmatically?

No, is it not possible to override them for all the control at once. Each control has different properties, one control may have one property and one control won’t have the property with same name, hence it is not possible to override for all control at once.

Query 2 : Furthermore, when I define the Office2016Colorful theme for MS controls and SfDataGrid at the same time in App.XAML, and run the project, the header foreground of SfDataGrid is changed to black! And when I remove the resource dictionary of the "MS control.xaml", everything is OK!

Once the theme is applied to MS control, it overrides the default ForeColor for all the TextBlock, hence the ForeColor of SfGridControl is updated as black. To overcome this behavior, we have to override the TextBlock style as like below code example.

Code Example[.xaml]

</Style>

We have prepared the sample for your reference and this can be downloaded from the below location.

Sample : http://www.syncfusion.com/downloads/support/forum/139079/ze/SkinManagerapp-821929345

Regards,

Senthil

Peter Bernhardt · Answer

Hi,I know that this is an older issue but I have a similar question.You showed that these are correct paths in the RessourceDictionary:But how do I reference the "smaller" Syncfusion controls like "upDown"? This does not work:Thank you for your help.Regards,Peter

Sudharsan Narayanan · Answer

Hi Peter,We have checked your query, "Resource cannot found". We suggest to use the below ResourceDictionary Source path for the UpDown control in the Metro theme. If we misunderstood the query, please modify our sample and revert to us with reproducible issue or video. So, it will be helpful to prompt the solution on further.Regards,Sudharsan