MainWindow.xaml

<mah:MetroWindow x:Class="MetroDemo.MainWindow"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:controlzEx="urn:controlzex"
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                 xmlns:exampleViews="clr-namespace:MetroDemo.ExampleViews"
                 xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
                 xmlns:local="clr-namespace:MetroDemo"
                 xmlns:mah="http://metro.mahapps.com/winfx/xaml/controls"
                 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                 Title="MahApps.Metro - Demo Application"
                 Width="1024"
                 Height="768"
                 MinWidth="800"
                 MinHeight="600"
                 d:DataContext="{d:DesignInstance local:MainWindowViewModel}"
                 d:DesignHeight="600"
                 d:DesignWidth="800"
                 mah:DialogParticipation.Register="{Binding}"
                 Closing="MetroWindow_Closing"
                 GlowColor="{DynamicResource MahApps.Colors.Accent}"
                 Icon="mahapps.metro.logo2.ico"
                 NonActiveGlowColor="#CDFF0000"
                 ResizeMode="CanResizeWithGrip"
                 ShowIconOnTitleBar="True"
                 WindowStartupLocation="CenterScreen"
                 mc:Ignorable="d">
    <!--
        if using DialogParticipation on Windows which open/close frequently you will get a
        memory leak unless you unregister.  The easiest way to do this is in your Closing/Unloaded
        event, as so:
        
        DialogParticipation.SetRegister(this, null);
    -->

    <Window.Resources>
        <ResourceDictionary>
            <ObjectDataProvider x:Key="SyncModePreferenceEnumValues"
                                MethodName="GetValues"
                                ObjectType="{x:Type controlzEx:ThemeSyncMode}">
                <ObjectDataProvider.MethodParameters>
                    <x:Type TypeName="controlzEx:ThemeSyncMode" />
                </ObjectDataProvider.MethodParameters>
            </ObjectDataProvider>

            <Ellipse x:Key="AppThemeMenuIcon"
                     Width="16"
                     Height="16"
                     x:Shared="False"
                     Fill="{Binding ColorBrush, Mode=OneWay}"
                     Stroke="{Binding BorderColorBrush, Mode=OneWay}"
                     StrokeThickness="1" />
            <Ellipse x:Key="AccentMenuIcon"
                     Width="16"
                     Height="16"
                     x:Shared="False"
                     Fill="{Binding ColorBrush, Mode=OneWay}" />

            <Style x:Key="AppThemeMenuItemStyle"
                   BasedOn="{StaticResource MahApps.Styles.MenuItem}"
                   TargetType="{x:Type MenuItem}">
                <Setter Property="Command" Value="{Binding ChangeAccentCommand}" />
                <Setter Property="CommandParameter" Value="{Binding Name, Mode=OneWay}" />
                <Setter Property="Header" Value="{Binding Name, Mode=OneWay}" />
                <Setter Property="Icon" Value="{StaticResource AppThemeMenuIcon}" />
            </Style>

            <Style x:Key="AccentColorMenuItemStyle"
                   BasedOn="{StaticResource MahApps.Styles.MenuItem}"
                   TargetType="{x:Type MenuItem}">
                <Setter Property="Command" Value="{Binding ChangeAccentCommand}" />
                <Setter Property="CommandParameter" Value="{Binding Name, Mode=OneWay}" />
                <Setter Property="Header" Value="{Binding Name, Mode=OneWay}" />
                <Setter Property="Icon" Value="{StaticResource AccentMenuIcon}" />
            </Style>

            <Style x:Key="SyncModeMenuItemStyle"
                   BasedOn="{StaticResource MahApps.Styles.MenuItem}"
                   TargetType="{x:Type MenuItem}">
                <Setter Property="Command" Value="{Binding DataContext.ChangeSyncModeCommand, RelativeSource={RelativeSource AncestorType=Window}}" />
                <Setter Property="CommandParameter" Value="{Binding Mode=OneTime}" />
                <Setter Property="Header" Value="{Binding Mode=OneTime}" />
            </Style>

            <UserControl x:Key="CustomDialogTest"
                         x:Name="CustomDialogTest"
                         MinHeight="200">

                <TextBlock x:Name="MessageTextBlock" Text="Message shown by this custom Dialog." />
            </UserControl>

            <UserControl x:Key="CustomCloseDialogTest" x:Name="CustomCloseDialogTest">

                <StackPanel>
                    <TextBlock Height="30"
                               Margin="0 4"
                               Text="This dialog allows arbitrary content. You have to close it yourself by clicking the close button below."
                               TextWrapping="Wrap" />
                    <Button Margin="0 2"
                            Click="ShowSecondCustomDialog"
                            Content="Second Dialog"
                            Style="{DynamicResource MahApps.Styles.Button.Dialogs}" />
                    <Button Margin="0 2"
                            Click="CloseCustomDialog"
                            Content="Close Me!"
                            Style="{DynamicResource MahApps.Styles.Button.Dialogs}" />
                </StackPanel>
            </UserControl>

            <ObjectDataProvider x:Key="CornerPreferenceEnumValues"
                                MethodName="GetValues"
                                ObjectType="{x:Type controlzEx:WindowCornerPreference}">
                <ObjectDataProvider.MethodParameters>
                    <x:Type TypeName="controlzEx:WindowCornerPreference" />
                </ObjectDataProvider.MethodParameters>
            </ObjectDataProvider>

            <ObjectDataProvider x:Key="WindowBackdropTypeEnumValues"
                                MethodName="GetValues"
                                ObjectType="{x:Type controlzEx:WindowBackdropType}">
                <ObjectDataProvider.MethodParameters>
                    <x:Type TypeName="controlzEx:WindowBackdropType" />
                </ObjectDataProvider.MethodParameters>
            </ObjectDataProvider>
        </ResourceDictionary>
    </Window.Resources>

    <mah:MetroWindow.LeftWindowCommands>
        <mah:WindowCommands>
            <Button Click="LaunchMahAppsOnGitHub" ToolTip="MahApps.Metro on GitHub">
                <iconPacks:PackIconModern Width="22"
                                          Height="22"
                                          Kind="SocialGithubOctocat" />
            </Button>
        </mah:WindowCommands>
    </mah:MetroWindow.LeftWindowCommands>

    <mah:MetroWindow.RightWindowCommands>
        <mah:WindowCommands ShowLastSeparator="False">
            <Button Click="LaunchFlyoutDemo"
                    Content="Flyouts"
                    ToolTip="Flyouts demo window" />
            <Button Click="LaunchIcons"
                    Content="IconPacks"
                    ToolTip="All MahApp icons" />
            <Button Click="LaunchVisualStudioDemo"
                    Content="VS"
                    ToolTip="Visual Studio style demo" />
            <Button Click="LauchCleanDemo"
                    Content="Clean"
                    ToolTip="Clean window style demo" />
            <Button Click="InteropDemo"
                    Content="Interop"
                    ToolTip="The interop demo" />
            <Button Click="LaunchNavigationDemo"
                    Content="Navigation"
                    ToolTip="Window navigation demo" />
            <ToggleButton Content="Confirm quit"
                          IsChecked="{Binding QuitConfirmationEnabled}"
                          ToolTip="Enable quit confirmation dialog on exit" />
        </mah:WindowCommands>
    </mah:MetroWindow.RightWindowCommands>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <Menu Grid.Row="0"
              Margin="5"
              HorizontalAlignment="Left"
              VerticalAlignment="Stretch">
            <MenuItem Header="Theme"
                      ItemContainerStyle="{StaticResource AppThemeMenuItemStyle}"
                      ItemsSource="{Binding AppThemes, Mode=OneWay}" />
            <MenuItem Header="Accent"
                      ItemContainerStyle="{StaticResource AccentColorMenuItemStyle}"
                      ItemsSource="{Binding AccentColors, Mode=OneWay}" />
            <MenuItem Header="ThemeManager">
                <MenuItem Header="SyncMode"
                          ItemContainerStyle="{StaticResource SyncModeMenuItemStyle}"
                          ItemsSource="{Binding Source={StaticResource SyncModePreferenceEnumValues}}" />
                <MenuItem Header="Use HSL colors?"
                          IsCheckable="True"
                          IsChecked="{Binding Options.UseHSL, Source={x:Static controlzEx:RuntimeThemeGenerator.Current}, Mode=TwoWay}" />

                <MenuItem Command="{Binding DataContext.SyncThemeNowCommand, RelativeSource={RelativeSource AncestorType=Window}}" Header="Sync now" />
            </MenuItem>
            <MenuItem Header="Dialogs">
                <MenuItem Header="Use Accent?"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=UseAccentForDialogs}" />
                <MenuItem Header="Use Invert?"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=UseInvertForDialogs}" />
                <MenuItem Header="Show Icon?"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=ShowIconOnDialogs}" />
                <MenuItem Header="Show Dialogs over TitleBar"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=ShowDialogsOverTitleBar}" />
                <Separator />
                <MenuItem Click="ShowInputDialog" Header="Show InputDialog" />
                <MenuItem Click="ShowInputDialogCustomButtonSizes" Header="Show InputDialog (with custom button font sizes)" />
                <MenuItem Click="ShowLoginDialog" Header="Show LoginDialog" />
                <MenuItem Click="ShowLoginDialogPasswordPreview" Header="Show Password Preview LoginDialog" />
                <MenuItem Click="ShowLoginDialogOnlyPassword" Header="Show LoginDialog (Only Password)" />
                <MenuItem Click="ShowLoginDialogWithRememberCheckBox" Header="Show LoginDialog (With Remember CheckBox)" />
                <MenuItem Click="ShowMessageDialog" Header="Show MessageDialog" />
                <MenuItem Click="ShowLimitedMessageDialog" Header="Show MessageDialog (Limited Size)" />
                <MenuItem Click="ShowProgressDialog" Header="Show ProgressDialog" />
                <MenuItem Click="ShowCustomDialog" Header="Show CustomDialog" />
                <MenuItem Click="ShowAwaitCustomDialog" Header="Await CustomDialog" />
                <Separator />
                <MenuItem Click="ShowInputDialogOutside" Header="Show ShowInputDialog Externally" />
                <MenuItem Click="ShowLoginDialogOutside" Header="Show ShowLoginDialog Externally" />
                <MenuItem Click="ShowMessageDialogOutside" Header="Show ShowMessageDialog Externally" />
                <Separator />
                <MenuItem Command="{Binding ShowInputDialogCommand}" Header="Show InputDialog via VM" />
                <MenuItem Command="{Binding ShowLoginDialogCommand}" Header="Show LoginDialog via VM ..." />
                <MenuItem Header="Show MessageDialog via VM">
                    <MenuItem Command="{Binding ShowMessageDialogCommand}"
                              CommandParameter="DISPATCHER_THREAD"
                              Header="... from Main Thread" />
                    <MenuItem Command="{Binding ShowMessageDialogCommand}"
                              CommandParameter="BACKGROUND_THREAD"
                              Header="... from Background Thread" />
                </MenuItem>

                <MenuItem Command="{Binding ShowProgressDialogCommand}" Header="Show ProgressDialog via VM" />
                <MenuItem Command="{Binding ShowCustomDialogCommand}" Header="Show CustomDialog via VM" />
            </MenuItem>
            <MenuItem Header="Window">
                <MenuItem Header="Chrome">
                    <MenuItem>
                        <MenuItem.Template>
                            <ControlTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <Label Content="CornerPreference" />
                                    <ComboBox VerticalAlignment="Center"
                                              ItemsSource="{Binding Source={StaticResource CornerPreferenceEnumValues}}"
                                              SelectedItem="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=CornerPreference, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
                                </StackPanel>
                            </ControlTemplate>
                        </MenuItem.Template>
                    </MenuItem>
                    <MenuItem>
                        <MenuItem.Template>
                            <ControlTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <Label Content="Backdrop" />
                                    <ComboBox VerticalAlignment="Center"
                                              ItemsSource="{Binding Source={StaticResource WindowBackdropTypeEnumValues}}"
                                              SelectedItem="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=(controlzEx:WindowBackdropManager.BackdropType), Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
                                </StackPanel>
                            </ControlTemplate>
                        </MenuItem.Template>
                    </MenuItem>
                </MenuItem>
                <MenuItem Header="Glow">
                    <MenuItem Header="PreferDWMBorderColor"
                              IsCheckable="True"
                              IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=PreferDWMBorderColor}" />
                    <MenuItem Header="DWMSupportsBorderColor"
                              IsCheckable="True"
                              IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=DWMSupportsBorderColor}"
                              IsEnabled="False" />
                </MenuItem>
                <MenuItem Header="ShowTitleBar"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=ShowTitleBar}" />
                <MenuItem Header="ShowInTaskbar"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=ShowInTaskbar}" />
                <MenuItem Header="Topmost"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=Topmost}" />
                <MenuItem Header="Ignore taskbar on maximize"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=IgnoreTaskbarOnMaximize}" />
                <MenuItem Header="Toggle FullScreen (no taskbar, window style = none)"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=ToggleFullScreen}" />
                <Separator />
                <MenuItem Click="MenuWindowWithGlowOnClick" Header="Window with Glow" />
                <MenuItem Click="MenuWindowWithoutGlowOnClick" Header="Window without Glow" />
                <MenuItem Click="MenuWindowWithBorderOnClick" Header="Window with Border (and Glow)" />
                <MenuItem Click="MenuWindowWithRoundedBorderOnClick" Header="Window with rounded Border (without Glow)" />
                <MenuItem Click="LaunchSizeToContentDemo" Header="Window with SizeToContent" />
                <Separator />
                <MenuItem x:Name="ShowSeparatorsMI"
                          Header="ShowSeparators (RightWindowCommands)"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=RightWindowCommands.ShowSeparators}" />
                <MenuItem Header="ShowLastSeparator in (RightWindowCommands)"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=RightWindowCommands.ShowLastSeparator}"
                          IsEnabled="{Binding ElementName=ShowSeparatorsMI, Path=IsChecked, Mode=OneWay}" />
                <Separator />
                <MenuItem Command="{Binding ToggleIconScalingCommand}"
                          CommandParameter="{x:Static mah:MultiFrameImageMode.ScaleDownLargerFrame}"
                          Header="Window icon: scale down larger frame"
                          IsCheckable="True"
                          IsChecked="{Binding IsScaleDownLargerFrame, Mode=OneWay}" />
                <MenuItem Command="{Binding ToggleIconScalingCommand}"
                          CommandParameter="{x:Static mah:MultiFrameImageMode.NoScaleSmallerFrame}"
                          Header="Window icon: no scale, smaller frame"
                          IsCheckable="True"
                          IsChecked="{Binding IsNoScaleSmallerFrame, Mode=OneWay}" />
                <Separator />
                <MenuItem Header="ShowSystemMenu"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=ShowSystemMenu}" />
                <MenuItem Header="ShowSystemMenuOnRightClick"
                          IsCheckable="True"
                          IsChecked="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type mah:MetroWindow}}, Path=ShowSystemMenuOnRightClick}" />
            </MenuItem>
        </Menu>

        <mah:MetroAnimatedSingleRowTabControl x:Name="MainTabControl" Grid.Row="1">
            <TabItem Header="buttons">
                <ScrollViewer Margin="2"
                              HorizontalScrollBarVisibility="Auto"
                              VerticalScrollBarVisibility="Auto">
                    <exampleViews:ButtonsExample DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
            <TabItem Header="text">
                <ScrollViewer Margin="2"
                              HorizontalScrollBarVisibility="Auto"
                              VerticalScrollBarVisibility="Auto">
                    <exampleViews:TextExamples DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
            <TabItem Header="dates">
                <ScrollViewer Margin="2"
                              HorizontalScrollBarVisibility="Auto"
                              VerticalScrollBarVisibility="Auto">
                    <exampleViews:DateExamples DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
            <TabItem Header="selection">
                <exampleViews:SelectionExamples DataContext="{Binding}" />
            </TabItem>
            <TabItem Header="sliders">
                <ScrollViewer Margin="2"
                              HorizontalScrollBarVisibility="Auto"
                              VerticalScrollBarVisibility="Auto">
                    <exampleViews:Sliders DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
            <TabItem Header="progress">
                <ScrollViewer Margin="2"
                              HorizontalScrollBarVisibility="Auto"
                              VerticalScrollBarVisibility="Auto">
                    <exampleViews:ProgressBars DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
            <TabItem Header="splitview">
                <ScrollViewer Margin="2" VerticalScrollBarVisibility="Auto">
                    <exampleViews:SplitViewExamples DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
            <TabItem Header="hamburger">
                <exampleViews:HamburgerMenuSample DataContext="{Binding}" />
            </TabItem>
            <TabItem Header="tabcontrol">
                <ScrollViewer Margin="2"
                              HorizontalScrollBarVisibility="Disabled"
                              VerticalScrollBarVisibility="Auto">
                    <exampleViews:TabControlExamples DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
            <TabItem Header="datagrid">
                <exampleViews:DataGridExamples DataContext="{Binding}" />
            </TabItem>
            <TabItem Header="tiles">
                <ScrollViewer Margin="2"
                              mah:ScrollViewerHelper.IsHorizontalScrollWheelEnabled="True"
                              HorizontalScrollBarVisibility="Visible"
                              VerticalScrollBarVisibility="Disabled">
                    <exampleViews:TilesExample DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
            <TabItem Header="colors">
                <exampleViews:ColorExample Margin="2" DataContext="{Binding}" />
            </TabItem>

            <TabItem Header="ColorPicker">
                <exampleViews:ColorPickerExample />
            </TabItem>

            <TabItem Header="MultiSelectionComboBox">
                <exampleViews:MultiSelectionComboBoxExample />
            </TabItem>

            <TabItem Header="others">
                <ScrollViewer Margin="2"
                              HorizontalScrollBarVisibility="Auto"
                              VerticalScrollBarVisibility="Auto">
                    <exampleViews:OtherExamples DataContext="{Binding}" />
                </ScrollViewer>
            </TabItem>
        </mah:MetroAnimatedSingleRowTabControl>

        <StatusBar Grid.Row="2">
            <StatusBarItem>MahApps.Metro DEMO Application</StatusBarItem>
            <Separator Style="{StaticResource MahApps.Styles.Separator.StatusBar}" />
            <StatusBarItem>Selected Tab:</StatusBarItem>
            <StatusBarItem Content="{Binding ElementName=MainTabControl, Path=SelectedItem.Header, Mode=OneWay}" />
        </StatusBar>
    </Grid>
</mah:MetroWindow>