Udostępnij za pośrednictwem

Zwracanie wartości z wyskakującego okienka

Zestaw narzędzi .NET MAUI Community Toolkit umożliwia wyświetlanie wyskakujących okienek dla użytkownika. Zestaw narzędzi umożliwia również często występujący, bardziej złożony scenariusz, w którym deweloper wyświetla Popup oraz zwraca await wynik po zamknięciu Popup. Na tej stronie opisano, jak można użyć klasy Popup<T> w celu osiągnięcia żądanego zachowania.

Tworzenie okna podręcznego

Element Popup<T> można utworzyć w języku XAML lub C# w następujący sposób:

Tworzenie wyskakujących okienek w języku XAML

W poniższej sekcji opisano sposób tworzenia Popup<T> przy użyciu języka XAML.

Definiowanie okna podręcznego

Najprostszym sposobem utworzenia elementu Popup<T> jest dodanie nowego .NET MAUI ContentView (XAML) pliku do projektu. Spowoduje to utworzenie 2 plików; pliku *.xaml i pliku *.xaml.cs . Zawartość każdego pliku można zastąpić następującymi elementami:

Plik XAML
<toolkit:Popup
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:system="clr-namespace:System;assembly=mscorlib"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
    Padding="10"
    x:TypeArguments="system:Boolean"
    x:Class="MyProject.ReturnResultPopup">

    <VerticalStackLayout Spacing="6">
        <Label Text="This is a very important message! Do you agree?" />

        <Button Text="Yes" 
                Clicked="OnYesButtonClicked" />

        <Button Text="No"
                Clicked="OnNoButtonClicked" />
    
    </VerticalStackLayout>
    
</toolkit:Popup>

Użycie elementu x:TypeArguments w języku XAML umożliwia podanie parametru typu dla typu ogólnego.

Plik Code-Behind XAML
public partial class ReturnResultPopup : Popup<bool>
{
    public ReturnResultPopup()
    {
        InitializeComponent();
    }

    async void OnYesButtonClicked(object? sender, EventArgs e)
    {
        await CloseAsync(true);
    }
    
    async void OnNoButtonClicked(object? sender, EventArgs e)
    {
        await CloseAsync(false);
    }
}

Użycie Popup<bool> musi odpowiadać definicji w języku XAML poprzez użycie x:TypeArguments.

Ważne

Jeśli kod pliku nie zostanie utworzony wraz z wywołaniem metody , InitializeComponent podczas próby wyświetlenia elementu Popupzostanie zgłoszony wyjątek .

Tworzenie okna podręcznego w języku C#

W poniższej sekcji opisano sposób tworzenia obiektu Popup przy użyciu języka C#.

using CommunityToolkit.Maui.Views;

namespace MyProject;

public class ReturnResultPopup : Popup<bool>
{
    public ReturnResultPopup()
    {
        var yesButton = new Button { Text = "Yes" };
        yesButton.Clicked += OnYesButtonClicked;

        var noButton = new Button { Text = "No" };
        noButton.Clicked += OnNoButtonClicked;

        Content = new VerticalStackLayout
        {
            Children = 
            {
                new Label { Text = "This is a very important message! Do you agree?" },
                
                yesButton,
                noButton
            }
        };
    }

    async void OnYesButtonClicked(object? sender, EventArgs e)
    {
        await CloseAsync(true);
    }
    
    async void OnNoButtonClicked(object? sender, EventArgs e)
    {
        await CloseAsync(false);
    }
}

Metoda CloseAsync umożliwia dostarczenie wartości. Będzie to wynikowa wartość zwracana. Użycie typów ogólnych w Popup<T> zapewnia bezpieczeństwo typu podczas zwracania wartości z okna dialogowego.

Oczekiwanie na wynik z wyskakującego okienka

Aby oczekiwać na wynik, ShowPopupAsync należy użyć metody w następujący sposób:

using CommunityToolkit.Maui.Views;

public class MyPage : ContentPage
{
    public async Task DisplayPopup()
    {
        var popup = new ReturnResultPopup();

        // The type parameter must match the type returned from the popup.
        IPopupResult<bool> popupResult = await this.ShowPopupAsync<bool>(popup, PopupOptions.Empty, CancellationToken.None);

        if (popupResult.WasDismissedByTappingOutsideOfPopup)
        {
            return;
        }

        if (popupResult.Result is true)
        {
            // Yes was tapped
        }
        else
        {
            // No was tapped
        }
    }
}

Wyskakujące okienko z wynikiem

Uwaga / Notatka

Jeśli WasDismissedByTappingOutsideOfPopup właściwość ma trueResult wartość , zawsze będzie mieć null wartość lub default.

Opcje wyskakujących okienek

Klasa PopupOptions zapewnia możliwość dostosowywania obramowania, cienia, koloru nakładki strony i innych elementów wyświetlanego Popup.

Aby dowiedzieć się więcej, zapoznaj się z dokumentacją popupOptions .

Przykłady

Przykład tej funkcji można znaleźć w aplikacji przykładowej zestawu narzędzi .NET MAUI Community Toolkit.

API

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

Dodatkowe zasoby