Snackbar
Snackbar
是預設出現在畫面底部的計時警示。 它會在可設定的時間持續時間之後關閉。 Snackbar
是完全可自定義的,而且可以錨定至任何 IView
。
會 Snackbar
通知使用者應用程式已執行或將執行的進程。 它會暫時出現在畫面底部。
若要存取 Snackbar
此功能,需要下列平臺特定的設定。
使用 Snackbar
時,必須執行下列兩個步驟:
1.使用 MauiAppBuilder 啟用小吃店使用方式
使用 UseMauiCommunityToolkit
options
參數以在 Windows 上啟用零食店使用方式時,如下所示:
var builder = MauiApp.CreateBuilder()
.UseMauiCommunityToolkit(options =>
{
options.SetShouldEnableSnackbarOnWindows(true);
})
上述會藉由設定生命週期事件 (OnLaunched
和 OnClosed
) 來自動註冊必要的處理程式。
2.在您的 Package.appxmanifest 檔案中包含 ToastNotification 註冊
若要處理零食店動作,您必須修改 Platform\Windows\Package.appxmanifest
檔案,如下所示:
- 在 Package.appxmanifest 的開頭
<Package>
標記中,新增下列 XML 命名空間:
xmlns:com="http://schemas.microsoft.com/appx/manifest/com/windows10"
xmlns:desktop="http://schemas.microsoft.com/appx/manifest/desktop/windows10"
- 在 Package.appxmanifest 中,也會在開頭
<Package>
標記中更新IgnorableNamespaces
以包含 com
uap
rescap
和 : desktop
IgnorableNamespaces="uap rescap com desktop"
範例:已完成 <Package>
的標籤
以下是已完成的開頭 <Package>
標記範例,已新增 對 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">
- 在 Package.appxmanifest 中,於每個
<Application>
標籤內新增下列延伸模組:
<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>
範例:已完成 <Applications>
標記
以下是已完成 <Applications>
標記的範例,現在已新增 對 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>
範例:要支援的已更新 Package.appxmanifest
檔案 Snackbar
以下是已更新以支援 Snackbar
Windows 的範例Package.appxmanifest
檔案:
<?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>
如需處理啟用的詳細資訊: 從 C# 應用程式傳送本機快顯通知
語法
Snackbar
使用 C# 叫用 。
C#
若要顯示 Snackbar
您需要建立它,請使用靜態方法 Make
:
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);
呼叫 Snackbar.Make()
時,需要其 參數 string text
。 所有其他參數皆為選擇性使用。
下列螢幕快照顯示產生的零食店:
另外還有擴充方法,會將 錨定 Snackbar
至任何 VisualElement
:
await MyVisualElement.DisplaySnackbar("Snackbar is awesome. It is anchored to MyVisualElement");
警告
Snackbar
在 Windows 上無法錨定, VisualElement
且一律會顯示為預設 Windows 通知。
SnackBar
包含兩個事件:
public static event EventHandler Shown
public static event EventHandler Dismissed
它也包含 屬性 public static bool IsShown { get; }
。
Snackbar.Shown += (s, e) => { Console.WriteLine(Snackbar.IsShown); };
Snackbar.Dismissed += (s, e) => { Console.WriteLine(Snackbar.IsShown); };
屬性
屬性 |
類型 |
描述 |
Text |
string |
簡訊。 必要 |
動作 |
Action |
動作按鈕按下時要叫用的動作。 |
ActionButtonText |
string |
動作按鈕文字。 |
錨點 |
IView |
Snackbar 錨。 Snackbar 會出現在此檢視附近。 當 為 時 null , Snackbar 會出現在畫面底部。 |
期間 |
TimeSpan |
Snackbar 期間。 |
VisualOptions |
SnackbarOptions |
Snackbar 視覺選項。 |
SnackbarOptions
SnackbarOptions
允許自定義預設Snackbar
樣式。
屬性
屬性 |
類型 |
描述 |
預設值 |
CharacterSpacing |
double |
訊息字元間距。 |
0.0d |
字型 |
Font |
訊息字型。 |
Font.SystemFontOfSize(14) |
TextColor |
Color |
消息正文色彩。 |
Colors.Black |
ActionButtonFont |
Font |
動作按鈕字型。 |
Font.SystemFontOfSize(14) |
ActionButtonTextColor |
Color |
動作按鈕文字色彩。 |
Colors.Black |
BackgroundColor |
Color |
背景色彩。 |
Colors.LightGray |
CornerRadius |
CornerRadius |
圓角半徑。 |
new CornerRadius(4, 4, 4, 4) |
方法
方法 |
描述 |
顯示 |
顯示所要求的 Snackbar 。 這會關閉目前顯示的任何 Snackbar |
關閉 |
關閉要求的 Snackbar 。 |
注意
您只能同時顯示 1 Snackbar
。 如果您第二次呼叫 Show
方法,則會 Snackbar
在第二次顯示第二次之前自動關閉第一 Snackbar
個方法。
範例
您可以在 .NET MAUI Community Toolkit 範例應用程式中找到這項功能的範例。
API
您可以在 .NET MAUI Community Toolkit GitHub 存放庫上找到 的Snackbar
原始程式碼。