Why .NET-Maui Global Styles are not working?
Asked Answered
A

3

6

I have declared global styles in .Net Maui and trying to access it from one of the pages but it's throwing exceptions

Microsoft.Maui.Controls.Xaml.XamlParseException: Position 10:37. Type converter failed: Exception has been thrown by the target of an invocation. Microsoft.Maui.Controls.Xaml.XamlParseException: Position 8:34. StaticResource not found for key Primary.

App.xaml code

<?xml version = "1.0" encoding = "UTF-8" ?>
<Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:MyApp"
         x:Class="MyApp.App">
<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Resources/Styles/Colors.xaml" />
            <ResourceDictionary Source="Resources/Styles/Styles.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
    <Style x:Key="redLabelStyle"
           TargetType="Label">
        <Setter Property="TextColor"
                    Value="Red"/>
        <Setter Property="FontSize"
                    Value="Small"/>
        <Setter Property="FontAttributes"
                    Value="Bold"/>
    </Style>

    <Style TargetType="Label">
        <Setter Property="TextColor"
                    Value="Green"/>
        <Setter Property="FontSize"
                    Value="Small"/>
        <Setter Property="FontAttributes"
                    Value="Bold"/>
    </Style>
</Application.Resources>

MainPage.xaml code

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         NavigationPage.HasNavigationBar="False"
         x:Class="MyApp.MainPage">

<VerticalStackLayout HorizontalOptions="CenterAndExpand"
                     VerticalOptions="CenterAndExpand">
    <Label Style="{StaticResource redLabelStyle}"
           Text="Global Style Red Label"/>
    <Label Text="GLobal Style Green Label"/>
    <Label Text="GLobal Style Green Label"/>

</VerticalStackLayout>

</ContentPage>

Note: This is the default app created by .Net Maui.

Apprehensible answered 21/8, 2022 at 5:19 Comment(0)
I
6

This is the wrong place i think </ResourceDictionary>

Try this :

 <Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Resources/Styles/Colors.xaml" />
            <ResourceDictionary Source="Resources/Styles/Styles.xaml" />
        </ResourceDictionary.MergedDictionaries> 
    <Style x:Key="redLabelStyle"
           TargetType="Label">
        <Setter Property="TextColor"
                    Value="Red"/>
        <Setter Property="FontSize"
                    Value="Small"/>
        <Setter Property="FontAttributes"
                    Value="Bold"/>
    </Style>
    <Style TargetType="Label">
        <Setter Property="TextColor"
                    Value="Green"/>
        <Setter Property="FontSize"
                    Value="Small"/>
        <Setter Property="FontAttributes"
                    Value="Bold"/>
    </Style>
  </ResourceDictionary>
</Application.Resources>

Also give the second style a name. <Style TargetType="Label"> a name in x:Key=""

Like

x:Key="greenLabelStyle"
Improvement answered 21/8, 2022 at 6:27 Comment(1)
Great, Thanks it worked out for me. I had to put styles under ResourceDictionary rest everything worked. I had followed official .Net Maui docs & they also have not put the styles inside ResourceDictionary.Apprehensible
S
2

You can also add global styles to the Styles.xaml file referenced in your MergedDictionaries

Please note the location of file

<ResourceDictionary Source="Resources/Styles/Styles.xaml" />

You can copy your styles directly into there instead, allowing you to keep all of your global styles in one central place. This helps keep your App.xaml nice and tidy.

Shirl answered 14/9, 2022 at 15:32 Comment(0)
B
0

one of your style key is missing not defined in Color file and your are using here this cause exception , recheck it.

Boong answered 13/3 at 4:27 Comment(1)
As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.Naranjo

© 2022 - 2024 — McMap. All rights reserved.