命令绑定到用户控件

本文关键字:控件 用户 绑定 命令 | 更新日期: 2023-09-27 17:56:54

我目前正在努力让一些东西工作,这在我的脑海中似乎并不难。

A 获得显示在窗口中的顶级用户控件:

<UserControl.Resources>
    <DataTemplate DataType="{x:Type viewModels:PCodeViewModel}">
        <controls:PCodeTabControl />
    </DataTemplate>
    <DataTemplate x:Key="TabItemHeaderTemplate">
        <TextBlock FontWeight="Medium" Text="{Binding}" />
    </DataTemplate>
    <Style x:Key="TabItemStyle" TargetType="{x:Type dx:DXTabItem}">
        <Setter Property="Header" Value="{Binding TabHeader}" />
        <Setter Property="Content" Value="{Binding}" />
    </Style>
    <DataTemplate DataType="{x:Type viewModels:MexCompileViewModel}">
        <controls:MexCompileTabControl  />
    </DataTemplate>
</UserControl.Resources>
<Grid>
    <dx:DXTabControl ItemContainerStyle="{StaticResource TabItemStyle}"
                     ItemHeaderTemplate="{StaticResource TabItemHeaderTemplate}"
                     ItemsSource="{Binding Tabs}" />
</Grid>

相应的视图模型在这里:

private ICommand createNewProjectCommand;
    private string sandboxRoot;
    public MatlabBuildViewModel()
    {
        this.Init();
    }
    public void Init()
    {
        this.InitTabs();
    }
    public void InitTabs()
    {
        this.Tabs = new ObservableCollection<TabViewModelBase>
                        {
                            new MexCompileViewModel(),
                            new PCodeViewModel()
                        };
        this.SandboxRoot = @"E:'_SupportTools'CaseManager";
    }
    public ObservableCollection<TabViewModelBase> Tabs { get; private set; }
    public void NotifyChildren()
    {
        Messenger.Default.Send(new SandboxRootUpdated());
    }
    public string SandboxRoot
    {
        get
        {
            return this.sandboxRoot;
        }
        set
        {
            if (value != null)
            {
                this.sandboxRoot = value;
                this.OnPropertyChanged();
                this.NotifyChildren();
            }
        }
    }
    /// <summary>
    /// Gets the create new project command.
    /// </summary>
    public ICommand CreateEmptyProjectCommand
    {
        get
        {
            if (this.createNewProjectCommand == null)
            {
                this.createNewProjectCommand = new DelegateCommand(Debugger.Break);
            }
            return this.createNewProjectCommand;
        }
    }

现在,如您所见,我通过为目标类型MexCompileViewModel和PCodeViewModel使用DataTemplate来显示两个选项卡。

由 Dattemplate 绑定的两个用户控件共享一个包含许多按钮的公共用户控件。

这是 MexCompileTabControl 作为示例

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
    <compositeControls:MexCompileGrid Grid.Column="0" IsEnabled="{Binding IsEnabled}" />
    <StackPanel Grid.Column="1">
        <compositeControls:CommonActionsControl />
    </StackPanel>
</Grid>

CommonActionsControl 只是一个带有按钮的 StackPanel:

<StackPanel helpers:MarginSetter.Margin="3">
    <GroupBox Header="MatlabProject-File">
        <StackPanel helpers:MarginSetter.Margin="3">
            <Button Command="{Binding CreateEmptyProjectCommand}" Content="Create empty project-file" />
            <Button Content="Refresh" />
        </StackPanel>
    </GroupBox>
    <GroupBox Header="Actions">
        <StackPanel helpers:MarginSetter.Margin="3">
            <Button Content="Clean" />
            <Button Content="Rebuild" />
            <Button Content="Generate m-Script" />
        </StackPanel>
    </GroupBox>
</StackPanel>

代码隐藏:

        public CommonActionsControl()
    {
        this.InitializeComponent();
    }
    public static readonly DependencyProperty CreateEmptyProjectCommandProperty = DependencyProperty.Register("CreateEmptyProjectCommand", typeof(ICommand), typeof(CommonActionsControl), new PropertyMetadata(default(ICommand)));
    public ICommand CreateEmptyProjectCommand
    {
        get
        {
            return (ICommand)GetValue(CreateEmptyProjectCommandProperty);
        }
        set
        {
            this.SetValue(CreateEmptyProjectCommandProperty, value);
        }
    }

所以我想要实现的是:我的命令在TopLevelViewModel中定义。现在我希望我的CommonActionsControl继承这些命令,因为控件应该多次使用。你能帮我这个吗?

命令绑定到用户控件

由于CommonActionsControl显示了TopLevelViewModel中定义的常见操作,因此将它们作为TopLevelView的一部分而不是在每个选项卡上显示它们是有意义的。

如果您确实希望它们出现在每个选项卡上,那么我认为最好的选择是将命令添加到TabViewModelBase,以便各种选项卡视图可以绑定到它们。您仍然可以在TopLevelViewModel中自由实现它们一次,只需将它们注入构造函数即可将它们传递到各个选项卡 VM。