My styles are separated in separate files for better organization and readability. All files are referenced in my App.xaml. Some styles are BasedOn other styles, so I have placed them in the proper order so that the inherited styles are loaded before the dependent ones. However, I am still getting the following error on my XAML views that reference a font style, for example...Cannot find a Resource with the Name/Key SourceSansPro-Light.
Can someone enlighten me on why this Name/Key cannot be found? Here's the relevant code.
App.xaml
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Common/Styles/StyleResources.xaml" />
<ResourceDictionary Source="Common/Styles/InputStyles.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
StyleResources.xaml
<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Light">
<SolidColorBrush x:Key="TextBoxBackgroundBrush" Color="White"/>
</ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>
<FontFamily x:Key="SourceSansPro-Light">../../Assets/Fonts/SourceSansPro-Light.otf#Source Sans Pro</FontFamily>
<Style x:Key="TextBlockStyle" TargetType="TextBlock" BasedOn="{StaticResource BaseTextBlockStyle}">
<Setter Property="FontSize" Value="18"/>
<Setter Property="FontFamily" Value="{StaticResource SourceSansPro-Semibold}" />
</Style>
InputStyles.xaml
<Style x:Key="SecondaryTextStyle" TargetType="TextBlock" BasedOn="{StaticResource TextBlockStyle}">
<Setter Property="FontFamily" Value="{StaticResource SourceSansPro-Light}"/>
</Style>
HomePage.xaml (where style, SourceSansPro-Light, is being called in this view)
<Page.Resources>
<Style x:Name="InfoBodyTextStyle" TargetType="TextBlock">
<Setter Property="FontFamily" Value="{StaticResource SourceSansPro-Light}"/>
</Style>
Please try this code.
<Style TargetType="TextBlock">
<Setter Property="Foreground" Value="#FF64CCEF"/>
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="FontFamily" Value="{DynamicResource FontFamilyResource}"/>
</Style>
<FontFamily x:Key="FontFamilyResource">/ApplicationName(SolutionName);component/Resources/Fonts/#Vladimir Script</FontFamily>
Related
Don't ask me why, but I thought only <ContentPage> can have <ContentPage.Resources>.
So I had a bunch of color setters and what not in almost every XAML page like this:
<ContentPage.Resources>
<Style TargetType="NavigationPage">
<Setter Property="BarBackgroundColor" Value="#000" />
<Setter Property="BarTextColor" Value="#20b8a2" />
</Style>
<Style TargetType="ContentPage">
<Setter Property="BackgroundColor" Value="#231f20" />
</Style>
<Style TargetType="Label">
<Setter Property="TextColor" Value="#f7f7f7" />
</Style>
<Style TargetType="Entry">
<Setter Property="TextColor" Value="#f7f7f7" />
</Style>
<Style TargetType="Button">
<Setter Property="BackgroundColor" Value="#0089c1" />
<Setter Property="TextColor" Value="#f7f7f7" />
<Setter Property="CornerRadius" Value="0" />
</Style>
</ContentPage.Resources>
So how to change all main colors in one place?
So instead of having resources in every Solution/App/Views/SubPage.xaml file there is obviously an outermost XAML file in general projects root Solution/App/App.xaml where you can simply set these resources for entire application.
<Application ...>
<Application.Resources>
<Color x:Key="PrimaryColor">#20b8a2</Color> <!-- turqoise -->
<Color x:Key="SecondaryColor">#0089c1</Color> <!-- blue -->
<Color x:Key="TertiaryColor">#ef569f</Color> <!-- pink -->
<Color x:Key="ThemeExtremeColor">#000000</Color>
<Color x:Key="ThemeMainColor">#231f20</Color>
<Color x:Key="ThemeLighterColor">#333333</Color>
<Color x:Key="TextColor">#f7f7f7</Color>
<Style TargetType="NavigationPage">
<Setter Property="BarBackgroundColor" Value="{StaticResource ThemeExtremeColor}" />
<Setter Property="BarTextColor" Value="{StaticResource PrimaryColor}" />
</Style>
<Style TargetType="ContentPage">
<Setter Property="BackgroundColor" Value="{StaticResource ThemeMainColor}" />
</Style>
<Style TargetType="Grid">
<Setter Property="BackgroundColor" Value="{StaticResource ThemeMainColor}" />
</Style>
<!--<Style TargetType="ListView">
<Setter Property="BackgroundColor" Value="{StaticResource ThemeMainColor}" />
</Style>-->
<Style TargetType="Label">
<Setter Property="TextColor" Value="{StaticResource TextColor}" />
</Style>
<Style TargetType="Entry">
<Setter Property="TextColor" Value="{StaticResource TextColor}" />
</Style>
<Style TargetType="Button">
<Setter Property="BackgroundColor" Value="{StaticResource SecondaryColor}" />
<Setter Property="TextColor" Value="{StaticResource TextColor}" />
<Setter Property="CornerRadius" Value="0" />
</Style>
</Application.Resources>
....
</Application>
Now "{StaticResource TextColor}" can be used anywhere in XAML.
I have a user control with defined resources.
Here is some code for illustration.
<UserControl.Resources>
<SolidColorBrush x:Key="foregroundColor" Color="Red"/>
<Style x:Key="buttonFontIconStyle" TargetType="FontIcon">
<Setter Property="FontFamily" Value="Segoe MDL2 Assets"></Setter>
<Setter Property="Foreground" Value="{Binding ???}"></Setter>
</Style>
<Style x:Key="menuItemLabelStyle" TargetType="TextBlock">
<Setter Property="VerticalAlignment" Value="Center"></Setter>
<Setter Property="Foreground" Value="{Binding ???}"></Setter>
</Style>
</UserControl.Resources>
Now, I wish to use value defined in foreground color for buttonFontIconStyle, menuItemLabelStyle (and many others). Is it somehow possible to bind to value from resources in resources, or is there a way to specifiy color once (in xaml preferrably) and use it in multiple resources styles?
You can use the StaticResource :
<Style x:Key="buttonFontIconStyle" TargetType="FontIcon">
<Setter Property="FontFamily" Value="Segoe MDL2 Assets"></Setter>
<Setter Property="Foreground" Value="{StaticResource foregroundColor}"></Setter>
</Style>
<Style x:Key="menuItemLabelStyle" TargetType="TextBlock">
<Setter Property="VerticalAlignment" Value="Center"></Setter>
<Setter Property="Foreground" Value="{StaticResource foregroundColor}"></Setter>
</Style>
I have a UWP App. The Styles works without a problem when I execute the app. But not in the Designer. Especially User Control can't be loaded. The Error message who is displayed is:
Cannot find a Resource with the Name / Key [Name]
When I go to that User Control it mostly is displayed correctly.
I reference the style with:
Style="{StaticResource DeemphasizedBodyTextBlockStyle}"
I have a file for my Textstyles. In that file I have the style defined as followed:
<Style x:Key="DeemphasizedBodyTextBlockStyle"
TargetType="TextBlock"
BasedOn="{StaticResource BodyTextBlockStyle}">
<Setter Property="FontSize"
Value="12" />
<Setter Property="TextWrapping"
Value="NoWrap" />
<Setter Property="CharacterSpacing"
Value="75" />
<Setter Property="HorizontalAlignment"
Value="Left" />
<Setter Property="VerticalAlignment"
Value="Top" />
<Setter Property="Foreground"
Value="{StaticResource AppForegroundColorSecondary}" />
</Style>
And in the properties of the view project I have a Designer Resource file added (as page) with the following content:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="ms-appx:///Style/AppStyles.xaml" />
<ResourceDictionary Source="ms-appx:///Style/ColorsDark.xaml" />
<ResourceDictionary Source="ms-appx:///Style/ColorsLight.xaml" />
<ResourceDictionary Source="ms-appx:///Style/ControlStyles.xaml" />
<ResourceDictionary Source="ms-appx:///Style/TextStyles.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
The whole repo is available here: https://github.com/MoneyFox/MoneyFox
I have a windows 8.1 app.
In Project.Shared there is ResourceDictionary SharedResources.xaml with base style,
<Style x:Key="CommonLayerListItemStyle" TargetType="TextBlock">
<Setter Property="FontFamily" Value="Segoe WP" />
<Setter Property="Foreground" Value="{StaticResource UnselectBrush}" />
<Setter Property="VerticalAlignment" Value="Stretch" />
</Style>
in Windows Phone app is StyleResources.xaml wiht style based on this
<Style x:Key="LayerListItemStyle"
BasedOn="{StaticResource CommonLayerListItemStyle}"
TargetType="TextBlock">
<Setter Property="FontSize" Value="20" />
</Style>
same in Windows app StyleResources.xaml:
<Style x:Key="LayerListItemStyle"
BasedOn="{StaticResource CommonLayerListItemStyle}"
TargetType="TextBlock">
<Setter Property="FontSize" Value="28" />
<Setter Property="Margin" Value="42,0,0,0" />
</Style>
All styles are used in UserControl created in Shared project.
I do this to override FontSize on diffrent platforms.
I merged all dictionaries in App.xaml
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Styles/SharedResources.xaml" />
<ResourceDictionary Source="Styles/StyleResources.xaml" />
</ResourceDictionary.MergedDictionaries>
But my app does not start with Unhandled exception
Cannot find a Resource with the Name/Key CommonLayerListItemStyle [Line: 10 Position: 37]
Why does this happens?
I had the same issue. You need to merge the SharedResources.xaml directly into StyleResources.xaml, and only reference StyleResources.xaml from App.xaml.
Here is a complete example:
http://blog.craftingbytes.com/2015/05/resource-sharing-in-windows-universal.html
I want use a external file to customize styles on my app, but it does not working. I am following this step-by-step but when I execute the project exception falls into:
A first chance exception of type 'System.Windows.Markup.XamlParseException' occurred in System.Windows.ni.dll
My XAML code:
app.xaml:
<Application.Resources>
<local:LocalizedStrings xmlns:local="clr-namespace:App1" x:Key="LocalizedStrings"/>
<ResourceDictionary x:Key="myDict">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Resources.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Resources.xaml:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style TargetType="TextBox" x:Key="MyTextBox">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0.5"/>
<Setter Property="BorderBrush" Value="Gray"/>
<Setter Property="Opacity" Value="0.5"/>
<Setter Property="Foreground" Value="Red"/>
</Style>
</ResourceDictionary>
Try moving your local resource declarations inside the ResourceDictionary that you're creating and assigning to the Application.Resources property:
<Application.Resources>
<ResourceDictionary x:Key="myDict">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Resources.xaml"/>
</ResourceDictionary.MergedDictionaries>
<local:LocalizedStrings xmlns:local="clr-namespace:App1" x:Key="LocalizedStrings"/>
<!-- other resources in here -->
</ResourceDictionary>
</Application.Resources>