We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Change the style of the 'Office2013' theme.

Thread ID:

Created:

Updated:

Platform:

Replies:

118654 Mar 30,2015 12:56 PM UTC Apr 7,2015 12:16 PM UTC WPF 7
loading
Tags: Ribbon
George Sterg
Asked On March 30, 2015 12:56 PM UTC

Hello, I want to change  the style of the Office 2013 theme.  I tried to use this:

Ribbon.SetActiveColorScheme(ribbon, Brushes.Red); from http://help.syncfusion.com/ug/wpf/default.htm#!documents/activecolorscheme.htm without any success.

I want to have multiple Office2013 custom styles (dark,blue etc). I want to be able to not only change the background of the title bar (achieved that) but also the style of each tab (tab and tabButton properties when selected, mouse hover, make the caption bold when the tab is checked etc). Trying to edit the Ribbon template throws me an exception, and also trying to edit a ribbonTab template gives me this error: "Create template failed".



Mariappan S [Syncfusion]
Replied On March 31, 2015 12:23 PM UTC

Hi George,

Thank you for contacting Syncfusion support,

We have prepared a Ribbon sample by using style file. Using this file you can edit the style of Ribbon control and change the Color, BorderBrush for RibbonTab,TabButton.

Please download the sample from the following location.

Sample link: RibbonSample.zip

Please let us know if you need further assistance.

Regards,
Mariappan S.


George Sterg
Replied On April 2, 2015 06:48 PM UTC

Thank you for the sample (Although 8000 lines are quite a lot!) I mixed around with the colors but I have an Issue with the RibbonTab (Or the RibbonTabButton). When a tab i selected . the tab 'moves' to the right. How can i fix this?
Thank you

Attachment: RibbonSample152986270Updated_33b95c32.zip

Mariappan S [Syncfusion]
Replied On April 3, 2015 09:50 AM UTC

Hi George,

We have checked your updated sample. In this sample you have changed below code snippets to change the margin it causes thereported issue.

Code snippets:

<Border x:Name="ribbonTabBorder" Panel.ZIndex="10"

BorderBrush="{TemplateBinding BorderBrush}"

BorderThickness="{TemplateBinding BorderThickness}"

DockPanel.Dock="Bottom">

<Border.Style>

<Style>

<!--<Setter Property="Border.Margin" Value="17,-24,0,1"/>-->

<Style.Triggers>

<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:Ribbon}},Path=BackStageButton.Visibility}" Value="Visible">

<Setter Property="Border.Margin" Value="17,-24,0,1"/>

</DataTrigger>

<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:Ribbon}},Path=BackStageButton.Visibility}" Value="Collapsed">

<Setter Property="Border.Margin" Value="-46,-24,0,1"/>

</DataTrigger>

</Style.Triggers>

</Style>

</Border.Style>

<ItemsPresenter />

</Border>


We have modified the above code snippets in this sample. Please download the sample from the following link.

Sample link: RibbonSample.zip

Please let us know if you need further assistance.

Regards,
Mariappan S.


George Sterg
Replied On April 3, 2015 10:08 AM UTC

No  I have the same problem. I am uploading some snapshots.

Loaded (Pic1)
Click the Tab1 (Pic 2)
Click Tab2 (pic 3)
Click Tab 2 again several times (Pic 4)

Is it a version issue? I am using version 12.1400.0.43

George Sterg
Replied On April 3, 2015 10:09 AM UTC

No  I have the same problem. I am uploading some snapshots.

Loaded (Pic1)
Click the Tab1 (Pic 2)
Click Tab2 (pic 3)
Click Tab 2 again several times (Pic 4)

Is it a version issue? I am using version 12.1400.0.43

Attachment: Snapshots_e452673e.zip

George Sterg
Replied On April 3, 2015 10:42 AM UTC

If I set the ribbonTabStyle in xaml, I can see it from the design view but i runtime the style is not visible. If i set the style in code behind, i have the issue above. Is there any way to set the foreground of a non selected tab without the ribbonTabStyle?

Bharadhi K [Syncfusion]
Replied On April 7, 2015 12:16 PM UTC

Hi George,

Thanks for the update.

Query 1: Is it a version issue? I am using version 12.1400.0.43

We are able to reproduce the issue "When a tab i selected . the tab 'moves' to the right" in version 12.1.0.43. This issue has been resolved in our latest version, 13.1.0.21. We recommend you to upgrade to our latest version.

Query 2: If I set the ribbonTabStyle in xaml, I can see it from the design view but i runtime the style is not visible. If i set the style in code behind, i have the issue above.

Since the style names were same, the style is taken from the source file during run time. We can resolve this by changing the Key name. We have modified the sample to describe the same. In the sample we have changed the key name to "Office2013TabButtonStyle1". Please find the modified sample in the following link.

Sample: RibbonSample.zip

Query 3: Is there any way to set the foreground of a non selected tab without the ribbonTabStyle?

The Foreground of the RibbonTab can only be set using the "TabButtonStyle" property. Currently we do not have support to change the Foreground directly.

Please let us know if you require further assistance on this.

Regards,
Bharadhi K

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;