Set style by boolean property

Question

At my ViewModel I have a proberty:

[ObservableProperty]
private bool _isOnline;

At my xaml I wish to set a different Style using StaticResource by the property IsOnline. Here my pseudo code:

<custom:MySfTabItem x:Name="SearchTabItem" 
                      Header="{x:Static localization:AppResources.Search}"
                      ImageSource="search_light.png"
                      IsEnabled="{Binding IsOnline}">
    <custom:MySfTabItem.Style>
        <Style.Triggers>
            <DataTrigger Binding="{Binding IsOnline}" Value="True">
                <Setter Property="{StaticResource}" Value="NavigationTabViewItemsOnline"/>
            </DataTrigger>
            <DataTrigger Binding="{Binding IsOnline}" Value="False">
                <Setter Property="{StaticResource}" Value="NavigationTabViewItemsOffline"/>
            </DataTrigger>
        </Style.Triggers>
    </custom:MySfTabItem.Style>
</custom:MySfTabItem>

Currently working is this, but here is no switch for IsOnline:

<custom:MySfTabItem x:Name="SearchTabItem" 
                      Header="{x:Static localization:AppResources.Search}"
                      ImageSource="search_light.png"
                      IsEnabled="{Binding IsOnline}"
                      Style="{StaticResource NavigationTabViewItems}"/>

How can I set a switch by property IsOnline in XAML to set different styles (StaticResources)?

Answer 1

I don't know the code of MySfTabItem .

But as a test, I try to set the style of an Entry according to a property IsOnline.

I added a style in ContentPage.Resources and added two DataTriggers which is bind to property IsOnline,just as follows:

    <ContentPage.Resources>
        <ResourceDictionary>
            <Style  x:Key="mystyle" TargetType="Entry"  >
                <Style.Triggers>
                    <DataTrigger  TargetType="Entry" Binding="{Binding IsOnline}" Value="True">
                        <Setter Property="FontAttributes" Value="Italic" />
                        <Setter Property="PlaceholderColor" Value="Blue" />
                    </DataTrigger>

                    <DataTrigger  TargetType="Entry" Binding="{Binding IsOnline}" Value="False">
                        <Setter Property="FontAttributes" Value="None" />
                        <Setter Property="PlaceholderColor" Value="Green" />

                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>

You can refer to the following 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"
             xmlns:local="clr-namespace:MauiDataTriggerApp921"
             x:Class="MauiDataTriggerApp921.MainPage">

    <ContentPage.BindingContext>
        <local:MyViewModel></local:MyViewModel>
    </ContentPage.BindingContext>

    <ContentPage.Resources>
        <ResourceDictionary>
            <Style  x:Key="mystyle" TargetType="Entry"  >
                <Style.Triggers>
                    <DataTrigger  TargetType="Entry" Binding="{Binding IsOnline}" Value="True">
                        <Setter Property="FontAttributes" Value="Italic" />
                        <Setter Property="PlaceholderColor" Value="Blue" />
                    </DataTrigger>

                    <DataTrigger  TargetType="Entry" Binding="{Binding IsOnline}" Value="False">
                        <Setter Property="FontAttributes" Value="None" />
                        <Setter Property="PlaceholderColor" Value="Green" />

                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">

            <Entry  Placeholder="test..." IsEnabled="{Binding IsOnline}"  Style="{DynamicResource mystyle}"></Entry>
            

            <Button   Text="reset IsOnline" Command="{Binding SetValueCommand}"/>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

MyViewModel.cs

public partial class MyViewModel: ObservableObject 
{
    [ObservableProperty]
    private  bool _isOnline;

    [RelayCommand]
    private void SetValue()
    {
        IsOnline = !IsOnline;
    }
}