Question

我只是从WPF（来自WinForms）开始，我想像Visual Studio中那样设置窗口。类别树在左侧，适当的视图在右侧。

在WinForms中，我通过将应显示的窗口添加到TreeViewItem的TAG名称中来实现，然后在OnClick中使用反射创建了该窗口。像这样：

//pseudocode
TreeViewItem item = CreateTreeViewItem(); 
item.Tag = "GeneralSettingsWindow";
item.Text = "General settings";
------------------------------------------------------------------------
void ItemClick(object sender)
{
    TreeViewItem item = sender as TreeViewItem;
    string formName = item.Tag.ToString();
    BaseSettingsForm f = Activator.CreateInstance(formName);
    settingsPanel.Controls.Clear();
    settingsPanel.Controls.Add(f);
}

效果很好。我很好奇如何使用WPF绑定实现该功能。反正有可能吗？

Answer 1

我已经在左侧完成了树形视图，当您单击一个项目时，它将更新右侧面板的内容。为此，您必须在一个窗口中制作两个面板或网格，一个在左侧，宽度较小，另一个在右侧。然后，将树视图放在左侧，并通过添加不同类型的用户控件或通过单击树视图项的相应单击来显示和隐藏不同的网格来更新右侧网格的内容。

这里是制作树状视图的示例，您可以根据自己的要求进行修改。

<TreeView MouseLeftButtonUp="Get_MFR" SelectedItemChanged="treeviewQuestion_SelectedItemChanged" 
x:Name="treeviewQuestion" FontFamily="Nunito" FontSize="16" Padding="10 10" 
HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
BorderThickness="0" Margin="0,0,0,27"
>

<TreeView.Resources>
<Style TargetType="{x:Type TreeViewItem}">
<Setter Property="IsExpanded" Value="True"/>
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="10 2">
<TextBlock Text="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type TreeViewItem}},Path=Tag,
Converter={x:Static local:TagToTextConverter.Instance}}" />
<TextBlock Text="{Binding}"/>
<Rectangle Margin="5" Width="10" Height="10" Fill="{Binding RelativeSource={RelativeSource Mode=FindAncestor, 
AncestorType={x:Type TreeViewItem}},Path=Tag,
Converter={x:Static local:TagToColorConverter.Instance}}"/>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
</TreeView.Resources>

</TreeView>

Answer 2

即使您不熟悉WPF开发，我仍然建议您看一下MVVM设计模式。用户界面和业务逻辑之间的分离使这种类型的应用程序结构更加简单。

用ContentControl替换设置面板，并根据不同的树节点类型定义所需的DataTemplates。然后，您可以将其Content属性绑定到所选的TreeViewItem。

不幸的是，“开箱即用”的WPF不支持绑定到TreeView中的选定项目。但是，有几种解决方法，包括使用Behaviour，这是我最近在blog post中描述的。

设置窗口设计-将页面绑定到TreeViewItem

2 个答案: