命令绑定到用户控件
本文关键字:控件 用户 绑定 命令 | 更新日期: 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。