Question

以下简单的datatemplate仅适用于运行时。在设计时它什么都不显示。为什么会这样？

<DataTemplate x:Key="SomeEnumDataTemplate">
    <ListBox Name="list" Width="20" IsSynchronizedWithCurrentItem="True" SelectedIndex="{Binding Mode=OneWay, Converter={StaticResource EnumToIntConverter}}">
        <ListBox.Template>
            <ControlTemplate TargetType="ListBox">
                <ContentPresenter Content="{TemplateBinding SelectedItem}" />
            </ControlTemplate>
        </ListBox.Template>
        <Rectangle Height="10" Width="10" Fill="Red" />
        <Rectangle Height="10" Width="10" Fill="Green" />
        <Rectangle Height="10" Width="10" Fill="Yellow" />
    </ListBox>
</DataTemplate>

我在另一个DataTemplate中使用它：

<HierarchicalDataTemplate x:Key="NodeDataTemplate" ItemsSource="{Binding Children}">
    <StackPanel Orientation="Horizontal" ToolTip="{Binding Description}">            
        <ContentControl ContentTemplate="{StaticResource SomeEnumDataTemplate}" Content="{Binding Mode}" Margin="3,0,0,0" />
        <TextBlock Text="{Binding Name}" />
    </StackPanel>
</HierarchicalDataTemplate>

再次在具有设计时数据的UserControl中使用：

<UserControl x:Class="MyProject.Views.MyView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:ViewModels="clr-namespace:MyProject.ViewModels" mc:Ignorable="d" 
             d:DesignHeight="780" d:DesignWidth="400" d:DataContext="{x:Static ViewModels:SampleData.RootNode}">     
 <TreeView ItemsSource="{Binding}" ItemTemplate="{StaticResource NodeDataTemplate}">
     <TreeView.ItemContainerStyle>
      <Style TargetType="TreeViewItem">
       <Setter Property="IsExpanded" Value="True" />
   </Style>   
  </TreeView.ItemContainerStyle>
 </TreeView>
</UserControl>

Answer 1

您可以轻松创建设计时数据：

创建您的DataModel：

public class Person
{
    public string Name { get; set; }

    public int  Age { get; set; }
}

public class PersonCollection : List<Person>
{
    public PersonCollection()
    {

    }
}

创建一个.xaml扩展名的文件，其中包含：

<强> DesignTimeTreeData.xaml

    <local:PersonCollection xmlns:local="clr-namespace:Test_TreeWithDesignData">
        <local:Person Name="Joan Solo" Age="32" />
        <local:Person Name="Amara Skywalker" Age="31" />
    </local:PersonCollection>

使用d:DataContext和d:DesignData来使用您在DesignTimeTreeData.xaml中指定的数据：

<强> MainWindow.xaml

    <Window x:Class="Test_TreeWithDesignData.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:Test_TreeWithDesignData"
            Title="MainWindow"
            Height="350"
            Width="525"
            mc:Ignorable="d">
        <Grid>
            <TreeView
                d:DataContext="{d:DesignData Source=./DesignTimeTreeData.xaml}"
                ItemsSource="{Binding}">
                <TreeView.Resources>
                    <DataTemplate DataType="{x:Type local:Person}" >
                        <StackPanel Orientation="Horizontal" Height="25">
                            <Label Content="{Binding Name}"/>
                            <Label Content="{Binding Age}" Margin="3,0,0,0"/>
                        </StackPanel>
                    </DataTemplate>
                </TreeView.Resources>
            </TreeView>
        </Grid>
    </Window>

由于Window.DataContext属性设置为ViewModel，TreeView.DataContext是其集合，为了保持两个数据源的正常运行，您可以围绕{{1} } TreeView Grid设置为DataContext的收藏。

<强> DummyViewModel.cs

ViewModel

<强> MainWindow.xaml

    public class DummyViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
        {
            var handler = PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }

        public PersonCollection Persons { get; set; }

        public DummyViewModel()
        {
            this.Persons = new PersonCollection();
        }
    }

结果：

enter image description here

修改

接下来的问题是：何我在Designer中展开项目？

<Window x:Class="Test_TreeWithDesignData.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:Test_TreeWithDesignData" Title="MainWindow" Height="350" Width="525" mc:Ignorable="d"> <Window.DataContext> <local:DummyViewModel /> </Window.DataContext> <Grid Name="RootGrid"> <Grid Name="TreeGrid" DataContext="{Binding Persons}"> <TreeView d:DataContext="{d:DesignData Source=./DesignTimeTreeData.xaml}" ItemsSource="{Binding}"> <TreeView.Resources> <DataTemplate DataType="{x:Type local:Person}" > <StackPanel Orientation="Horizontal" Height="25"> <Label Content="{Binding Name}"/> <Label Content="{Binding Age}" Margin="3,0,0,0"/> </StackPanel> </DataTemplate> </TreeView.Resources> </TreeView> </Grid> </Grid> </Window>将会有一群人：
```
Person
```
设计时数据将有一个孩子

<强> DesignTimeTreeData.xaml

public class Person
{
    public string Name { get; set; }

    public int  Age { get; set; }

    public PersonCollection Childs { get; set; }
}

树现在将有一个HierarchicalDataTemplate：

    <local:PersonCollection xmlns:local="clr-namespace:Test_TreeWithDesignData">
        <local:Person Name="Joan Solo" Age="32" />
        <local:Person Name="Amara Skywalker" Age="31">
            <local:Person.Childs>
                <local:PersonCollection>
                    <local:Person Name="Han Skywalker" Age="10" />
                </local:PersonCollection>
            </local:Person.Childs>
        </local:Person>
    </local:PersonCollection>

<HierarchicalDataTemplate DataType="{x:Type local:Person}" ItemsSource="{Binding Childs}"> <StackPanel Orientation="Horizontal" Height="25"> <Label Content="{Binding Name}"/> <Label Content="{Binding Age}" Margin="3,0,0,0"/> </StackPanel> </HierarchicalDataTemplate>将绑定到TreeView以展开设计器中的项目：
```
DesignerProperties.IsInDesignMode
```

这是窗口的xaml：

<强> MainWindow.xaml

<TreeView.ItemContainerStyle>
    <Style TargetType="TreeViewItem">
        <Style.Triggers>
            <DataTrigger
                    Binding="{Binding RelativeSource={RelativeSource Self}, Path=(pf:DesignerProperties.IsInDesignMode)}"
                    Value="true"
                    >
                <Setter Property="IsExpanded" Value="True" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</TreeView.ItemContainerStyle>

这就是结果：

enter image description here

Answer 2

一旦你开始Binding，设置DataContext，ItemSource等，设计师就会对你产生影响。只需删除所有绑定（看起来像3），你的设计师就可以工作了。把它全部排好，或者你需要做什么，然后再添加绑定。

为什么这不适用于设计时？

2 个答案:

修改