How can I use StaticResources defined in App.xaml in other ResourceDictionaries? - c#

I defined some StaticResource styles inside App.xaml to use it across the app:
<Application x:Class="TaskListApp.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TaskListApp"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<SolidColorBrush x:Key="primaryColor" Color="#B5B4D9"/>
<SolidColorBrush x:Key="secondaryColor" Color="#393E59"/>
<SolidColorBrush x:Key="backgroundColor" Color="#2a2e42"/>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="./Themes/CheckboxTheme.xaml"/>
<ResourceDictionary Source="./Themes/TasksTheme.xaml"/>
<ResourceDictionary Source="./Themes/TaskListTheme.xaml"/>
<ResourceDictionary Source="./Themes/MenuButtonTheme.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Using it in MainWindow.xaml is making no errors and works just fine:
<Grid Grid.Row="2"
Background="{StaticResource backgroundColor}"
</Grid>
But when I added it inside a ResourceDictionary (in this case TaskListTheme.xaml), I got an exception:
Exception: Cannot find resource named 'primaryColor'. Resource names are case
sensitive.
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style TargetType="ListBoxItem" x:Key="TaskListTheme">
<Setter Property="Margin" Value="0,0,0,5"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<Label Grid.Column="1" Content="{Binding TaskListItemName}"
Margin="0"
Height="50"
Background="{StaticResource primaryColor}"
Padding="10,0,0,0"
Foreground="{StaticResource secondaryColor}"
FontSize="15"
FontWeight="SemiBold"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Center"
BorderThickness="0"/>
</Grid>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
How can I resolve this kind of problem?

If a resource in TaskListTheme.xaml has a dependency on a resource that is defined in another resource dictionary, you should merge the latter into TaskListTheme.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Colors.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
So move your *Color brush resources to Colors.xaml and then either merge Colors.xaml into the other resource dictionaries or into App.xaml:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Colors.xaml"/>
<ResourceDictionary Source="./Themes/CheckboxTheme.xaml"/>
<ResourceDictionary Source="./Themes/TasksTheme.xaml"/>
<ResourceDictionary Source="./Themes/TaskListTheme.xaml"/>
<ResourceDictionary Source="./Themes/MenuButtonTheme.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>

I think mm8's answer is standard way. Said that, you can just move resources directly under Application.Resources to ResourceDictionary inside MergedDictionaries to achieve the same effect.
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary>
<SolidColorBrush x:Key="primaryColor" Color="#B5B4D9"/>
<SolidColorBrush x:Key="secondaryColor" Color="#393E59"/>
<SolidColorBrush x:Key="backgroundColor" Color="#2a2e42"/>
</ResourceDictionary>
<ResourceDictionary Source="./Themes/CheckboxTheme.xaml"/>
<ResourceDictionary Source="./Themes/TasksTheme.xaml"/>
<ResourceDictionary Source="./Themes/TaskListTheme.xaml"/>
<ResourceDictionary Source="./Themes/MenuButtonTheme.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>

Related

Setting the Template property on a UserControl is not supported

I want to make a UserControl which can be used like the example below, however I don't know how to implement that. I found that example somewhere on WPF but seams like this is not supported anymore?
I get following error "WinRT information: Setting the Template property on a UserControl is not supported."
<UserControl
x:Class="Test.Gui.Widgets.WidgetFrame"
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"
mc:Ignorable="d">
<UserControl.Template>
<ControlTemplate TargetType="UserControl">
<Grid BorderBrush="Red" BorderThickness="1">
<ContentPresenter/>
<TextBlock FontSize="100" Foreground="AntiqueWhite">This is a Test</TextBlock>
</Grid>
</ControlTemplate>
</UserControl.Template>
</UserControl>
Using the control
<local:WidgetFrame>
<TextBlock FontSize="20" Foreground="Green">Content Presentation</TextBlock>
</local:WidgetFrame>
I found the solution by looking into other github repos
Seperate xaml and cs file
WidgetFrame.xaml
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:local="using:Test.Gui.Widgets">
<Style TargetType="local:WidgetFrame">
<Style.Setters>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Grid BorderBrush="Red" BorderThickness="1">
<ContentPresenter/>
<TextBlock FontSize="100" Foreground="AntiqueWhite">This is a Test</TextBlock>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style.Setters>
</Style>
</ResourceDictionary>
Add it to the App.xaml
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
<ResourceDictionary Source="ms-appx:///Gui/Widgets/WidgetFrame.xaml"/>
<!-- Other merged dictionaries here -->
</ResourceDictionary.MergedDictionaries>
<!-- Other app resources here -->
</ResourceDictionary>
</Application.Resources>
WidgetFrame.cs
internal class WidgetFrame : ContentControl
{
public WidgetFrame() { }
}
Now I can place the content with xaml without overwriting the template
<widgets:WidgetFrame Width="200" Height="200">
<Button>Yes!</Button>
</widgets:WidgetFrame>

Exception when resource is defined in the control library and is referenced from main app

I have two projects in my solution: main WPF app and control library. Inside control library there are three resource dictionaries: Colors.xaml, Styles.xaml and Generic.xaml with the following contents:
Colors.xaml
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<SolidColorBrush x:Key="MyBrush"
Color="Yellow" />
</ResourceDictionary>
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 TextBox}"
x:Key="DefaultTextBox">
<Setter Property="Background"
Value="{StaticResource MyBrush}"></Setter>
</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="Styles.xaml" />
<ResourceDictionary Source="Color.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
Now, I want to add this Generic.xaml into application resources and use the textbox style inside main window like this:
App.xaml
<Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="WpfApplication1.App"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/ClassLibrary;component/Generic.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
MainWindow.xaml
<Window
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"
x:Class="WpfApplication1.MainWindow"
mc:Ignorable="d"
Title="MainWindow" Height="700" Width="525">
<TextBox Style="{StaticResource DefaultTextBox}" />
</Window>
BUT the problem is that it leads to exception
'{DependencyProperty.UnsetValue}' is not a valid value for property 'Background'.
At the same time using <TextBox Background="{StaticResource MyBrush}"/> works fine. How can I fix this problem?

"Property elements cannot be in the middle of an element's content." error in WPF application

I am using Dragablz tab control in my WPF application. Following code in my App.xaml was running fine last night but when I loaded the project today, it is showing me this error:
Property elements cannot be in the middle of an element's content.
They must be before or after the content.
<Application x:Class="MVCP.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dragablz="clr-namespace:Dragablz;assembly=Dragablz"
StartupUri="FloatingActivator.xaml">
<Application.Resources>
<ResourceDictionary>
<Style x:Key="OpenSans">
<Setter Property="TextElement.FontFamily" Value="Open Sans, /MVCP;component/Fonts/#Open Sans" />
</Style>
<ResourceDictionary.MergedDictionaries>
<!-- primary color -->
<ResourceDictionary>
<!-- include your primary palette -->
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/MaterialDesignColor.Indigo.xaml" />
</ResourceDictionary.MergedDictionaries>
<!--
include three hues from the primary palette (and the associated forecolours).
Do not rename, keep in sequence; light to dark.
-->
<SolidColorBrush x:Key="PrimaryHueLightBrush" Color="{StaticResource Primary100}"/>
<SolidColorBrush x:Key="PrimaryHueLightForegroundBrush" Color="{StaticResource Primary100Foreground}"/>
<SolidColorBrush x:Key="PrimaryHueMidBrush" Color="{StaticResource Primary500}"/>
<SolidColorBrush x:Key="PrimaryHueMidForegroundBrush" Color="{StaticResource Primary500Foreground}"/>
<SolidColorBrush x:Key="PrimaryHueDarkBrush" Color="{StaticResource Primary700}"/>
<SolidColorBrush x:Key="PrimaryHueDarkForegroundBrush" Color="{StaticResource Primary700Foreground}"/>
</ResourceDictionary>
<!-- secondary colour -->
<ResourceDictionary>
<!-- include your secondary pallette -->
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/MaterialDesignColor.Yellow.xaml" />
</ResourceDictionary.MergedDictionaries>
<!-- include a single secondary accent color (and the associated forecolour) -->
<SolidColorBrush x:Key="SecondaryAccentBrush" Color="{StaticResource Accent200}"/>
<SolidColorBrush x:Key="SecondaryAccentForegroundBrush" Color="{StaticResource Accent200Foreground}"/>
</ResourceDictionary>
<!-- Include the Dragablz Material Design style -->
<ResourceDictionary Source="pack://application:,,,/Dragablz;component/Themes/materialdesign.xaml"/>
</ResourceDictionary.MergedDictionaries>
<!-- tell Dragablz tab control to use the Material Design theme -->
<Style TargetType="{x:Type dragablz:TabablzControl}" BasedOn="{StaticResource MaterialDesignTabablzControlStyle}" />
<Style x:Key="FileItemStyle" TargetType="{x:Type ListViewItem}">
<Setter Property="Margin" Value="5,5,5,5"/>
<Setter Property="Padding" Value="0,0,0,0"/>
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListViewItem}">
<Grid HorizontalAlignment="Left" VerticalAlignment="Top" Height="50" >
<Border x:Name="border" BorderBrush="{x:Null}" BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" CornerRadius="2.5"/>
<StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<ContentPresenter/>
</StackPanel>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
</Application.Resources>
</Application>
The reason is simple: you first add style "OpenSans", then you set MergedDictionary property, then you add two more styles. To fix, just reorder like this:
<Application x:Class="MVCP.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dragablz="clr-namespace:Dragablz;assembly=Dragablz"
StartupUri="FloatingActivator.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!-- primary color -->
<ResourceDictionary>
<!-- include your primary palette -->
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/MaterialDesignColor.Indigo.xaml" />
</ResourceDictionary.MergedDictionaries>
<!--
include three hues from the primary palette (and the associated forecolours).
Do not rename, keep in sequence; light to dark.
-->
<SolidColorBrush x:Key="PrimaryHueLightBrush" Color="{StaticResource Primary100}"/>
<SolidColorBrush x:Key="PrimaryHueLightForegroundBrush" Color="{StaticResource Primary100Foreground}"/>
<SolidColorBrush x:Key="PrimaryHueMidBrush" Color="{StaticResource Primary500}"/>
<SolidColorBrush x:Key="PrimaryHueMidForegroundBrush" Color="{StaticResource Primary500Foreground}"/>
<SolidColorBrush x:Key="PrimaryHueDarkBrush" Color="{StaticResource Primary700}"/>
<SolidColorBrush x:Key="PrimaryHueDarkForegroundBrush" Color="{StaticResource Primary700Foreground}"/>
</ResourceDictionary>
<!-- secondary colour -->
<ResourceDictionary>
<!-- include your secondary pallette -->
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/MaterialDesignColor.Yellow.xaml" />
</ResourceDictionary.MergedDictionaries>
<!-- include a single secondary accent color (and the associated forecolour) -->
<SolidColorBrush x:Key="SecondaryAccentBrush" Color="{StaticResource Accent200}"/>
<SolidColorBrush x:Key="SecondaryAccentForegroundBrush" Color="{StaticResource Accent200Foreground}"/>
</ResourceDictionary>
<!-- Include the Dragablz Material Design style -->
<ResourceDictionary Source="pack://application:,,,/Dragablz;component/Themes/materialdesign.xaml"/>
</ResourceDictionary.MergedDictionaries>
<Style x:Key="OpenSans">
<Setter Property="TextElement.FontFamily" Value="Open Sans, /MVCP;component/Fonts/#Open Sans" />
</Style>
<!-- tell Dragablz tab control to use the Material Design theme -->
<Style TargetType="{x:Type dragablz:TabablzControl}" BasedOn="{StaticResource MaterialDesignTabablzControlStyle}" />
<Style x:Key="FileItemStyle" TargetType="{x:Type ListViewItem}">
<Setter Property="Margin" Value="5,5,5,5"/>
<Setter Property="Padding" Value="0,0,0,0"/>
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListViewItem}">
<Grid HorizontalAlignment="Left" VerticalAlignment="Top" Height="50" >
<Border x:Name="border" BorderBrush="{x:Null}" BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" CornerRadius="2.5"/>
<StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<ContentPresenter/>
</StackPanel>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
</Application.Resources>

Replace default WPF theme Style for all controls

I tried to replace the default style at my WPF project for all my controls.
I created a ResourceDictionary like this:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style x:Key="{x:Type Button}" TargetType="{x:Type Button}">
<Setter Property="Background" Value="Black"/>
</Style>
</ResourceDictionary>
and in my App.Xaml I wrote this:
<Application.Resources>
<ResourceDictionary >
<ResourceDictionary.MergedDictionaries >
<ResourceDictionary Source="pack://application:,,,/MYTestTheme;component/Themes/Aero.NormalColor.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Now in my MainWindow.Xaml I created a button and the style was on it.
I want to crate a new button MyButton who inherited from button
And I want every Button defined style will be on MyButton when I place it on my MainWindow.Xaml but that does not happen.
One more important thing I don't want to use BasedOn.
I was see this code at some blogas:
<Application>
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source=”{ThemeDictionary MyApplication}”/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
But it's not worked!!!
Thanks
Give your key a string name:
<Style x:Key="MyButton" TargetType="{x:Type Button}">
<Setter Property="Background" Value="Black"/>
</Style>
And add this in the App.XAML (outside your Application.Resources block):
<Style TargetType="{x:Type Button}" BasedOn="{StaticResource MyButton}" />

Style not being picked up WPF

I am trying to set up styles in an external DLL that will be used to define how certain controls should look.
I have a resource dictionary defined in an external DLL that has a style targeted at TextBoxes:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style TargetType="{x:Type TextBox}" x:Key="TextStyle">
<Setter Property="Text" Value="Moo"/>
</Style>
</ResourceDictionary>
I then reference this built DLL in another application. This works:
<Window x:Class="HTMLTest.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>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/GX3Resources;component/Resources.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid>
<TextBox Height="23" HorizontalAlignment="Left" Margin="45,217,0,0" Name="textBox1" VerticalAlignment="Top" Width="120" Style="{StaticResource TextStyle}"/>
</Grid>
</Window>
This does not:
<Window x:Class="HTMLTest.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>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/GX3Resources;component/Resources.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid>
<TextBox Height="23" HorizontalAlignment="Left" Margin="45,217,0,0" Name="textBox1" VerticalAlignment="Top" Width="120" />
</Grid>
</Window>
I would hope the above would pick up the TextStyle as is it a text box and the style is targetted at textboxes.
If you can edit the original style, you can use it for all Textboxes automatically by setting its key property to the target type:
<Style TargetType="{x:Type TextBox}" x:Key="{x:Type TextBox}">
If you can't change the style, try to create another one based on it:
<Style TargetType="{x:Type TextBox}"
BasedOn="{StaticResource TextStyle}"
x:Key="{x:Type TextBox}">
</Style>

Categories