mvvm-Light 用户控制 RelayCommand TemplateBinding答案

【问题标题】：Mvvm-Light User Control RelayCommand TemplateBindingmvvm-Light 用户控制 RelayCommand TemplateBinding
【发布时间】：2017-01-21 14:43:32
【问题描述】：

[UWP - Windows 10]

我是 MVVM-Light 的新手，所以遇到了一些入门问题。我创建了一个名为 TileToolbar 的自定义用户控件，其中包含此 xaml：

  <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
    <RadioButton Style="{StaticResource NavRadioButtonStyle}" Tag="&#xE141;" Foreground="Green"></RadioButton>
    <RadioButton Style="{StaticResource NavRadioButtonStyle}" Tag="&#xE7E6;" Foreground="Green"></RadioButton>
    <RadioButton Style="{StaticResource NavRadioButtonStyle}" Tag="&#xEB52;" Foreground="Green"></RadioButton>
</StackPanel>

现在我想为每个 RadioButton 添加一个RelayCommand，并且我希望每个包含自定义用户控件的页面都能够绑定一个自定义RelayCommand。

我的第一个方法是在 xaml 中设置 Command 属性并在实际工作的视图模型（例如 MainViewModel）中实现该方法 - 缩短 xaml:<RadioButton Command="{Binding Command}"></RadioButton>
因为我想使用 customcontrol 在页面中设置属性 像这样<TileToolbar PinCommand={Binding Command}></TileToolbar> 我创建了 RelayCommand 类型的依赖属性，但 TemplateBinding 不起作用。

所以我的问题：如何在 UserControl 中创建一个类似于 PinCommand 类型的 RelayCommand 属性，以便稍后在 xaml 中绑定到它，例如在 Mainpage 上？

【问题讨论】：

标签： c# xaml user-controls uwp mvvm-light

【解决方案1】：

所以我的问题是：如何在 UserControl 中创建一个类似于 PinCommand 类型的 RelayCommand 属性，以便以后可以在 xaml 中绑定到它，例如在主页上？

您可以在UserControl 后面的代码中注册RelayCommand 类型的PinCommand，例如：

public static DependencyProperty PinCommandProperty = DependencyProperty.Register("PinCommand", typeof(RelayCommand), typeof(TileToolbar), new PropertyMetadata(null));

public RelayCommand PinCommand
{
    get
    {
        return (RelayCommand)GetValue(PinCommandProperty);
    }
    set
    {
        SetValue(PinCommandProperty, value);
    }
}

现在您可以在您的MainPage 中使用此TileToolbar，例如：

<Controls:TileToolbar Grid.Row="1" VerticalAlignment="Bottom" PinCommand="{Binding pinCommand, Mode=OneWay}" />

视图模型中的代码是这样的：

private RelayCommand _pinCommand;

public RelayCommand pinCommand
{
    get
    {
        if (_pinCommand == null)
        {
            _pinCommand = new RelayCommand(() =>
            {
                //TODO:
            },
            () => true);
        }
        return _pinCommand;
    }
}

对于将RadioButton 的Command 连接到TileToolBar 的PinCommand 的工作，您可以在您的用户控件中使用如下代码：

<RadioButton Tag="&#xEB52;" Foreground="Green" Command="{x:Bind PinCommand, Mode=OneWay}"></RadioButton>

【讨论】：