Metro themed standard controls

[naip]

Hello,

the look of the new metro theme is fantastic. Unfortunately our application does not use only telerik control, but also a lot of standard controls (ScrollViewer, StackPanel etc.).

Is there a way that the scroll bars of the standard silverlight container controls look the same as in the telerik controls (RadGridView etc.)? I have tried to apply telerik:StyleManager.Theme="MetroTheme" to ScrollViewers and other containers, but the result was nonsatisfying.

Best regards
Thomas

[Vanya Pavlova]

Hi It Services,

 
Indeed the case with RadGridView is a different one because this control uses its own GridViewScrollViewer which internally uses the standard ScrollViewer. You may see this relation within GridViewScrollViewer's template. 
As the rest of our themes you may apply Telerik theme to several Microsoft controls such as TextBox, Button, CheckBox, RepeatButton etc. If you want to style the standard ScrollViewer just apply the theme to this control.
For GridViewScrollViewer this technique would not work. May you please share with us a bit more info about your exact scenario? Thus we would be able to provide you with an appropriate solution. 

All the best,
Vanya Pavlova
the Telerik team

[naip]

Hello Vanya,

I have tried to apply the metro theme to a standard scroll viewer - but the result is not convincing. Please take a look at the attached screenshots. The images are showing a RadGridViewer and a standard ScrollViewer side by side.

In the first image the scroll viewer has no explicit theme set and the ui does not look coherent. In the second image the scrollviewer has StyleManager.Theme="MetroTheme". The additional property does have an effect (the scrollviewer looks different), but ui is still not coherent.

Best regards,
Thomas

[Vanya Pavlova]

Hi Thomas,

 
I have tried to replicate the behaviour you described, but I was not able to. May you please take a look at the attached example and let me know how it differs from yours? Feel free to update this project and send it back to us in a new support ticket where we can see what might be wrong.

Best wishes,
Vanya Pavlova
the Telerik team

[naip]

Hello Vanya,

thank you very much - now I see my mistake. In my code I have used

StyleManager.Theme="MetroTheme"

but from your example I see, that should have used

StyleManager.Theme="Metro"

Sorry for being supid.

Best regards,
Thomas

[AvgurD]

Hi!
I am a big fun of Metro style too - but i have one thing in this style wich don' like many users of my apps in metro style - width of scrollbar. It's too small. Can you advise solution of this - may be with styling in Blend? But i have many types of telerik controls in my app now - and change style for each int too long...May be i can change width of metro scroll bar for all controls in one place?

[Vanya Pavlova]

Hello Dmitry,

 


You can change the style for System.Windows.ScrollViewer and its scrollbars to achieve your goal. 

Regards,
Vanya Pavlova
the Telerik team

[AvgurD]

Hello, Vanya.

You mean that i must set style of standard scrollbar in  ScrollViewer  like in Metro style, but increase width?
and then i make something like setter for metro style component (like RadGridView) and override it scrolls to standart view (i make it for RadGridView one year ago - but only change scrollbar to standard view - its looked no goog really with metro theme).
Or if i only increase width of  scrollbar in  ScrollViewer  - scrollbars in metro components increses too?

Sorry for terrible English! :)

[Vanya Pavlova]

Hi Dmitry,

 

Yes you are right - RadGridView has its own GridViewScrollViewer, which internally uses the standard one. A wiser solution in this case is to create custom theme based on Metro and modify the file System.Windows.xaml. This file contains the styles for the native Microsoft controls being supported by our theming mechanism.  Once you change the size of the ScrollViewer all scrollable controls will be affected by these cnahges. Furthermore we have recently introduced a way to style our controls using implicit styles. Please check the following forum thread for further reference. The same is applicable to Silverlight as well. I have prepared small Silverlight 5 demo, which illustrates how to achieve your goal. 

Regards,
Vanya Pavlova
the Telerik team