Aide à la programmation, réponses aux questions / Wpf / WPF Treeview contenu sous ItemsPresenter - wpf, treeview

Contenu de WPF Treeview sous ItemsPresenter - wpf, treeview

Contexte

Je cherche depuis un jour sans résultat. C’est ce que j’essaie de faire, c’est l’arbre suivant:

<Grid>
<TreeView>
<TreeViewItem>
<TreeViewItem.Header>
<StackPanel>
<TextBlock Text="Header Content 1"/>
<TextBlock Text="Header Content 2"/>
</StackPanel>
</TreeViewItem.Header>
<StackPanel >
<TextBlock Margin="-19,0,0,0" Text="Expandable Content 1"/>
<TextBlock Margin="-19,0,0,0" Text="Expandable Content 2"/>
</StackPanel>
</TreeViewItem>
<TreeViewItem>
<TreeViewItem.Header>
<StackPanel>
<TextBlock Text="Content Footer"/>
<TextBlock Text="Content Footer"/>
</StackPanel>
</TreeViewItem.Header>
</TreeViewItem>
</TreeView>
</Grid>

Le présentateur d'objets de l'arborescence doit présenterson contenu entre deux panneaux de contenu (en-tête et pied de page), sauf que, dans le code ci-dessus, deux éléments de l'arborescence sont nécessaires et que je voudrais l'avoir comme élément de arborescence 1 (sélectionnable)

Si vous modifiez le modèle de contrôle par défaut de l'arborescence pour essayer d'ajouter un bloc de texte sur une troisième ligne d'une grille, il copie pour une raison quelconque ce bloc de texte deux fois lorsque l'élément de l'arborescence est développé:

<Window.Resources>
<SolidColorBrush x:Key="GlyphBrush" Color="#444" />
<Style x:Key="ExpandCollapseToggleStyle" TargetType="ToggleButton">
<Setter Property="Focusable" Value="False"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ToggleButton">
<Grid Width="15"
Height="13"
Background="Transparent">
<Path x:Name="ExpandPath"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Margin="1,1,1,1"
Fill="{StaticResource GlyphBrush}"
Data="M 4 0 L 8 4 L 4 8 Z"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Data" TargetName="ExpandPath" Value="M 0 4 L 8 4 L 4 8 Z"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="TreeViewItemFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Border>
<Rectangle  Margin="0,0,0,0"
StrokeThickness="5"
Stroke="Black"
StrokeDashArray="1 2"
Opacity="0"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type TreeViewItem}" TargetType="{x:Type TreeViewItem}">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
<Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
<Setter Property="Padding" Value="1,0,0,0"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="FocusVisualStyle" Value="{StaticResource TreeViewItemFocusVisual}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TreeViewItem}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition MinWidth="19" Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<ToggleButton x:Name="Expander"
Style="{StaticResource ExpandCollapseToggleStyle}"
IsChecked="{Binding Path=IsExpanded,
RelativeSource={RelativeSource TemplatedParent}}"
ClickMode="Press"/>
<Border   Name="Bd"
Grid.Column="1"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Padding="{TemplateBinding Padding}">
<ContentPresenter x:Name="PART_Header" ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/>
</Border>
<ItemsPresenter x:Name="ItemsHost"
Grid.Row="1"
Grid.Column="1"
Grid.ColumnSpan="2"/>
<TextBlock Grid.Row="2" Grid.Column="1" Text="Footer Text"></TextBlock>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="false">
<Setter TargetName="ItemsHost"
Property="Visibility"
Value="Collapsed"/>
</Trigger>
<Trigger Property="HasItems" Value="false">
<Setter TargetName="Expander"
Property="Visibility"
Value="Hidden"/>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="HasHeader" Value="false"/>
<Condition Property="Width" Value="Auto"/>
</MultiTrigger.Conditions>
<Setter TargetName="PART_Header" Property="MinWidth" Value="75"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="HasHeader" Value="false"/>
<Condition Property="Height" Value="Auto"/>
</MultiTrigger.Conditions>
<Setter TargetName="PART_Header" Property="MinHeight" Value="19"/>
</MultiTrigger>
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="Bd" Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>                            </Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="true"/>
<Condition Property="IsSelectionActive" Value="false"/>
</MultiTrigger.Conditions>
<Setter TargetName="Bd" Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
</MultiTrigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<TreeView>
<TreeViewItem>
<TreeViewItem.Header>
<StackPanel>
<TextBlock Text="Treeview Item 1"/>
<TextBlock Text="Header Content"/>
</StackPanel>
</TreeViewItem.Header>
<StackPanel >
<TextBlock Margin="-19,0,0,0" Text="Expandable Content 1"/>
<TextBlock Margin="-19,0,0,0" Text="Expandable Content 2"/>
</StackPanel>
</TreeViewItem>
<TreeViewItem>
<TreeViewItem.Header>
<StackPanel>
<TextBlock Text="Treeview Item 2"/>
<TextBlock Text="Header Content"/>
</StackPanel>
</TreeViewItem.Header>
<StackPanel >
<TextBlock Margin="-19,0,0,0" Text="Expandable Content 1"/>
<TextBlock Margin="-19,0,0,0" Text="Expandable Content 2"/>
</StackPanel>
</TreeViewItem>
</TreeView>
</Grid>

Dans l'exemple ci-dessus, le contenu du pied de page est affiché deux fois, car il est ajouté au bas de Itemspresenter.

Question

Quelqu'un sait-il comment résoudre ceci? Ou peut-être connaît une approche différente pour atteindre le même résultat?

Réponses:

1 pour la réponse № 1

Le problème ici est le Content du TreeViewItem est enveloppé dans un implicite TreeViewItem par lui-même, ce qui donne un autre "pied de page", ce qui le fait ressembler à 2 éléments "pied de page" par TreeViewItem.

Confirmé avec Fouiner:

le TreeViewItem nous ajoutons réellement

entrer la description de l'image ici

et celui implicite créé par le Content de TreeViewItem

entrer la description de l'image ici

Solution de contournement:

il suffit d'appliquer un nom au "pied de page" TextBlock tel que

<TextBlock x:Name="footer"
Grid.Row="2"
Grid.Column="1"
Text="Footer Text" />

et mettre à jour le Trigger pour HasItems -> False à:

<Trigger Property="HasItems"
Value="false">
<Setter TargetName="Expander"
Property="Visibility"
Value="Hidden" />
<Setter TargetName="footer"
Property="Visibility"
Value="Collapsed" />
</Trigger>

Le texte de bas de page ne sera visible que lorsque le TreeViewItem a des enfants vous donnant ainsi l'apparence que vous attendez