VisualStudio2013 theme color variation at design time

7 posts, 0 answers
  1. Patrick
    Patrick avatar
    12 posts
    Member since:
    Sep 2016

    Posted 19 Sep 2016 Link to this post

    Is there a way to set the color variation at design time?
  2. Martin
    Admin
    Martin avatar
    126 posts

    Posted 20 Sep 2016 Link to this post

    Hello Patrick,

    Theme variations are set in code behind. For the VisualStudio2013 theme they are Light, Blue, Dark:
    VisualStudio2013Palette.LoadPreset(VisualStudio2013Palette.ColorVariation.Dark);

    You can review this article about the specific theme for more information.

    Regards,
    Martin
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  3. Patrick
    Patrick avatar
    12 posts
    Member since:
    Sep 2016

    Posted 20 Sep 2016 in reply to Martin Link to this post

    Yes, I realize all that.  That changes the color variation at runtime.  I'm asking whether or not there is a way to change it at design time.  At design time, the Light color variation is always used.  I'm using  the Dark variation, so having the app look different at design time and run time makes styling it difficult.
  4. Martin
    Admin
    Martin avatar
    126 posts

    Posted 20 Sep 2016 Link to this post

    Hello Patrick,

    The way to see the variation of the theme in Design time or in Expression Blend is to load the preset in a static constructor of the MainWindow and Rebild if needed:
    public partial class MainWindow : Window
    {
      public MainWindow()
      {
      InitializeComponent();
      }
     
      static MainWindow()
      {
      VisualStudio2013Palette.LoadPreset(VisualStudio2013Palette.ColorVariation.Dark);
      }
    }

    I verified this approach in VS2012, VS2013, VS2015.

    Regards,
    Martin
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  5. Patrick
    Patrick avatar
    12 posts
    Member since:
    Sep 2016

    Posted 21 Sep 2016 in reply to Martin Link to this post

    Worked like a charm.  Thanks.
  6. Danny
    Danny avatar
    11 posts
    Member since:
    May 2018

    Posted 17 Aug 2018 Link to this post

    Hi,

    Maybe a stupid question (or one from an absolutely newby in WPF): where exactly this preset loading has to be done in VB? (I'd really appreciate a short example in VB about how the implicit styles and Style Manager could be used in VB (I tried to apply the explanations from here ( https://docs.telerik.com/devtools/wpf/styling-and-appearance/themes-suite/common-styling-appearance-visualstudio2013-theme) and from here (https://docs.telerik.com/devtools/wpf/styling-and-appearance/styling-apperance-setting-a-theme-overview), but without success.

     

    In fact, what I'm trying is to apply VisualStudio2013 Dark theme to ALL controls and also to be visible in Design mde too, not only at run time

    Thanks in advance,

    Dan

  7. Martin Ivanov
    Admin
    Martin Ivanov avatar
    2090 posts

    Posted 20 Aug 2018 Link to this post

    Hello Dan,

    There are no stupid questions. To achieve your requirement I would recommend you to use the Implicit Styles theming approach. This way you will get also the design-time support. To set up a VB project with UI for WPF and implicit styles you can follow the next steps. You can also check the Setting a Theme using implicit styles part of the documentation again. Before this I would recommend you to take a peek at the Xaml vs. NoXaml dlls.
    • Create a new VB.NET WPF project.
    • Reference the Telerik UI for WPF dlls that you will work with. 
    • Reference the Telerik.Windows.Themes.VisualStudio2013.dll
    • Keep in mind in this case the Telerik dlls has to be referenced from the Binaries.NoXaml folder.
    • Open the Application.xaml file and add the following resources there.
      <Application.Resources>
          <ResourceDictionary>
              <ResourceDictionary.MergedDictionaries>
                  <ResourceDictionary Source="/Telerik.Windows.Themes.VisualStudio2013;component/Themes/System.Windows.xaml"/>
                  <ResourceDictionary Source="/Telerik.Windows.Themes.VisualStudio2013;component/Themes/Telerik.Windows.Controls.xaml"/>
                  <ResourceDictionary Source="/Telerik.Windows.Themes.VisualStudio2013;component/Themes/Telerik.Windows.Controls.Input.xaml"/>
                  <ResourceDictionary Source="/Telerik.Windows.Themes.VisualStudio2013;component/Themes/Telerik.Windows.Controls.GridView.xaml"/>
              </ResourceDictionary.MergedDictionaries>
          </ResourceDictionary>
      </Application.Resources>
      Note that the resources in the MergedDictionaries will vary based on the controls you are using. In general each Telerik dll that contains UI like (GridView, Chart, ScheduleView, etc.) has a corresponding .xaml file (a ResourceDictionary) with the same name (ex: Telerik.Windows.Controls.GridView.dll and Telerik.Windows.Controls.GridView.xaml). 
    • Now your project is ready and you can add controls in the MainWindow.xaml or a UserControl and the controls should be properly displayed.
    • To apply the Dark palette you can use the constructor of the MainWindow. For example:
      Class MainWindow
          Sub New()
              VisualStudio2013Palette.LoadPreset(VisualStudio2013Palette.ColorVariation.Dark)
              InitializeComponent()
          End Sub
      End Class

    I hope this helps.

    As a side note, if you have further questions about WPF I would ask you to open a new forum or support ticket targeting the WPF product. 

    Regards,
    Martin Ivanov
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top