c# - UWP 中的绑定(bind)命令

Question

我的 App.xaml 中有一个 MenuFlyout:

<Application.Resources>
    <MenuFlyout x:Key="LessonFlyout">
        <MenuFlyoutItem Text="Edit"/>
        <MenuFlyoutItem Text="Delete"/>
    </MenuFlyout>
</Application.Resources>

我想为 MenuFlyoutItem 提供点击事件，但编译器说我不能这样做。但我需要一个点击事件，所以我搜索并发现我可以将命令绑定(bind)到 MenuFlyoutItem。

我的 MenuFlyout 将附加到不同页面中的不同对象。例如:

    StackPanel thisSender = sender as StackPanel;
    FlyoutBase.SetAttachedFlyout(thisSender, Application.Current.Resources["LessonFlyout"] as MenuFlyout);
    FlyoutBase.ShowAttachedFlyout(thisSender);

所以我需要在单击 MenuFlyoutItem 时调用我的函数。那么我该怎么做呢？

还有一个快速的问题，在关于 MenuFlyout 的官方 Microsoft 页面中，据说 MenuFlyoutItem 有一个 Icon 属性，但在我的情况下我没有它，VS 说有一个错误。

The member "Icon" is not recognized or is not accessible.   
The property 'Icon' was not found in type 'MenuFlyoutItem'. 

Answer 1

对于不同页面中的不同对象，MenuFlyoutItem及其 Command会有所不同，所以通常我们不会把 MenuFlyout在Application.Resources .但是如果你能确定 MenuFlyoutItem s 用于不同的 Page都是一样的，那么下面的可能是适合你的解决方案。

首先，在 App.xaml 中，设置 Binding对于 Command :

<Application.Resources>
    <MenuFlyout x:Key="LessonFlyout">
        <MenuFlyoutItem Text="Edit" Command="{Binding EditCommand}" />
        <MenuFlyoutItem Text="Delete" Command="{Binding DeleteCommand}" />
    </MenuFlyout>
</Application.Resources>

然后执行I​Command Interface喜欢 RelayCommand.cs在官方样本中。

在此之后，我们需要执行EditCommand和 DeleteCommand在 View 模型中，以便绑定(bind)可以工作。例如:

public class ViewModel
{
    public ICommand EditCommand { get; set; }

    public ICommand DeleteCommand { get; set; }

    public ViewModel()
    {
        EditCommand = new RelayCommand(() =>
        {
            //TODO
            System.Diagnostics.Debug.WriteLine("EditCommand");
        });
        DeleteCommand = new RelayCommand(() =>
        {
            //TODO
            System.Diagnostics.Debug.WriteLine("DeleteCommand");
        });
    }
}

然后附上 MenuFlyout喜欢:

StackPanel thisSender = sender as StackPanel;
thisSender.DataContext = new ViewModel();
FlyoutBase.SetAttachedFlyout(thisSender, Application.Current.Resources["LessonFlyout"] as MenuFlyout);
FlyoutBase.ShowAttachedFlyout(thisSender);

ViewModel这里使用的只是一个例子，通常你的页面应该有一个 View 模型，如果是这样就不需要设置 DataContext附上 MenuFlyout 时.设置EditCommand和 DeleteCommand在您页面的 View 模型中应该足以工作。

---

对于以下错误:

The member "Icon" is not recognized or is not accessible.
The property 'Icon' was not found in type 'MenuFlyoutItem'.

这是因为您的项目目标版本早于 Build 15063。在 Icon属性，我们可以找到 Additional features and requirements 表明此属性已在 Windows 10 Creators Update (v10.0.15063.0) 中引入。因此，要使用此属性，请确保您的目标是 Build 15063 或更高版本。