Troubles with Scroll using Custom Theme Project

5 posts, 1 answers
  1. Sergei
    Sergei avatar
    7 posts
    Member since:
    Jun 2015

    Posted 29 Jan Link to this post


    Hello!

    I'm trying to create a custom theme based on Windows8 theme. I'm using this documentation http://docs.telerik.com/devtools/silverlight/styling-and-appearance/stylemanager/creating-a-custom-theme/common-styling-apperance-themes-custom-theme-project-telerik-approach

    1. I've created Silverlight Class Library project with "Themes" folder
    2. I've copied xaml files from "Themes" folder of Windows8 theme (2015.2.623)
    2. I've created new class:

    namespace CustomTheme
    {
        [ThemeLocation(ThemeLocation.BuiltIn)]
        public class CustomTheme: Theme
        {
            public CustomTheme()
            {
                this.Source = new Uri("/CustomTheme;component/Themes/Generic.xaml", UriKind.RelativeOrAbsolute);
            }
        }
    }


    3. I've attached my theme to my application:

    StyleManager.ApplicationTheme = new CustomTheme.CustomTheme();

    All of the components changed style, but Sroll wasn't!
    I've tried to attach project code, but I can't attach an archive.

  2. Evgenia
    Admin
    Evgenia avatar
    1407 posts

    Posted 02 Feb Link to this post

    Hello Sergei,

    Can you elaborate a bit more on whether the MS ScrollViewer that should get the Windows8 theme applied is a standalone control or part of the control template of one of our controls?
    Since you are using StyleManager Application theme our styling won't get applied to the native controls unless you add style setter that forces the cotnrol to be based on the current application theme. This is described in more details in our documentation
    However when the MS native control is part of a control template we have inner attached property that ensures that the MS control will be styled with the same theme as its parent control. This property is telerik:StyleManager.Theme={StaticResource Theme}.

    Last but not least we highly recommend our clients to use the implicit styles theming mechanism over StyleManager for it will make it much easier to create custom theme with it. I won't get in details about the other great advantages it has compared to StyleManager like full Blend support, easily changed themes runtime and full support with our latest themes.
    This help article will make you familiar with the implicit styles theming mechanism and how to use it in sample scenarios.

    Let me shed some light on it below:
    Basically, in order to display a Silverlight or WPF component, you need to apply a default ControlTemplate for it. This is why all our components come with a default set of styles and ControlTemplates. The normal assemblies (Binaries folder under your local installation path) we provide include the implementation of the components along with these default styles. However, as our assemblies contain multiple components, they also contain all relevant default styles for these components which makes the assembly size larger. Most of our customers use only a few controls in their applications and we decided to give them the option to choose which style resources they want to include in their projects. So in general we created the NoXaml dlls which do not include any xaml code - no default styles, brushes or ControlTemplates. However, as these assemblies do not specify a default ControlTemplate for the components, when you use them, the RadControls have no default visualization and you can't see anything in runtime or design-time.
    So to have visual representation of a control with NoXAML binaries you'll have to manually add a style/ControlTemplate for the RadControls you need in your application.

    The article I suggested above basically explains that when you use a NoXaml dll, you have to manually add a style/ControlTemplate for the RadControls you need in your application. We have provided two different options for that - you can use the theme dlls which are located in Binaries.NoXaml folder (Telerik.Windows.Themes.Expression_Dark.dll, Telerik.Windows.Themes.Windows8.dll, etc.), or you can use the resource dictionaries by assembly name from the Themes.Implicit folder:
    …/Themes.Implicit/<platform>/VisualStudio2013/Themes/Telerik.Windows.Controls.Navigation.xaml.
    If you go with the first option, you will include all RadControls styles for a theme in your solution through a dll. As this dll basically contains ResourceDictionaries you will also have to include the ResourceDictionaries you need to use in the resources of your window or application. So for MS controls this would be the main ScrollViewerStyle located in Telerik.Windows.Controls.dll. If you want to use that style you should merge the System.Windows.xaml resource dictionary:
     
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="/Telerik.Windows.Themes.Windows8;component/Themes/System.Windows.xaml"/>  
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>

    If you choose the second option, you should create a Themes folder in your project and copy the corresponding XAML files from Themes.Implicit/../Windows8/../Themes/ folder to your Themes folder. Then you need to merge these ResourceDictionaries in the App.xaml file:

    <Application x:Class="RadControlsNoXaml.App"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 StartupUri="MainWindow.xaml">
        <Application.Resources>
            <ResourceDictionary>
                <ResourceDictionary.MergedDictionaries>
                    <ResourceDictionary Source="Themes/System.Windows.xaml" />
                </ResourceDictionary.MergedDictionaries>
            </ResourceDictionary>
        </Application.Resources>
    </Application>

    The second approach also allows you to further edit the ResourceDictionaries and remove the styles and resources that you won't need in your application thus further reducing the size of your application.

    I hope this information is helpful.

    Regards,
    Evgenia
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. DevCraft banner
  4. Sergei
    Sergei avatar
    7 posts
    Member since:
    Jun 2015

    Posted 02 Feb in reply to Evgenia Link to this post

    Hello Evgenia,
    thank you for the answer!
    This is simple project demonstrates the problem ( https://onedrive.live.com/embed?cid=3CA70C0755ECC8F8&resid=3CA70C0755ECC8F8%21107&authkey=AF0gc7AWj6SudKs ).
    I used RadListBox. It changed the style except for Scroll.
  5. Sergei
    Sergei avatar
    7 posts
    Member since:
    Jun 2015

    Posted 02 Feb in reply to Evgenia Link to this post

    We have the big project and use a lot of your components.

    And we want to change their styles in one place.

    That's why we want to create a custom theme project.

  6. Answer
    Evgenia
    Admin
    Evgenia avatar
    1407 posts

    Posted 05 Feb Link to this post

    Hello Segei,

    I see what's the problem. You are currently mixing the StyleManager and Implicit styles theming mechanism approaches which is something unwanted and not supported.
    For example -- you followed the correct steps to create a custom theme project. You are calling Generic.xaml resource dictionary in the constructor of the CustomTheme class but I can't find the resource dictionary itself in the project. Also it seems to me that you copy-pasted the theme resource files from Themes.Implicit folder under your local installation path. Please mind that Themes.Implicit as the folder name imply holds resource files for implicit styles and not StyleManager files.
    My advise is that you follow our documentation article for Silverlight where everything is described in full details together with code snippets. 

    Once again to make the process far more easier and smooth I highly reccomend that you use our implicit styles theming mechanism instead of StyleManager. Let me know if needed and I can provide a small runnable sample where I can demonstrate it. 
    P.S. There is a blog post that states why we shifted to totally new theming mechanism (implicit styles over StyleManager) and why we advise all our clients to migrate to it whenever possible. 

    Regards,
    Evgenia
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
DevCraft banner