Séparateur via datatemplate

Question

j'ai un ToolBar avec un lien ItemsSource, J'utilise DataTemplateSelector pour déterminer le DataTemplate au moment de l'exécution (c'est-à-dire Button / ToggleButton).

Je veux ajouter un Separator DataTemplate, comment je fais ça?

Answer 1

La barre d'outils est un éléments Control, il souhaite donc "envelopper" les éléments définis dans les éléments / éléments avec un "conteneur". Le conteneur est un uielement qui peut être utilisé pour afficher l'élément. Dans le cas d'une boîte de liste par exemple, le conteneur est un listBoxItem. Si un élément est de type approprié, il peut également s'agir de son propre conteneur.

Cette configuration vous permet de passer une liste de chaînes à une boîte de liste et de lui faire afficher la propriété et la sélection de support, la navigation par clavier, le style, etc.

Dans le cas de la barre d'outils, il s'attend vraiment à ce que ses éléments soient déjà un conteneur (c'est-à-dire un uielement). Si l'élément n'est pas un UIElement, il l'enroulera avec un contenupresenter.

Maintenant, le datatemplateselecter est utilisé par le conteneur pour déterminer comment afficher son élément. Mais vous avez besoin que l'élément soit un bouton, Togglebutton, séparateur, etc. Vous suggérez que vous devez ajouter le conteneur dans le datatemplate affiché par le conteneur.

Il y a aussi le problème des styles, qui peuvent être vus avec cet exemple simple:

<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>

Les boutons de la barre d'outils en haut rendront le même aspect que s'ils n'étaient pas dans la barre d'outils. Les boutons de la barre d'outils en bas obtiendront un look de "barre d'outils". Il en va de même pour les séparateurs.

Vous pouvez appliquer manuellement le style comme tel:

<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>

Vous auriez le même problème avec les séparateurs. Vous auriez donc besoin d'appliquer manuellement le style comme tel:

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

Vous devriez pouvoir utiliser le datatemplate ci-dessus dans votre datatemplateelector, tout comme vous le faites avec les boutons.