Load XAML file dynamically

Question

Hello,

In my desktop application I have some themes and styles defined like this:

<?xml version="1.0" encoding="UTF-8" ?>
<ResourceDictionary
    x:Class="App.Themes.S"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:ext="clr-namespace:App.Extensions">
    <!--  Implicit Styles  -->
    <Style TargetType="Picker">
        <Setter Property="TitleColor" Value="Chocolate" />
    </Style>
    <Style TargetType="ActivityIndicator">
        <Setter Property="Color" Value="Chocolate" />
        <Setter Property="IsRunning" Value="True" />
        <Setter Property="VerticalOptions" Value="CenterAndExpand" />
    </Style>
</ResourceDictionary>

I have those xaml saved in a folder, but I don't want to be creating new installations for when I want to change the style depending on the client, how can I load those XAML dynamically?

That is, I would like to be able to download the XAML and load that file, is it possible? or can I download the XAML and copy it inside the Themes folder (which already exists in my project) and then load it using assembly reflection, what is the way to go?

Answer 1

Hello,

There is no API in MAUI to load XAML at runtime.

For dynamically loading and modifying control styles, the solution given by MAUI is dynamic styles.

Please refer to the following sample code that modifies a button at runtime using dynamic styles.

Step 1. Define styles in ResourceDictionary:

<Application.Resources>
    <ResourceDictionary>
        <Style x:Key="RedButtonStyle"
    TargetType="Button">
            <Setter Property="BackgroundColor" Value="Red" />
        </Style>
        <Style x:Key="GreenButtonStyle"
    TargetType="Button">
            <Setter Property="BackgroundColor" Value="Green" />
        </Style>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Resources/Styles/Colors.xaml" />
            <ResourceDictionary Source="Resources/Styles/Styles.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

Step 2. Use dynamic styles in controls:

<Button Text="test" Style="{DynamicResource RedButtonStyle}" Clicked="Button_Clicked"></Button>

Step 3. Modify styles dynamically:

private void Button_Clicked(object sender, EventArgs e)
{
    var btn = sender as Microsoft.Maui.Controls.Button;
    if (btn != null)
    {
        App.Current.Resources["RedButtonStyle"] = App.Current.Resources["GreenButtonStyle"];
    }
}

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.