Разделитель через DataTemplate

Question

У меня есть ToolBar со связью ItemsSource, Я использую DataTemplateSelector определить DataTemplate во время выполнения (т.е. Button / ToggleButton).

Я хочу добавить SeparatorDataTemplate, как я это сделал?

Answer 1

Панель инструментов представляет собой ItemsControl, поэтому она хочет "обернуть" элементы, определенные в Items/ItemsSource, "контейнером". Контейнер - это UIElement, который можно использовать для отображения элемента. Например, в случае ListBox контейнером является ListBoxItem. Если элемент имеет правильный тип, то это также может быть его собственный контейнер.

Эта настройка позволяет передавать список строк в ListBox и отображать его свойства и выбор поддержки, навигацию по клавиатуре, стилизацию и т. Д.

В случае ToolBar он действительно ожидает, что его элементы уже будут контейнером (т.е. UIElement). Если элемент не является элементом UIElement, то он обернет его с помощью ContentPresenter.

Теперь DataTemplateSelecter используется контейнером для определения способа отображения его элемента. Но вам нужно, чтобы этот элемент был Button, ToggleButton, Separator и т. Д. Вы предлагаете добавить контейнер в шаблон данных, отображаемый контейнером.

Существует также проблема стилей, которую можно увидеть на следующем простом примере:

<Window x:Class="TestWPF.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:system="clr-namespace:System;assembly=mscorlib" Title="Main"
        Height="500" Width="500">
    <DockPanel LastChildFill="False">
        <ToolBar DockPanel.Dock="Top">
            <ToolBar.ItemTemplate>
                <DataTemplate>
                    <Button Content="{Binding}" />
                </DataTemplate>
            </ToolBar.ItemTemplate>
            <system:String>Test1</system:String>
            <system:String>Test2</system:String>
        </ToolBar>
        <ToolBar DockPanel.Dock="Top">
            <Button>Test1</Button>
            <Button>Test2</Button>
        </ToolBar>
    </DockPanel>
</Window>

Кнопки в верхней панели инструментов будут отображаться так же, как если бы их не было в панели инструментов. Кнопки на панели инструментов внизу получат вид "панели инструментов". То же самое касается разделителей.

Вы можете вручную применить стиль следующим образом:

<Window x:Class="TestWPF.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:system="clr-namespace:System;assembly=mscorlib" Title="Main"
        Height="500" Width="500">
    <DockPanel LastChildFill="False">
        <ToolBar DockPanel.Dock="Top">
            <ToolBar.ItemTemplate>
                <DataTemplate>
                    <Button Content="{Binding}"
                        Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}" /> <!-- Add the Style attribute -->
                </DataTemplate>
            </ToolBar.ItemTemplate>
            <system:String>Test1</system:String>
            <system:String>Test2</system:String>
        </ToolBar>
        <ToolBar DockPanel.Dock="Top">
            <Button>Test1</Button>
            <Button>Test2</Button>
        </ToolBar>
    </DockPanel>
</Window>

У вас будет такая же проблема с разделителями. Поэтому вам нужно будет вручную применить стиль следующим образом:

<DataTemplate x:Key="MySeparatorTemplate">
    <Separator Style="{StaticResource {x:Static ToolBar.SeparatorStyleKey}}" />
</DataTemplate>

Вы должны быть в состоянии использовать DataTemplate выше в вашем DataTemplateSelector, так же, как вы делаете с кнопками.