Rozšíření

Ovládací Expander prvek poskytuje rozšiřitelný kontejner pro hostování libovolného obsahu. Ovládací prvek má dvě hlavní vlastnosti pro uložení obsahu:

Hlavička

Tuto Header vlastnost lze poskytnout s libovolným zobrazením, které umožňuje úplné přizpůsobení. Bude Header vždy vidět a interakce s ním (kliknutím nebo klepnutím) se zobrazí nebo sbalí Content.

Poznámka:

Nedoporučuje se umístit ovládací prvky do záhlaví, které umožňují interakci uživatele.

Content

Toto je hlavní obsah, který se zobrazí při Header interakci s vlastností (kliknutí nebo klepnutí) nebo úpravu IsExpanded vlastnosti.

Poznámka:

Expander není podporován v ListView systému iOS/MacCatalyst a vyvolává výjimku NotSupportedException. Lze jej však nahradit vlastní implementací nastavením public Action<TappedEventArgs>? HandleHeaderTapped { get; set; }. Tato akce se spustí při každém klepnutí na záhlaví. Věnujte pozornost tím, že změníte tuto akci, můžete obdržet jiné chování na CollectionView všech platformách a ListView na všech platformách.

Základní použití

Následující příklady ukazují, jak použít Expander zobrazení nastavením Header vlastnosti na Label ovládací prvek a Content být HorizontalStackLayout s a ImageLabel uvnitř.

XAML

Zahrnutí oboru názvů XAML

Pokud chcete použít sadu nástrojů v XAML, musíte do stránky nebo zobrazení přidat následující xmlns položky:

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

Proto platí následující:

<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>

Bylo by změněno tak, aby zahrnovalo xmlns následující:

<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>

Použití expanderu

Následující příklad ukazuje, jak přidat Expander zobrazení v XAML.

<toolkit:Expander>
    <toolkit:Expander.Header>
        <Label Text="Baboon"
               FontAttributes="Bold"
               FontSize="Medium" />
    </toolkit:Expander.Header>
    <HorizontalStackLayout Padding="10">
        <Image Source="http://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Papio_anubis_%28Serengeti%2C_2009%29.jpg/200px-Papio_anubis_%28Serengeti%2C_2009%29.jpg"
               Aspect="AspectFill"
               HeightRequest="120"
               WidthRequest="120" />
        <Label Text="Baboons are African and Arabian Old World monkeys belonging to the genus Papio, part of the subfamily Cercopithecinae."
               FontAttributes="Italic" />
    </HorizontalStackLayout>
</toolkit:Expander>

C#

Následující příklad ukazuje, jak přidat Expander zobrazení v jazyce C#.

using CommunityToolkit.Maui.Views;

var expander = new Expander
{
    Header = new Label
    {
        Text = "Baboon",
        FontAttributes = FontAttributes.Bold,
        FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label))
    }
};

expander.Content = new HorizontalStackLayout
{
    Padding = new Thickness(10),

    Children =
    {
        new Image
        {
            Source = "http://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Papio_anubis_%28Serengeti%2C_2009%29.jpg/200px-Papio_anubis_%28Serengeti%2C_2009%29.jpg",
            Aspect = Aspect.AspectFill,
            HeightRequest = 120,
            WidthRequest = 120
        },

        new Label
        {
            Text = "Baboons are African and Arabian Old World monkeys belonging to the genus Papio, part of the subfamily Cercopithecinae.",
            FontAttributes = FontAttributes.Italic
        }
    }
};

Revize jazyka C#

using CommunityToolkit.Maui.Views;

Content = new Expander
{
    Header = new Label()
        .Text("Baboon")
        .Font(bold: true, size: 18),

    Content = new HorizontalStackLayout
    {
        new Image()
            .Source("http://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Papio_anubis_%28Serengeti%2C_2009%29.jpg/200px-Papio_anubis_%28Serengeti%2C_2009%29.jpg")
            .Size(120)
            .Aspect(Aspect.AspectFill),

        new Label()
            .Text("Baboons are African and Arabian Old World monkeys belonging to the genus Papio, part of the subfamily Cercopithecinae.")
            .Font(italic: true)

    }.Padding(10)

}.CenterHorizontal();

Vlastnosti

Vlastnost	Type	Popis
Command	ICommand	Spustí se při klepnutí na Expander záhlaví.
CommandParameter	object	Parametr, který je předán .Command
Direction	ExpandDirection	Definuje směr rozbalovače.
Content	IView?	Definuje obsah, který se má zobrazit při Expander rozbalení.
Header	IView?	Definuje obsah záhlaví.
IsExpanded	bool	Určuje, zda Expander je rozbalený. Tato vlastnost používá režim vazby TwoWay a má výchozí hodnotu false.

Výčet ExpandDirection definuje následující členy:

Hodnota	Popis
Down	Označuje, že Expander obsah je pod záhlavím.
Up	Označuje, že Expander obsah je nad záhlavím.

Ovládací Expander prvek také definuje ExpandedChanged událost, která se aktivuje při klepnutí na Expander záhlaví.

ExpandedChangedEventArgs

Argument události, který obsahuje ExpanderIsExpanded stav.

Vlastnosti

Vlastnost	Type	Popis
Isexpanded	bool	Určuje, zda Expander je rozbalený.

Příklady

Příklad této funkce najdete v ukázkové aplikaci .NET MAUI Community Toolkit.

rozhraní API

Zdrojový kód Expander najdete v úložišti .NET MAUI Community Toolkit na GitHubu.