MahApps Metro setting Window Border styles from App Resources - wpf

I am trying to set Window Border styles for my MahApps Metro app. I have read the articles about how to set the different Border styles and I think I get it. However, I am trying to set the Border Style for all windows in my app to be the same (all Drop Shadow) and it doesn't seem to want to work.
I have app resources that look like this:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/GSDXThemes;component/GSDXDarkYellowTheme.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
My Resource dictionary looks like this:
<!-- Merge in ResourceDictionaries defining base styles to use. This theme is based on the Metro Dark Yellow theme. -->
<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/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Yellow.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseDark.xaml" />
<ResourceDictionary Source="pack://application:,,,/GSDXThemes;component/GSDXControlStyles.xaml" />
</ResourceDictionary.MergedDictionaries>
The GSDXControlStyles dictionary just sets some custom style values for my app. It is in this file that I try to set the Window Borders.
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:resx="clr-namespace:GSDXThemes.Properties"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:System="clr-namespace:System;assembly=mscorlib"
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:GSDUserControls="clr-namespace:GSD.CommonGUI.UserControls;assembly=CommonGUI">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
</ResourceDictionary.MergedDictionaries>
<!-- Now customize the theme for our use...mostly just changing font sizes, etc...-->
<Style TargetType="{x:Type Controls:MetroWindow}" >
<Setter Property="WindowTransitionsEnabled" Value="False" />
<Setter Property="EnableDWMDropShadow" Value="True" />
</Style>
<Style TargetType="{x:Type Label}" BasedOn="{StaticResource MetroLabel}">
<Setter Property="FontSize" Value="16"/>
</Style>
<Style TargetType="{x:Type TextBox}" BasedOn="{StaticResource MetroTextBox}">
<Setter Property="FontSize" Value="16"/>
</Style>
...
All the other style settings work fine. But the first line for setting the Window Border does nothing. All my windows show with no border.
How can I get this to work so all Windows have the Drop Shadow border?

you must give your style a key to get a working solution
<Style x:Key="CustomDefaultWindowStyle"
TargetType="{x:Type Controls:MetroWindow}"
BasedOn="{StaticResource {x:Type Controls:MetroWindow}}" >
<Setter Property="WindowTransitionsEnabled" Value="False" />
<Setter Property="EnableDWMDropShadow" Value="True" />
</Style>
now use this style on all your MetroWindows
<Controls:MetroWindow x:Class="YourWindowClass"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:System="clr-namespace:System;assembly=mscorlib"
Title="Custom Window Style Demo"
Height="600"
Width="800"
WindowStartupLocation="CenterScreen"
Style="{DynamicResource CustomDefaultWindowStyle}">
...
</Controls:MetroWindow>
(don't be afraid of the'Invalid style target type:...' message, it's a VS bug)
hope that helps

Related

Style Defined in app.xaml is only applied in the Designer but not a Runtime

I put the two following Style in App.xaml of my WPF application. If I change the FontSize to a different value, the Designer of Visual Studio 2019 shows all the controls with the specified FontSize. If I run the app, the controls show a FontSize of 12.
<Application x:Class="testapp.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:testapp"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="View/Themes/ButtonStyle.xaml"/>
<ResourceDictionary Source="View/Themes/CheckBoxStyle.xaml"/>
<ResourceDictionary Source="View/Themes/ComboBoxStyle.xaml"/>
<ResourceDictionary Source="View/Themes/DataGridStyle.xaml"/>
</ResourceDictionary.MergedDictionaries>
<Style TargetType="{x:Type Page}">
<Setter Property="FontSize" Value="18" />
</Style>
<Style TargetType="{x:Type Window}">
<Setter Property="FontSize" Value="18" />
</Style>
</ResourceDictionary>
</Application.Resources>
If you research a bit, there has been an issue on this going back ten+ years on windows/pages. In design time the designer will get the style, but due to the Page/Window being derived types, during runtime they won't.
The fix (or workaround depending one one's viewpoint) is to name the style in app.xaml with x:key such as (page only shown for brevity):
<Style x:Key="pStyle" TargetType="{x:Type Page}">
<Setter Property="FontSize" Value="18" />
</Style>
and then set to the static resource style on each page/window such as below
Style="{StaticResource pStyle}"
such as:
<Page x:Class="WPFStack.ListBox.ListViewQuestion"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:WPFStack.ListBox"
mc:Ignorable="d"
xmlns:model="clr-namespace:WPFStack.Model"
d:DesignHeight="450" d:DesignWidth="800"
Style="{StaticResource pStyle}"
Title="ListViewQuestion">
See How to set default WPF Window Style in app.xaml

right to left dialog in mahapps

I'm using Mahapps,metro toolkit for create a WPF application.I want to show a right to left dialog.
await this.ShowMessageAsync("This is the title", "Some message");
I am usig above code to create dialog but it is left to right.
This is how to align right in a MessageBox. You should check to see if there is a similar way to do this using MahApps.Metro:
MessageBox.Show("hi", "hey", MessageBoxButton.OK, MessageBoxImage.Information, MessageBoxResult.OK, MessageBoxOptions.RightAlign);
The parameters, in order, are:
Message
Title
Button type
Icon displayed
Button type that is returned by user click
Display options (this is the parameter you are looking for)
This creates the following dialog box:
I found the solution.just add this style to app.xaml
<Style TargetType="{x:Type Dialog:MessageDialog}"
BasedOn="{StaticResource {x:Type Dialog:BaseMetroDialog}}">
<Setter Property="FlowDirection" Value="RightToLeft" />
</Style>
Here is my app.xaml file
<Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:RandomQuestions"
xmlns:Dialogs="clr-namespace:MahApps.Metro.Controls.Dialogs;assembly=MahApps.Metro"
xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary >
<Style TargetType="{x:Type Dialogs:MessageDialog}" BasedOn="{StaticResource {x:Type Dialogs:BaseMetroDialog}}">
<Setter Property="FlowDirection" Value="RightToLeft" />
</Style>
<ResourceDictionary.MergedDictionaries>
<!-- MahApps.Metro resource dictionaries. Make sure that all file names are Case Sensitive! -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
<!-- Accent and AppTheme setting -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Amber.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>

Trying to change window background color from XAML file

I'm playing around with the ExpressionDark.xaml theme. I'm setting the theme in App.xaml:
<Application x:Class="WpfApplication4.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary Source="Themes/ExpressionDark.xaml"/>
</Application.Resources>
</Application>
I looked at how they were setting the colors and styles of other controls, but am unable to produce the same result with the window.
If you like, you can see the XAML here.
Here's the XAML I'm trying:
<Style TargetType="{x:Type Window}">
<Setter Property="Background" Value="{DynamicResource BlackTestBrush}" />
<Style.Triggers>
</Style.Triggers>
</Style>
<SolidColorBrush x:Key="BlackTestBrush" Color="#FF000000" />
Any ideas on what I'm doing wrong here?
Thanks

wpf merge multiple styles into one style

I have a UserControl that consists of a listview it looks like:
<UserControl
....
<UserControl.Resources>
<Style TargetType="Thumb">
<!-- Style Content -->
</Style>
<Style TargetType="GridViewColumnHeader">
<!-- Style Content -->
</Style>
<Style TargetType="{x:Type ScrollBar}">
<!-- Style Content -->
</Style>
<Style TargetType="{x:Type ScrollViewer}">
<!-- Style Content -->
</Style>
<Style TargetType="{x:Type ListViewItem}">
<!-- Style Content -->
</Style>
</UserControl.Resources>
<ListView Name="ListView1" >
<!-- ListViewContent -->
</Style>
</UserControl>
I have 3 of those userControls where the only thing that is different between them is the styles in <UserControl.Resources>. It makes no scene to have to create multiple controls that have the same functionality just because I need a different look and feel. What I want to do now is combine all the styles in <UserControl.Resources> into one style. If I manage to group all those styles into one I would be able to remove the 3 controls and change the style as:
<ListView Style={DynamicResource style1} ...
Currently if I do
<UserControl.Resources>
<Style x:Key="style1">
<!-- Place all styles in here -->
</Style>
</UserControl.Resources>
It does not work.
Edit
Thanks to iltzortz answer I now have:
Dictionary1.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style TargetType="Grid">
<Setter Property="Background" Value="Green"></Setter>
</Style>
<SolidColorBrush x:Key="Foo" Color="Red"></SolidColorBrush>
</ResourceDictionary>
Dictionary2.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style TargetType="Grid">
<Setter Property="Background" Value="Black"></Setter>
</Style>
<SolidColorBrush x:Key="Foo" Color="Orange"></SolidColorBrush>
</ResourceDictionary>
MyUserControl:
<UserControl x:Class="WpfApplication1.UserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="97" d:DesignWidth="91">
<UserControl.Resources>
<ResourceDictionary Source="Dictionary1.xaml" ></ResourceDictionary>
</UserControl.Resources>
<Grid >
<Ellipse Fill="{DynamicResource Foo}" />
</Grid>
</UserControl>
And I change resource dictionaries dynamically like this: switching wpf resource dictionaries at runtime
Add a resource dictionary to your application named e.g. common.xaml
and put your common styles there
then you can reuse it with:
<UserControl.Resources>
<ResourceDictionary Source="common.xaml"/>
</UserControl.Resources>
You can create 3 resource dictionaries and merge them at runtime. In my example code I used two resource dictionaries.
Example:
Dictionary1.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style x:Key="btnStyle" TargetType="Button">
<Setter Property="Margin" Value="0,10,0,0" />
</Style>
</ResourceDictionary>
Dictionary2.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style x:Key="btnStyle" TargetType="Button">
<Setter Property="Margin" Value="50,50,0,0" />
</Style>
</ResourceDictionary>
In the start of application you can set default style in App.xaml file:
<Application x:Class="Example.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/Dictionary1.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
If you want to change style, you can merge resource dictionaries:
ResourceDictionary dict = new ResourceDictionary();
dict.Source = new Uri("\\Dictionary2.xaml", UriKind.Relative);
this.Resources.MergedDictionaries.Add(dict);
And now binding looks like this:
<Button Style="{DynamicResource btnStyle}" Content="Click me!" />
Now if you invoke code to merge resource dictionaries, button style will be automatically changed.

how do i inherit/overwrite a forced style from a windows theme?

currently i am forcing my WPF app to use the luna theme no matter what, with this XAML code
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Styles.xaml" />
<ResourceDictionary Source="NavigationCommands.xaml" />
<ResourceDictionary Source="/RibbonControlsLibrary;component/Themes/Office2007Blue.xaml"/>
<ResourceDictionary Source="/PresentationFramework.Luna, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35, ProcessorArchitecture=MSIL;;component/Themes/luna.normalcolor.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
and now i want to extend the style of every textbox with this validation trigger
<Style TargetType="TextBox">
<Style.Triggers>
<Trigger Property="Validation.HasError" Value="true">
<Setter Property="Background" Value="#d3e1f3"></Setter>
<Setter Property="ToolTip"
Value="{Binding RelativeSource={RelativeSource Self},
Path=(Validation.Errors)[0].ErrorContent}"/>
</Trigger>
</Style.Triggers>
</Style>
but this trigger does not work, because i forced the luna theme. (without the forced theme every thing works as it should, but doesn't look as it should :( )
is there some way to force the luna theme and extend it's style? probably over the BasedOn property?
atm i defined a key for the style in question and added it to every textbox by hand, that works but isn't the prettiest way to go.
tia
Try
<Style x:Key="{x:Type TextBox}" TargetType="{x:Type TextBox}">
The BasedOn syntax for type styles is as follows:
<Style TargetType="TextBox" BasedOn="{StaticResource {x:Type TextBox}}">
HTH
Have you tried to set the lune resourcedictionary first and your own resourcedictionary last?
I can imagine the luna theme overrides your style.
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/PresentationFramework.Luna, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35, ProcessorArchitecture=MSIL;;component/Themes/luna.normalcolor.xaml" />
<ResourceDictionary Source="/RibbonControlsLibrary;component/Themes/Office2007Blue.xaml"/>
<ResourceDictionary Source="Styles.xaml" />
<ResourceDictionary Source="NavigationCommands.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Use the mentioned
<Style TargetType="TextBox" BasedOn="{StaticResource {x:Type TextBox}}">
but also make sure your dictionaries are included in right order - first the ones you are basing your style on
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/RibbonControlsLibrary;component/Themes/Office2007Blue.xaml"/>
<ResourceDictionary Source="/PresentationFramework.Luna, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35, ProcessorArchitecture=MSIL;;component/Themes/luna.normalcolor.xaml" />
<ResourceDictionary Source="Styles.xaml" />
<ResourceDictionary Source="NavigationCommands.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

Resources