I have the next XAML:
<ContentPage ...>
<ContentPage.Resources>
<ResourceDictionary>
<Style x:Key="visualStyle" TargetType="VisualElement">
<Setter Property="BackgroundColor" Value="Red" />
</Style>
<Style x:Key="baseStyle" TargetType="View" BasedOn="{StaticResource visualStyle}">
...
</Style>
<Style x:Key="labelStyle" TargetType="Label" BasedOn="{StaticResource baseStyle}">
<Setter Property="TextColor" Value="Black" />
</Style>
</ResourceDictionary>
</ContentPage.Resources>
<ContentPage.Style>
<StaticResourceExtension Key="visualStyle" />
</ContentPage.Style>
...
</ContentPage>
When I try to set Style for entire ContentPage using visualStyle StaticResourceExtension I get the next annoing popup in Visual Studio:
Why is this happening and how to remove it? XAML is correct and is successfully parsed in runtime.
That's a very unusual syntax to be using. Markup extensions are almost always instantiated using moustache bracket syntax, so it doesn't surprise me that the Intellisense is getting confused.
I see why you are doing this though - you want to reference a resource that is defined within the Resources of the referencing element. But XAML wants to be able to parse that resource before encountering the reference.
There are a few options...
You could move the visualStyle resource to App.xaml and reference it from your page using normal attribute plus moustache bracket syntax.
You could reference it via DynamicResource instead, which should allow it to resolve properly. But this seems a little heavy-handed.
However, my preferred solution is the first one since this is likely an application-wide thematic style.
I see this part of your code, and wonder (since I'm too starting to learn Xamarin) couldn't it be that the StaticResourceExtension key attribute, must be used with the suffix x:?
<ContentPage.Style>
<StaticResourceExtension x:Key="visualStyle" />
<!-- INSTEAD OF <StaticResourceExtension Key="visualStyle" />-->
</ContentPage.Style>
I just came across this exception and found that the problem was that I was using the attributes the wrong way, so maybe that exception is Xamarin's way to tell us that we messed up on something, without saying explicitly on what.
Related
I have a Style with target type Grid. I want all Entry child elements within a grid of this style to automatically acquire a particular style.
I've had a look at these:
Styling nested elements in WPF
Apply Style to all child-elements of specific type
The only solution appears to be setting Resources within the parent Style, so this is what I've done:
<Style x:Key="BuggyGrid" TargetType="Grid">
<!-- bunch of property setters -->
<Style.Resources>
<Style TargetType="Entry">
<Setter Property="FontFamily" Value="Arial" />
</Style>
</Style.Resources>
</Style>
However, I get a build error:
"No property, bindable property, or event found for 'Resources'".
Why do I get this error?
I'm using Xamarin.Forms 2.3.2.
The links you have referenced are specific to WPF XAML and do not apply to Xamarin.Forms XAML.
I'm not sure how you would achieve nested styles in Xamarin.Forms.
The only possibility is XamlCSS which I haven't personally used.
https://www.nuget.org/packages/XamlCSS.xamarinforms/2.0.0-pre1
I have a custom font in my assets folder and need to assign this font as the global font for the app. This is what I thought of but it's not working.
<FontFamily x:Key="MetricWebRegular">
ms-appx:///Assets/Fonts/MetricWeb-Regular.ttf#Metric Web
</FontFamily>
I'm calling this by adding it to a style setter in a textbox.
This is what I thought of but it's not working.
It's hard to know what is going wrong here, just base on your code, it should work. Firstly, I don't have your font resource, I downloaded one from Internet and tested like this:
<Application.Resources>
<FontFamily x:Key="MetricWebRegular">ms-appx:///Assets/Blambot-Custom.ttf#Blambot Custom</FontFamily>
</Application.Resources>
then use this resource in the style setter in a textbox:
<Page.Resources>
<Style x:Key="TextBoxStyle" TargetType="TextBox">
...
<Setter Property="FontFamily" Value="{StaticResource MetricWebRegular}" />
...
</Setter>
</Style>
</Page.Resources>
And my TextBox:
<TextBox Text="Hello 11111222333" FontSize="30" Style="{StaticResource TextBoxStyle}" />
It works perfectly:
Here is my font download Uri. I downloaded it and changed its name here so it will meet the format as yours.
So,
Make sure your font file has no problem.
ms-appx:///Assets/Fonts/MetricWeb-Regular.ttf#Metric Web this path means your font file is under the Fonts folder of the Assets folder, make sure the path is right.
If you want to use this resource, you need to use StaticResource and its key.
If you want to override the default font family, you can override the ContentControlThemeFontFamily resource like this:
<FontFamily x:Key="ContentControlThemeFontFamily">ms-appx:///Assets/Blambot-Custom.ttf#Blambot Custom</FontFamily>, the result of my layout is here:
If there is still problem, you can leave a comment to post the download url of your font file resource, so can we download it and have a test.
The official Microsoft article states:
Modify the default system styles
You should use the styles that come from the Windows Runtime default XAML resources when you can. When you have to define your own styles, try to base your styles on the default ones when possible (using based-on styles as explained earlier, or start by editing a copy of the original default style).
I understand that you can copy and paste the default style from MSDN in order to "start by editing a copy of the original". However, that strikes me as very ugly and inelegant, as I'm pasting in almost a 100 lines even if I just want to add one thing.
I like the idea of "using based-on styles" to include all of the default style by reference, but from what I can tell the original default styles supplied by Microsoft are implicit. Given that they have no key to reference them by, how can BasedOn be used?
You are right about that BasedOn won't work with default styles as they are implicit.
However, you don't have to include the full style code if you simply want to edit some properties.
For example, the Button below will inherit everything from the default style except the Background color being changed to Red.
<Page.Resources>
<Style x:Key="RedButtonStyle"
TargetType="Button">
<Setter Property="Background"
Value="Red" />
</Style>
</Page.Resources>
<Grid>
<Button Content="Red" Style="{StaticResource RedButtonStyle}" />
</Grid>
I have tried to give conditional styling using converter in style.setter as below,
<Style TargetType="DataGrid">
<Setter Property="Background" Value="{Binding Converter={StaticResource cc}}" />
</Style>
and came to know that there is no support provided for using converter in UWP. So please anyone suggest me better way to provide conditional styling in UWP using converter in style.setter
No, we don't have Trigger support in UWP.
To keep the as much as light the triggers from UWP and Windows phone 8
are removed by msft. We could achieve those using Interactivity core. Blend(IDE) has great support to create trigger in these technologies.
Blend allows to define a behavior for the application Here.
We could define
DataTrigger Use the DataTrigger trigger to invoke an action based on the value of a data-bound property
EventTrigger Use the EventTrigger trigger to invoke an action based on an event such as a mouse click, a page loading, or another interaction.
KeyTrigger Use the KeyTrigger trigger to invoke an action when a combination of keys is pressed on the keyboard.
Note:- This are trigger available for windows phone,make sure UWP have this trigger in the blend SDK
A workaround is to use DataTriggerBehavior with a ChangePropertyAction to accomplish this.
xmlns:ec="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions" x:Class="XXX_XXXX"
This works for me
<DataGrid x:Name="MyGrid"
Stretch="None"
HorizontalAlignment="Stretch"
VerticalAlignment="Top">
<interactivity:Interaction.Triggers>
<ec:DataTrigger Binding="{Binding IsBackgroundBlue}" Value="True">
<ec:ChangePropertyAction TargetObject="{Binding ElementName=MyGrid}" PropertyName="Background" Value="Blue" />
</ec:DataTrigger>
<!-- You could add your conditions here /> -->
</interactivity:Interaction.Triggers>
</DataGrid>
Pls mind this may not be correct syntax i dont have IDE now
Similar answer in https://stackoverflow.com/a/31933556/1876572
Msdn reference of triggers using visual state manager
sometimes the VS/blend designer can't render the xaml because of some parsing error. but it compiles and run just fine. and i could just comment the problem tag/line and the xaml renders fine again. I know of the ignorable attribute but it ignores an attribute during compilation. I would like to have it the other way, to make the xaml designer ignore a tag during design-time but allowed to compiles it for run time. so, is there a way to indicate to the xaml designer to do this? i am using Visual Studio 2012 and Blend 2012
One way you can do this is to just mark a Setter for the d:IsHidden property (which yes does use the ignorable attribute) in the parent object.Resources. So something for example like (SL/WP/WinRT style example, may need edited for using x:Type and/or Style.Triggers if for WPF but the concept is the same.)
Added to namespaces if not already there by default;
mc:Ignorable="d"
and an example;
<Grid>
<Grid.Resources>
<Style TargetType="RadioButton"><!-- Could Substitute TargetType for a specific control
<Setter Property="d:IsHidden" Value="True"/>
</Style>
</Grid.Resources>
<RadioButton/><!-- This guy should now be hidden in Design Time -->
</Grid>
Hope this helps.