How to create a base window using WPF and the MahApps framework?

Question

I am new to WPF and XAML and I am currently using the MahApps framework to get the Windows Metro theme for my application.

I am following along using this guide to get the Metro theme incorporated.

My question is how do I create a base window that has the MahApps theme and then other windows can inherit from this base window so they also would get the theme.

Thank you for your help!

Answer 1

Here is a short how to for creating a base MetroWindow and it's usage.

1) Create a class with your base window (without any xaml code)

using System.Windows;
using MahApps.Metro.Controls;

namespace MahAppsMetroSample
{
    public class CustomBaseMetroWindow : MetroWindow
    {
        static CustomBaseMetroWindow()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(CustomBaseMetroWindow), new FrameworkPropertyMetadata(typeof(CustomBaseMetroWindow)));
        }
    }
}  

2) create aa theme resource dictionary in your solutio, call it Generic.xaml (it's only an example)

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:mahAppsMetroSample="clr-namespace:MahAppsMetroSample"
                    xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls">

    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Themes/MetroWindow.xaml" />
    </ResourceDictionary.MergedDictionaries>

    <Style TargetType="mahAppsMetroSample:CustomBaseMetroWindow" BasedOn="{StaticResource {x:Type controls:MetroWindow}}">
        <Setter Property="TitleCharacterCasing" Value="Lower" />
        <Setter Property="WindowTransitionsEnabled" Value="False" />
        <Setter Property="WindowTitleBrush" Value="Brown" />
    </Style>

</ResourceDictionary>

3) use your custom window instead the MetroWindow

using MahApps.Metro.Controls;

namespace MahAppsMetroSample
{
    public partial class MainWindow : CustomBaseMetroWindow
    {
        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

and

<mahAppsMetroSample:CustomBaseMetroWindow x:Class="MahAppsMetroSample.MainWindow"
                                          xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                                          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                                          xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls"
                                          xmlns:mahAppsMetroSample="clr-namespace:MahAppsMetroSample"
                                          Title="MainWindow">

    <Grid>
    </Grid>
</mahAppsMetroSample:CustomBaseMetroWindow>

You can find this sample also in my GitHub MahAppsMetroSample code-sample repository .

Hope this helps!