Pasek przekąskowy

2024-07-16

Jest Snackbar to alert o czasie wyświetlany domyślnie w dolnej części ekranu. Jest on odrzucany po konfigurowalnym czasie. Snackbar program jest w pełni dostosowywalny i może być zakotwiczony do dowolnego IView.

Informuje Snackbar użytkowników o procesie, który aplikacja wykonała lub wykona. Jest on wyświetlany tymczasowo w dolnej części ekranu.

Inicjowanie specyficzne dla platformy

Aby uzyskać dostęp do Snackbar funkcji, wymagana jest następująca konfiguracja specyficzna dla platformy.

Nie jest wymagana żadna konfiguracja.

W przypadku korzystania z Snackbar niego niezbędne jest wykonanie następujących dwóch kroków:

1. Włącz użycie paska przekąskowego za pomocą programu MauiAppBuilder

W przypadku korzystania z UseMauiCommunityToolkit parametru options w celu włączenia użycia paska przekąskowego w systemie Windows w następujący sposób:

var builder = MauiApp.CreateBuilder()
  .UseMauiCommunityToolkit(options =>
  {
    options.SetShouldEnableSnackbarOnWindows(true);
  })

Powyższe polecenie spowoduje automatyczne zarejestrowanie wymaganych procedur obsługi przez skonfigurowanie zdarzeń cyklu życia (OnLaunched i OnClosed).

2. Uwzględnij rejestracje ToastNotification w pliku Package.appxmanifest

Aby obsłużyć akcje paska przekąskowego, należy zmodyfikować Platform\Windows\Package.appxmanifest plik w następujący sposób:

W pliku Package.appxmanifest w tagu otwierającym <Package> dodaj następujące przestrzenie nazw XML:

xmlns:com="http://schemas.microsoft.com/appx/manifest/com/windows10"
xmlns:desktop="http://schemas.microsoft.com/appx/manifest/desktop/windows10"

W pliku Package.appxmanifest, również w tagu otwierającym<Package>, zaktualizuj IgnorableNamespaces element w celu uwzględnienia com uap rescap i desktop:

IgnorableNamespaces="uap rescap com desktop"

Przykład: ukończony `<Package>` tag

Oto przykład ukończonego tagu otwierania <Package> , który dodał obsługę elementu Snackbar:

<Package
     xmlns="http://schemas.microsoft.com/appx/manifest/foundation/windows10"
     xmlns:uap="http://schemas.microsoft.com/appx/manifest/uap/windows10"
     xmlns:rescap="http://schemas.microsoft.com/appx/manifest/foundation/windows10/restrictedcapabilities"
     xmlns:com="http://schemas.microsoft.com/appx/manifest/com/windows10"
     xmlns:desktop="http://schemas.microsoft.com/appx/manifest/desktop/windows10"
     IgnorableNamespaces="uap rescap com desktop">

W pliku Package.appxmanifest wewnątrz każdego <Application> tagu dodaj następujące rozszerzenia:

<Extensions>

   <!-- Specify which CLSID to activate when notification is clicked -->
   <desktop:Extension Category="windows.toastNotificationActivation">
       <desktop:ToastNotificationActivation ToastActivatorCLSID="6e919706-2634-4d97-a93c-2213b2acc334" />
   </desktop:Extension>

   <!-- Register COM CLSID -->
   <com:Extension Category="windows.comServer">
       <com:ComServer>
           <com:ExeServer Executable="YOUR-PATH-TO-EXECUTABLE" DisplayName="$targetnametoken$" Arguments="----AppNotificationActivated:"> <!-- Example path to executable: CommunityToolkit.Maui.Sample\CommunityToolkit.Maui.Sample.exe -->
               <com:Class Id="6e919706-2634-4d97-a93c-2213b2acc334" />
           </com:ExeServer>
       </com:ComServer>
   </com:Extension>

</Extensions>

Przykład: ukończony `<Applications>` tag

Oto przykład ukończonego <Applications> tagu, który teraz dodał obsługę elementu Snackbar:

<Applications>
  <Application Id="App" Executable="$targetnametoken$.exe" EntryPoint="$targetentrypoint$">
      <uap:VisualElements
          DisplayName="$placeholder$"
          Description="$placeholder$"
          Square150x150Logo="$placeholder$.png"
          Square44x44Logo="$placeholder$.png"
          BackgroundColor="transparent">
           <uap:DefaultTile Square71x71Logo="$placeholder$.png" Wide310x150Logo="$placeholder$.png" Square310x310Logo="$placeholder$.png" />
           <uap:SplashScreen Image="$placeholder$.png" />
       </uap:VisualElements>
       <Extensions>

         <desktop:Extension Category="windows.toastNotificationActivation">
             <desktop:ToastNotificationActivation ToastActivatorCLSID="6e919706-2634-4d97-a93c-2213b2acc334" />
         </desktop:Extension>

         <com:Extension Category="windows.comServer">
             <com:ComServer>
                 <com:ExeServer Executable="YOUR-PATH-TO-EXECUTABLE" DisplayName="$targetnametoken$" Arguments="----AppNotificationActivated:"> <!-- Example path to executable: CommunityToolkit.Maui.Sample\CommunityToolkit.Maui.Sample.exe -->
                     <com:Class Id="6e919706-2634-4d97-a93c-2213b2acc334" />
                  </com:ExeServer>
              </com:ComServer>
          </com:Extension>

       </Extensions>
   </Application>
</Applications>

Przykład: zaktualizowany `Package.appxmanifest` plik do obsługi `Snackbar`

Poniżej znajduje się przykładowy Package.appxmanifest plik, który został zaktualizowany do obsługi Snackbar w systemie Windows:

<?xml version="1.0" encoding="utf-8"?>
<Package
    xmlns="http://schemas.microsoft.com/appx/manifest/foundation/windows10"
    xmlns:uap="http://schemas.microsoft.com/appx/manifest/uap/windows10"
    xmlns:rescap="http://schemas.microsoft.com/appx/manifest/foundation/windows10/restrictedcapabilities"
    xmlns:com="http://schemas.microsoft.com/appx/manifest/com/windows10"
    xmlns:desktop="http://schemas.microsoft.com/appx/manifest/desktop/windows10"
    IgnorableNamespaces="uap rescap com desktop">

    <Identity Name="maui-package-name-placeholder" Publisher="CN=Microsoft" Version="0.0.0.0" />

    <Properties>
        <DisplayName>$placeholder$</DisplayName>
        <PublisherDisplayName>Microsoft</PublisherDisplayName>
        <Logo>$placeholder$.png</Logo>
    </Properties>

    <Dependencies>
        <TargetDeviceFamily Name="Windows.Universal" MinVersion="10.0.17763.0" MaxVersionTested="10.0.19041.0" />
        <TargetDeviceFamily Name="Windows.Desktop" MinVersion="10.0.17763.0" MaxVersionTested="10.0.19041.0" />
    </Dependencies>

    <Resources>
        <Resource Language="x-generate" />
    </Resources>

    <Applications>
        <Application Id="App" Executable="$targetnametoken$.exe" EntryPoint="$targetentrypoint$">
            <uap:VisualElements
                DisplayName="$placeholder$"
                Description="$placeholder$"
                Square150x150Logo="$placeholder$.png"
                Square44x44Logo="$placeholder$.png"
                BackgroundColor="transparent">
                <uap:DefaultTile Square71x71Logo="$placeholder$.png" Wide310x150Logo="$placeholder$.png" Square310x310Logo="$placeholder$.png" />
                <uap:SplashScreen Image="$placeholder$.png" />
            </uap:VisualElements>
            <Extensions>

               <desktop:Extension Category="windows.toastNotificationActivation">
                   <desktop:ToastNotificationActivation ToastActivatorCLSID="6e919706-2634-4d97-a93c-2213b2acc334" />
               </desktop:Extension>

               <com:Extension Category="windows.comServer">
                   <com:ComServer>
                       <com:ExeServer Executable="YOUR-PATH-TO-EXECUTABLE" DisplayName="$targetnametoken$" Arguments="----AppNotificationActivated:"> <!-- Example path to executable: CommunityToolkit.Maui.Sample\CommunityToolkit.Maui.Sample.exe -->
                           <com:Class Id="6e919706-2634-4d97-a93c-2213b2acc334" />
                        </com:ExeServer>
                    </com:ComServer>
                </com:Extension>

            </Extensions>
        </Application>
    </Applications>

    <Capabilities>
        <rescap:Capability Name="runFullTrust" />
    </Capabilities>

</Package>

Aby uzyskać więcej informacji na temat obsługi aktywacji: Wysyłanie powiadomienia wyskakujące lokalnego z aplikacji języka C#

Składnia

Element Snackbar jest wywoływany przy użyciu języka C#.

C#

Aby go wyświetlić Snackbar , należy go utworzyć przy użyciu metody Makestatycznej :

using CommunityToolkit.Maui.Alerts;

CancellationTokenSource cancellationTokenSource = new CancellationTokenSource();

var snackbarOptions = new SnackbarOptions
{
    BackgroundColor = Colors.Red,
    TextColor = Colors.Green,
    ActionButtonTextColor = Colors.Yellow,
    CornerRadius = new CornerRadius(10),
    Font = Font.SystemFontOfSize(14),
    ActionButtonFont = Font.SystemFontOfSize(14),
    CharacterSpacing = 0.5
};

string text = "This is a Snackbar";
string actionButtonText = "Click Here to Dismiss";
Action action = async () => await DisplayAlert("Snackbar ActionButton Tapped", "The user has tapped the Snackbar ActionButton", "OK");
TimeSpan duration = TimeSpan.FromSeconds(3);

var snackbar = Snackbar.Make(text, action, actionButtonText, duration, snackbarOptions);

await snackbar.Show(cancellationTokenSource.Token);

Podczas wywoływania Snackbar.Make()parametru string text parametr jest wymagany. Wszystkie inne parametry są opcjonalne.

Poniższy zrzut ekranu przedstawia wynikowy pasek przekąskowy:

Android
iOS

Zrzut ekranu przedstawiający pasek przekąskowy w systemie Android

Istnieje również metoda rozszerzenia, która zakotwiczy element do Snackbar dowolnego VisualElementelementu :

await MyVisualElement.DisplaySnackbar("Snackbar is awesome. It is anchored to MyVisualElement");

Ostrzeżenie

Snackbar w systemie Windows nie można zakotwiczyć VisualElement i jest zawsze wyświetlany jako domyślne powiadomienie systemu Windows.

SnackBar zawiera dwa zdarzenia:

public static event EventHandler Shown
public static event EventHandler Dismissed

Zawiera również właściwość public static bool IsShown { get; }.

Snackbar.Shown += (s, e) => { Console.WriteLine(Snackbar.IsShown); };
Snackbar.Dismissed += (s, e) => { Console.WriteLine(Snackbar.IsShown); };

Właściwości

Właściwości	Type	Opis
Tekst	`string`	Wiadomość SMS. Wymagane
Akcja	`Action`	Akcja wywoływana po kliknięciu przycisku akcji.
ActionButtonText	`string`	Tekst przycisku akcji.
Kotwica	`IView`	`Snackbar` kotwica. `Snackbar` pojawi się w pobliżu tego widoku. Gdy `null`element `Snackbar` pojawi się w dolnej części ekranu.
Czas trwania	`TimeSpan`	`Snackbar` czas trwania.
VisualOptions	`SnackbarOptions`	`Snackbar` opcje wizualizacji.

SnackbarOptions

Ustawienie SnackbarOptions umożliwia dostosowanie stylu domyślnego Snackbar .

Właściwości

Właściwości	Type	Opis	Domyślna wartość
ZnakSpacing	`double`	Odstępy między znakami wiadomości.	`0.0d`
Czcionka	`Font`	Czcionka wiadomości.	`Font.SystemFontOfSize(14)`
TextColor	`Color`	Kolor tekstu wiadomości.	`Colors.Black`
ActionButtonFont	`Font`	Czcionka przycisku akcji.	`Font.SystemFontOfSize(14)`
ActionButtonTextColor	`Color`	Kolor tekstu przycisku akcji.	`Colors.Black`
Kolor tła	`Color`	Kolor tła.	`Colors.LightGray`
CornerRadius	`CornerRadius`	Promień rogu.	`new CornerRadius(4, 4, 4, 4)`

Metody

Metoda	opis
Pokaż	Wyświetl żądany element `Snackbar`. Spowoduje to odrzucenie wszystkich aktualnie wyświetlanych `Snackbar`
Odrzuć	Odrzuć żądany element `Snackbar`.

Uwaga

Można wyświetlić tylko 1 Snackbar w tym samym czasie. Jeśli wywołasz metodę Show po raz drugi, pierwszy Snackbar zostanie automatycznie odrzucony przed pokazaniem drugiego Snackbar .

Przykłady

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

interfejs API

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

Udostępnij za pośrednictwem

Pasek przekąskowy

Inicjowanie specyficzne dla platformy

Składnia

C#

Właściwości

SnackbarOptions

Właściwości

Metody

Przykłady

interfejs API

Opinia

Dodatkowe zasoby