.NET MAUI shared styles library does not work

Question

I have created a MAUI dictionary library (MauiLib1) which I wanna put some styles inside in order to reuse them inside different apps. I have also created a MAUI test app (TestApp3) and I have referenced the MauiLib1 inside this test app but I get this error:

enter image description here

This is my project structure:

enter image description here

Inside AppHostBuilderExtensions.cs I have:

using Microsoft.Extensions.DependencyInjection.Extensions;
using Microsoft.Maui.Controls;

namespace MauiLib1;

public static class AppHostBuilderExtensions
{
    public static MauiAppBuilder UseMauiLib1(this MauiAppBuilder builder)
    {
        builder.Services.AddSingleton<Dictionary1>();
        builder.Services.AddSingleton<Dictionary2>();

        return builder;
    }
}

And in order to use the dictionary of styles inside my test app I have.

Inside MauiProgram.cs:

using Microsoft.Extensions.Logging;
using MauiLib1;
using Microsoft.Extensions.DependencyInjection.Extensions;

namespace TestApp3
{
    public static class MauiProgram
    {
        public static MauiApp CreateMauiApp()
        {
            var builder = MauiApp.CreateBuilder();
            builder
                .UseMauiApp<App>()
                .UseMauiLib1()
                .ConfigureFonts(fonts =>
                {
                    fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                    fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                });

#if DEBUG
            builder.Logging.AddDebug();

#endif

            return builder.Build();
        }
    }
}

This is my App.xaml:

<?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:TestApp3"
             xmlns:m="clr-namespace:MauiLib1;assembly=MauiLib1"
             x:Class="TestApp3.App">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                
                <ResourceDictionary Source="Resources/Styles/Colors.xaml" />
                <ResourceDictionary Source="Resources/Styles/Styles.xaml" />
                
                <m:Dictionary1/>
                <m:Dictionary2/>
                
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

So, in short the <m:Dictionary1/> and <m:Dictionary2/> should load styles inside my app but it does not work, where is the problem?

Thanks

Answer 1

So, in short the <m:Dictionary1/> and <m:Dictionary2/> should load styles inside my app but it does not work, where is the problem?

I create a demo and it works well. You can refer to the detailed steps below:

1. Create a MAUI App and then under the solution add a new .NET MAUI Class Library. In MAUI project, Right click on Dependencies--> Add Project reference --> Tick the option for the MauiLib1. This is a key step!

2. Add a ResourceDictionary file: Dictionary1.xmal in the MauiLib1 project and then create a static AppHostBuilderExtensions class which will accommodate your own custom MauiAppBuilder. So you can include all mandatory nuget dependencies used by the .Net MAUI Class Library:

AppHostBuilderExtensions.cs:

namespace MauiLib1
{
    public static class AppHostBuilderExtensions
    {
        public static MauiAppBuilder UseMauiLib1(this MauiAppBuilder builder)
        {

            builder.Services.AddSingleton<Dictionary1>();

            return builder;
        }
    }
}

Dictionary1.xmal:

<?xml version="1.0" encoding="utf-8" ?>
<ResourceDictionary xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MauiLib1.Dictionary1">

    <Color x:Key="MyRedButton">#FF0000</Color>
   
</ResourceDictionary>

3. Add the builder: UseMauiLib1() inside CreateMauiApp() in MauiProgram.cs:

using Microsoft.Extensions.Logging;
using MauiLib1;

namespace TestApp3
{
    public static class MauiProgram
    {
        public static MauiApp CreateMauiApp()
        {
            var builder = MauiApp.CreateBuilder();
            builder
                .UseMauiApp<App>()
                .UseMauiLib1()
                .ConfigureFonts(fonts =>
                {
                    fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                    fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                });

#if DEBUG
            builder.Logging.AddDebug();
#endif
            return builder.Build();
        }
    }
}

4. App.xaml:

<?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:TestApp3"
             xmlns:m="clr-namespace:MauiLib1;assembly=MauiLib1"
             x:Class="TestApp3.App">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>

                <m:Dictionary1/>
                <ResourceDictionary Source="Resources/Styles/Colors.xaml" />
                <ResourceDictionary Source="Resources/Styles/Styles.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

5. Finally, you can reuse the style(I made a simple color style but you can customize your own) defined in Dictionary1.xmal like below:

<Button
     x:Name="CounterBtn"
      Text="Click me"

      BackgroundColor="{StaticResource MyRedButton}"/>

Output: