Elysium has a special API set, designed to work with application's theme settings of the control's style.

How to add and edit project's theme

  1. Open the file App.xaml.

  2. Add the Generic.xaml dictionary to the application resourses, add the following event handler to your code Startup. In the event hander call one of the overloads of the method Apply()()()() and set necessary parameters.

    XAML Copy imageCopy
     1<Application x:Class="Elysium.Test.App"
     2             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     3             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     4             StartupUri="MainWindow.xaml" Startup="StartupHandler">
     5    <Application.Resources>
     6        <ResourceDictionary>
     7            <ResourceDictionary.MergedDictionaries>
     8                <ResourceDictionary Source="/Elysium;component/Themes/Generic.xaml"/>
     9            </ResourceDictionary.MergedDictionaries>
    10        </ResourceDictionary>
    11    </Application.Resources>
    12</Application>
    C# Copy imageCopy
    1public sealed partial class App : System.Windows.Application
    2{
    3    private void StartupHandler(object sender, System.Windows.StartupEventArgs e)
    4    {
    5        Elysium.Manager.ApplyTheme(this, Elysium.Theme.Dark, Elysium.AccentBrushes.Blue, Elysium.Brushes.White);
    6    }
    7}

How to add and edit control's theme

  1. Open the markup file of the control (for example, MainWindow.xaml)

  2. Add xmlns:metro="http://schemas.codeplex.com/elysium" and xmlns:params="http://schemas.codeplex.com/elysium/params" XAML namespaces. Set values to the attached dependency properties from the class params:Manager.

    Tip

    Values of accent colors can be taken from the class params:AccentBrushes.

    Important

    All theme's resourses (for example, brushes like BackgroundBrush or control's styles) are dynamic. To use them, use DynamicResource markup extension.

    Only icons and converters in Elysium are static.

    XAML Copy imageCopy
     1<metro:Window x:Class="Elysium.Test.MainWindow"
     2              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     3              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     4              xmlns:metro="http://schemas.codeplex.com/elysium"
     5              xmlns:params="http://schemas.codeplex.com/elysium/params"
     6              params:Manager.Theme="Dark"
     7              params:Manager.AccentBrush="{x:Static metro:AccentBrushes.Blue}"
     8              params:Manager.ContrastBrush="White"
     9              Background="{DynamicResource BackgroundBrush}">
    10      ...
    11</metro:Window>

Design-time mode

  1. Set values to the attached dependency properties from the class params:Design to display styles correctly during working in constructor mode.

  2. XAML Copy imageCopy
     1<metro:Window x:Class="Elysium.Test.MainWindow"
     2              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     3              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     4              xmlns:metro="http://schemas.codeplex.com/elysium"
     5              xmlns:params="http://schemas.codeplex.com/elysium/params"
     6              params:Design.Theme="Dark"
     7              params:Design.AccentBrush="{x:Static metro:AccentBrushes.Blue}"
     8              params:Design.ContrastBrush="White">
     9      ...
    10</metro:Window>
List of the theme's resources.

A name of the resource.

A purpose of the resource.

TransparentBrush

Used to make transparent background.

SemitransparentBrush

Semitransparent brush.

BackgroundBrush

Used to set a background to controls.

ForegroundBrush

Used to places which are contrast to the background (for example, for text).

HighlightBrush

The most pale (relative to the background) brush. Used when it's needed to highlight the control (for example, background is filled with the brush when user hovers a pointer over the control)

MiddleLightBrush

A brush with average contrast relative to the background. Used to highlight some element moderately (for example, this brush is used to select a piece of text)

LowlightBrush

The most contrast brush relative to the background, but less than ForegroundBrush. Used to contrast highlighting of the elements (for example, borders of many elements are highlighted with this brush, as well as backgrounds of the button and slider when they are pressed).

DisabledBrush

A brush with the "dirty" color, used to indicate that the control is inactive.

A list of icons.

Name of the resource with the icon

Icon's purpose

AdvancedIcon

If you need to move some items from the ApplicationBar to a separate menu (for example, default size is too small), you can create a button Additionally with a pulldown menu and set the icon for it.

MinimizeIcon

An icon for window's collapsing.

MaximizeIcon

An icon for window's maximizing for the whole display.

RestoreIcon

An icon for restoring an old size of the window.

CloseIcon

An icon for window's closing

See Also