Zasoby appTheme

Za pomocą AppThemeObject funkcji i AppThemeColor można tworzyć zasoby obsługujące motywy dla aplikacji, które są automatycznie aktualizowane po aktualizacji motywu urządzenia.

Obiekty AppThemeObject i AppThemeColor są zasobami obsługującymi motywy, które ułatwią pracę z kolorami, obrazami i innymi zasobami, które muszą ulec zmianie w zależności od bieżącego motywu aplikacji. Te obiekty bazują na pojęciach AppThemeBinding dostępnych w programie .NET MAUI i ułatwią pracę z tymi typami zasobów w obiekcie ResourceDictionary.

W związku z tym zazwyczaj należy używać tych interfejsów API za pośrednictwem ThemeResource rozszerzenia znaczników w języku XAML.

Składnia

Dołączanie przestrzeni nazw XAML

Aby można było używać zestawu narzędzi w języku XAML, należy dodać następujące xmlns elementy do strony lub widoku:

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

W związku z tym następujące elementy:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

</ContentPage>

Zostanie zmodyfikowana tak, aby zawierała następujące xmlns elementy:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

</ContentPage>

AppThemeResource

Jest AppThemeObject to ogólny obiekt obsługujący motyw, który umożliwia ustawienie dowolnego object obiektu dla Lightwłaściwości i Dark Default . Ponieważ AppThemeObject nie jest silnie typizowane, w czasie wykonywania wartości dla każdej właściwości będą oceniane i rzutowane.

Ostrzeżenie

Jeśli rzutowanie jest nieprawidłowe, może to spowodować wyjątek środowiska uruchomieniowego.

W poniższym przykładzie pokazano, jak używać za AppThemeObject pomocą elementu ResourceDictionary:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <ContentPage.Resources>
        <toolkit:AppThemeObject Light="dark.png" Dark="light.png" x:Key="MyImageSource" />
    </ContentPage.Resources>

    <VerticalStackLayout>
        <Image Source="{toolkit:AppThemeResource MyImageSource}" />
    </VerticalStackLayout>
</ContentPage>

AppThemeColor

Element AppThemeColor jest wyspecjalizowanym elementem obsługującym Color motyw, który umożliwia ustawienie Color elementu dla Lightwłaściwości i Default Dark .

W poniższym przykładzie pokazano, jak używać za AppThemeColor pomocą elementu ResourceDictionary:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <ContentPage.Resources>
        <toolkit:AppThemeColor Light="Red" Dark="Green" x:Key="LabelTextColor" />
    </ContentPage.Resources>

    <VerticalStackLayout>
        <Label TextColor="{toolkit:AppThemeResource LabelTextColor}" />
    </VerticalStackLayout>
</ContentPage>

Korzystanie z elementu AppThemeColor i appThemeResource za pomocą stylów

Ponieważ możemy używać tych zasobów obsługujących motywy w obiekcie ResourceDictionary, oznacza to, że możemy je również wykorzystać za pośrednictwem elementu Style.

W poniższym przykładzie pokazano, jak używać za AppThemeColor pomocą elementu Style:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <ContentPage.Resources>
        <toolkit:AppThemeColor Light="Red" Dark="Green" x:Key="LabelTextColor" />

        <Style x:Key="Headline" TargetType="Label">
            <Setter Property="FontFamily" Value="Segoe UI" />
            <Setter Property="FontSize" Value="10" />
            <Setter Property="TextColor" Value="{toolkit:AppThemeResource LabelTextColor}" />
        </Style>
    </ContentPage.Resources>

    <VerticalStackLayout>
        <Label Style="{StaticResource Headline}" />
    </VerticalStackLayout>
</ContentPage>

Rozszerzalność

Zarówno AppThemeObject , jak i AppThemeColor dziedziczą z klasy AppThemeObject<T>abstrakcyjnej . Jeśli potrzebujesz silniejszego zasobu, który nie jest dostępny w zestawie narzędzi .NET MAUI Community Toolkit, możesz utworzyć własne dziedziczenie.

Właściwości

W poniższej tabeli opisano właściwości elementów AppThemeObject i AppThemeColor. W przypadku AppThemeColorparametrów typy każdej właściwości będą Color mieć wartość objectzamiast .

Właściwość	Type	Opis
Ciemny	object	Wartość, która jest stosowana do właściwości, do którego jest stosowany ten zasób, gdy aplikacja używa ciemnego motywu.
Wartość domyślna	object	Wartość, która jest stosowana do właściwości, do którego jest stosowany ten zasób, gdy aplikacja używa jasnego lub ciemnego motywu i nie ma wartości podanej dla odpowiedniej właściwości tego motywu.
Jasny	object	Wartość, która jest stosowana do właściwości, do którego jest stosowany ten zasób, gdy aplikacja używa motywu lekkiego.

Przykłady

Przykład działania AppThemeResource można znaleźć w przykładzie przykładowym zestawu narzędzi .NET MAUI Community Toolkit.

interfejs API

Kod źródłowy można AppThemeResource znaleźć w repozytorium GitHub zestawu narzędzi .NET MAUI Community Toolkit.