Apply themes to wpf and use styles - wpf

I am trying to apply a theme to a bunch of wpf projects. There is one assembly containing the generic.xaml and different applications. As far as i understand i can't use the ThemeInfo attribute with ResourceDictionaryLocation.ExternalLocation because the name have to be the same as my program but I have more than one program...
So I search and found that I only have to include the dictionary as MergedDictionary in the app.xaml
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/ClassLibrary1;component/Themes/generic.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
This basically works. But if I use a style for the controls it will not apply the generic.xaml style anymore:
generic.xaml in ClassLibrary1.dll
<ResourceDictionary x:Class="ClassLibrary1.Themes.generic"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style TargetType="{x:Type Button}">
<Setter Property="Background"
Value="Black" />
</Style>
Window in program
<Window x:Class="Theming.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<Style TargetType="Button"
x:Key="ButtonGreenTextStyle">
<Setter Property="Foreground"
Value="Green" />
</Style>
</Window.Resources>
<Grid>
<Button Style="{DynamicResource ButtonGreenTextStyle}" Content="Test" />
</Grid>
</Window>
What I have to do, that WPF will understand the style in my generic.xaml as basestyle for all buttons (I know I will also have to write a ControlTemplate; the above code is just for simplicity)

Two things I would try
Create a generic ButtonBase style/template to set the look of all
buttons
Try using a BasedOn attribute on the ButtonGreeTextStyle,
basing it on an existing style.

I found another solution. You have to write styles based on a custom markup:
This will apply the current theme style. The code for this MarkupExtension can be found here:
How do I alter the default style of a button without WPF reverting from Aero to Classic?

Related

Applying global styles to combobox

I'm trying to apply a global style to all ComboBoxes in my application. I'm doing this by defining a Style in my App.xaml file and specifying a TargetType, which should apply that style to all controls that are of the specified type. However, it appears that my style is not being applied at all.
Here's my code:
App.xaml
<Application x:Class="Test.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:Test"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<Style TargetType="{x:Type ComboBox}">
<Setter Property="Background" Value="Red"></Setter>
</Style>
</ResourceDictionary>
</Application.Resources>
</Application>
MainWindow.xaml
<Window x:Class="Test.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Test"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<ComboBox Margin="173,130,186,166"></ComboBox>
</Grid>
</Window>
I do not have any code-behind at this point other than the default code that VS generates for WPF forms.
I expect this XAML code to change the background of any ComboBoxes in any window to red, without me needing to manually specify the style for each ComboBox. (I really don't want write it out manually for each ComboBox - my app will end up using many, many CBs and it would be a major pain - not to mention it looks cluttered.)
I tried to model my code after this question but did not get any results.
Try to avoid the nested ResourceDictionary in the App.Xaml.
Fix in this way:
<Application.Resources>
<Style TargetType="{x:Type ComboBox}">
<Setter Property="Background" Value="Red"></Setter>
</Style>
</Application.Resources>
I would suggest to create a folder in your solution and add in it a Xaml control : ResourceDictionary where you gonna define all your global styles you want to apply by default.
For example :
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style TargetType="{x:Type TextBox}">
<Setter Property="Height" Value="25"/>
<Setter Property="Background" Value="red"></Setter>
</Style>
</ResourceDictionary>
Now, you just need to put a reference in you App.Xaml like this :
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/Views/Style/GlobalStyle.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Hope it'll help you.
Have a good day.

xaml ResourceDictionary inside User Control Library

how is it possible to define a ResourceDictionary inside a User Control Library and access them via Xaml-Code.
I've created something like this:
<ResourceDictionary 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:Dialog="clr-namespace:MahApps.Metro.Controls.Dialogs;assembly=MahApps.Metro"
>
<Style x:Key="NormalStyle" TargetType="{x:Type Control}">
<Setter Property="Foreground" Value="Black" />
<Setter Property="FontSize" Value="12" />
<Setter Property="FontFamily" Value="Arial" />
<Setter Property="FontStyle" Value="Normal" />
</Style>
.
.
.
</ResourceDictionary
And now I want to use this "NormalStyle" with a Control
Style="{StaticResource NormalStyle}"
But Visual Studio says "The resource "NormalStyle" could not be resolved."
Did i miss or forget something?
Thanks for helping me
You will have to include or merge your ResourceDictionary with UserControl.Resources like below. Here in Source give path to your ResourceDictionary.
<UserControl.Resources>
<ResourceDictionary Source="MyResourceDictionary.xaml"/>
</UserControl.Resources>
OR
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="MyResourceDictionary.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
Then you can use the resources in the dictionary inside your UserControl
Style="{StaticResource NormalStyle}"
Please add style reference in App.xamal therfore so that it loads when you run the application.
When you add any external resource file you need to add it in App.xamal to get it's reference in your app else you need to manually add reference to every xamal form to access style and templates
This is how you going to add it in App.xamal using MergedDictionaries than where ever you refer any style in you application it will have it's reference
<ResourceDictionary.MergedDictionaries>
<!--
Styles that define common aspects of the platform look and feel
Required by Visual Studio project and item templates
-->
<ResourceDictionary Source="Common/CommonStyles.xaml"/>
<ResourceDictionary Source="Project/Common/CommonStyles.xaml"/>
</ResourceDictionary.MergedDictionaries>
Hope that helps
Alright, so I got it half to work. Inside my UserControlLibrary i made a new Xaml-File "UIStandards", where put all my Styles into. Now in my Main Project, i want to have access to these Styles and I think i should use a MergedDictionary.
What i did was this:
<Application x:Class="MentorPlusClientWindowsWPF.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:MentorPlusClientWindowsWPF"
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:Dialog="clr-namespace:MahApps.Metro.Controls.Dialogs;assembly=MahApps.Metro"
Startup="Application_Startup">
<!--StartupUri="MainWindow.xaml"-->
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/CrossProjectUserControls;component/UIStandards.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
As you can see, i referenced the UISTandards.xaml but inside a UserControl inside my MainProject, none of my Styles can be found.
Any solutions?

DynamicResource Cannot be resolved

I have been trying to learn about resources and styles, I want to create a chromeless window.
I have an example that acheives what I want via the following simple extracts of xaml.
I have a Resource set in Themes/Generic.xaml
<Style x:Key="BorderlessWindowStyle" TargetType="{x:Type Window}">
<Setter Property="AllowsTransparency" Value="true" />
<Setter Property="WindowStyle" Value="None" />
<Setter Property="ResizeMode" Value="CanResizeWithGrip" />
<Setter Property="Background" Value="Transparent" />
</Style>
I have a main window:
<Window x:Class="Project1.Shell"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:Project1"
x:Name="Window"
Title="Shell" Height="576" Width="1024" Style="{DynamicResource BorderlessWindowStyle}">
<Grid></Grid>
But the style is not being applied and VS designer states it cannot resolve the resource.
The example I have been looking at does things this way and I cannot discover the difference between what I have seen done and what I am trying to do.
I thought that Genric.xaml was a 'special' resource dictionary that should be discoverable by my Window control - and I am guessing this assumption is my error.
What do I need to do to make this work? (Now I understand I can set these properties in the Window xaml directly, and I have done so and get the effect I want. BUT I really want to undersatnd using the Generic.xaml resource dictionary way as I have presented here)
best regards
John.
Themes/generic.xaml file is automatically used to find default styles for Custom Controls. In your case you have an ordinary Window with custom style. You cannot define this style in Window.Resources section, because the style should be defined at a higher level. The only higher level of Window is App.xaml, because the Window is in fact its child. That's why the solution for your question is to place the style into App.Resources section.
Thought I would add the following example in case it helps some others out. To add a resource dictionary to your app.xaml file you can add the following xaml code to the app.xaml file.
<Application x:Class="ProjectX.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ProjectX"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!-- Use the Black skin by default -->
<ResourceDictionary Source="Resources\ResourceFile.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Where 'Resources' coudl be a folder in your project that contains the Resource Dictionary file (ResourceFile.xaml).
The you can add code to your resource dictionary like such:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ProjectX.Resources">
<!-- The Background Brush is used as the background for the Main Window -->
<SolidColorBrush x:Key="MainBackgroundBrush" Color="#FF202020" />
</ResourceDictionary>
And then finally, dynamically bind to your resource dictionary doing something like:
<Window
x:Class="ProjectX.MainWindow"
Title="Family.Show" Height="728" Width="960"
Background="{DynamicResource MainBackgroundBrush}"
ResizeMode="CanResizeWithGrip">
</Window>

Loading WPF Style from Resource File

I am trying to load WPF Style from other file actually from WPF Custom Control Library
but i am failing to load here is my solution.
The solution contains two projects
WpfTestControls of Type WPF Custom Control Library
WpfTestApp of type WPF Application Library which has reference to WpfTestControls
MainWindow.xaml from WPF Application Library
<Window.Resources>
<Style x:Key="TempStyle" TargetType="{x:Type TextBox}">
<Setter Property="BorderBrush" Value="Green"/>
</Style>
</Window.Resources>
<Grid>
<TextBox Height="50px" Width="100px" Style="{DynamicResource TempStyle}"/>
</Grid>
Generic.xaml from WPF Custom Control Library
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/WpfTestControls;component/TextBoxStyle.xaml"/>
</ResourceDictionary.MergedDictionaries>
TextBoxStyle.xaml from WPF Custom Control Library
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style x:Key="TempStyle" TargetType="{x:Type TextBox}">
<Setter Property="BorderBrush" Value="Green"/>
</Style>
My AssemblyInfo.cs file contains the following
[assembly: ThemeInfo(
ResourceDictionaryLocation.None, //where theme specific resource dictionaries are located
//(used if a resource is not found in the page,
// or application resource dictionaries)
ResourceDictionaryLocation.SourceAssembly //where the generic resource dictionary is located
//(used if a resource is not found in the page,
// app, or any theme specific resource dictionaries))]
But still i am failing to load the Style.
If i am using the not using the Generic.xaml everything work fine for example the following code works as expected
<Window x:Class="WpfTestApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<Style x:Key="TempStyle" TargetType="{x:Type TextBox}">
<Setter Property="BorderBrush" Value="Green"/>
</Style>
</Window.Resources>
<Grid>
<TextBox Height="50px" Width="100px" Style="{StaticResource TempStyle}"/>
</Grid>
What am i doing wrong ?
Thanks in advance
Please answer few things for me...
Is "WPF Custom Control Library" assembly same as "WpfTestControls" assembly?
If not, then does "WPF Custom Control Library" have a reference to the "WpfTestControls" assembly?
Does your WpfTestApp have a reference to both "WPF Custom Control Library" and "WpfTestControls" assemblies?
If you add that reference(s), the resources should load correctly.
My Steps...
Add a "WPF Custom Control Library" say "ThemesLibray"
In this add two resource dictionaries under "Themes" folder
TextBoxStyle.xaml
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style x:Key="GreenTextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="Background" Value="Green"/>
</Style>
</ResourceDictionary>
Generic.xaml
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="TextBoxStyle.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
I have main starup project "MyWPFTestApp" that has assembly reference to ThemesLibray. In that the window has ThemesLibrary resources merged this way....
<Window x:Class="MyWPFTestApp.Window7"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window7" Height="300" Width="300">
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary
Source="/ThemseLibrary;component/Themes/Generic.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid>
<TextBox Style="{StaticResource GreenTextBoxStyle}"/>
</Grid>
</Window>
When I launch MyWPFTestApp, I see the Window with green TextBox.
Main thing is : Make sure you have Build Action of your Resource Dictionary set to Resource.

WPF/XAML: Set a style with a different TargetType?

I have an external style resource in a resource dictionary I'm referencing with x:Key. It has an x:TargetType specifying a target (TextBlock). Is it possible to apply this to a control containing a TextBlock and have all TextBlock elements within that control have the style applied?
Thanks,
Robert
The easiest way to do that would be to define a Style within the Control that is based on your external style resource, but don't specify an x:Key, just the TargetType.
<Style TargetType="{x:Type TextBlock}" BasedOn="{StaticResource SomeOtherStyle}">
Without a key, it'll apply itself to all TextBlocks within the control.
To expand a bit on other comments. When you use the syntax as Brandon showed:
<Style TargetType="{x:Type TextBlock}" BasedOn="{StaticResource SomeOtherStyle}">
The BasedOn="" is basically a kind of "inheritance" of style. This style will have as its base set of setters the ones from the style it is based on. This gives you the ability to augment the style with the options that apply only in this case or, as your case requires, to redefine the scope of the style.
You have the style in your dictionary file as a keyed style, only able to be applied explicitly. By "re-defining" your style as Brandon showed you now can re-define the scope by leaving out the key, thus making it apply to all elements of the target type in the scope of that style. So if all your TextBlocks were in a Grid you could have something like this:
<Grid.Resources>
<Style TargetType="{x:Type TextBlock}" BasedOn="{StaticResource MyBaseStyle}">
</Style>
</Grid.Resources>
No, but you can automatically apply a style to all elements of a certain type, like this:
<!-- Applies to all buttons in scope of this style -->
<Style x:Key="{x:Type Button}" TargetType="{x:Type Button}">
...
</Style>
I think this is what you are looking for:
Your custom user control "test":
<UserControl x:Class="WpfApplication4.test"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Height="300" Width="300">
<Grid>
<TextBlock>test</TextBlock>
</Grid>
</UserControl>
Your Styles document "Res/Styles.xaml"
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style TargetType="{x:Type TextBlock}">
<Style.Setters>
<Setter Property="Foreground" Value="Blue" />
</Style.Setters>
</Style>
Your main window or parent:
<Window x:Class="WpfApplication4.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:uc="clr-namespace:WpfApplication4"
Title="Window1" Height="300" Width="300">
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Res/Styles.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid>
<uc:test></uc:test>
</Grid>
The textblock in the custom control "test" now displays with a blue foreground.

Resources