WPF 材料设计 Snackbar 持续时间

Question

嗨，我正在尝试找出如何为 Snackbar 设置持续时间。这个 Snackbar 是 ButchersBoy 在 Xaml 工具包中提供的 Material Design 组件，可以在这里和这里找到。

目前还没有文档说明是否可以设置持续时间，也许我在代码中看漏了？一定有一个参数可以实现这个功能吧？

我的当前代码（后台代码）如下：

items.Snackbar.MessageQueue.Enqueue("Wow, easy!")

以下是XAML代码：

<materialDesign:Snackbar 
        HorizontalAlignment="Stretch" 
        MessageQueue="{materialDesign:MessageQueue}" 
        x:Name="Snackbar" 
        Grid.Row="1" 
        Grid.ColumnSpan="2" />

这段代码可以正常工作，显示“哇，太容易了！”但显示时间太短，所以我正在尝试找到一种方法添加持续时间。

- StealthRT

Answer 1

SnackbarMessageQueue有以下构造函数：

public SnackbarMessageQueue(TimeSpan messageDuration)

因此，您可以在视图模型中创建消息队列，并分配如下：

<materialDesign:Snackbar MessageQueue="{Binding MyCustomMessageQueue}" />

或者，使用代码后处理，为您的控件命名：

<materialDesign:Snackbar x:Name="MySnackbar" />

然后在代码后台，您可以分配一个新的 Snackbar：

var myMessageQueue = new SnackbarMessageQueue(TimeSpan.FromMilliseconds(8000));
MySnackbar.MessageQueue = myMessageQueue;

在将来，我们可以将此添加到您示例中使用的标记扩展中，请随时在GitHub上提出请求。

- James Willock

Answer 2

这里有一种方法可以为 Material Design In Xaml Toolkit 的 Snackbar 添加持续时间。

XAML:

 <materialDesign:Snackbar 
                 IsActive="False" 
                 x:Name="SnackbarOne"  
                 MessageQueue="{materialDesign:MessageQueue}"/>

代码后台:

 SnackbarOne.MessageQueue?.Enqueue("Wow, easy!", null, null, null, false, true, TimeSpan.FromSeconds(3));

- Bloggrammer

Answer 3

1. 视图

<materialDesign:Snackbar
            Width="450"
            Margin="4"
            HorizontalAlignment="Right"
            VerticalAlignment="Bottom"
            MessageQueue="{Binding SnackbarMessageQueue}" />

2. Context

public SnackbarMessageQueue SnackbarMessageQueue { set; get; } = 
        new(TimeSpan.FromSeconds(1)); // you could set a default time or not..

3. 实用工具

public static void SnackbarEnqueue(this SnackbarMessageQueue snackbarMsgQueue,
    string msg, string btnContent = "", Action btnAction = null, double duration = 1) =>
    snackbarMsgQueue.Enqueue(msg,
            btnContent,
            _ => btnAction?.Invoke(), actionArgument:null, 
            promote:false, neverConsiderToBeDuplicate:false, 
            durationOverride:TimeSpan.FromSeconds(duration));

样例用法：

SnackbarMessageQueue.SnackbarEnqueue("Hi there1");
SnackbarMessageQueue.SnackbarEnqueue("Hi there2", duration: 2);
SnackbarMessageQueue.SnackbarEnqueue("Hi there3", "Click Me!", () => Console.WriteLine("Snackbar button clicked.."));

- Muhammad Sulaiman

Answer 4

1. 视图

<Button Content="Show SnackBar" Command={Binding ShowSnackBarCommand} />
<materialdesign:Snackbar
    IsActive="{Binding SnackBarIsActive}"
    Message="{Binding SnackBarMessage}" />

2. 上下文

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;

namespace SnackbarTesting
{
    public partial class MainViewModel : ObservableRecipient
    {
        [RelayCommand]
        private async Task ShowSnackBar()
        {
            SnackBarMessage = "TEST MESSAGE WITH DELAY!";

            SnackBarIsActive = true;
            await Task.Delay(TimeSpan.FromSeconds(3));
            SnackBarIsActive = false;
        }

        [ObservableProperty]
        private bool snackBarIsActive;

        [ObservableProperty]
        private string snackBarMessage = string.Empty;
    }
}

- A.M.