WPF树形结构
1
悬赏园豆：20
[待解决问题]
我要在wpf中实现树形层级结构
但是头部标题和下方的树节点的详细信息对不上 我想要层级打开的文件信息都与头部标题各列对齐应该怎么实现呢?
<Grid Margin="0,8,0,8">
<!-- 页面整体分两列 -->
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="86" />
</Grid.ColumnDefinitions>
<!-- 第一列 程序管理主页面 -->
<Grid Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition Height="48" />
<RowDefinition Height="274" />
<RowDefinition Height="2" />
<RowDefinition Height="274" />
<RowDefinition Height="" />
</Grid.RowDefinitions>
<!-- PC区 -->
<!-- 顶栏 -->
<Border
Grid.Row="0"
Margin="8,0,8,0"
Background="#FFFFFF"
BorderBrush="#D1D6E0"
BorderThickness="1,1,1,0"
CornerRadius="4 4 0 0">
<Grid Margin="4,4,4,4">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="2" />
<ColumnDefinition Width="8*" />
</Grid.ColumnDefinitions>
<TextBlock
Grid.Column="0"
Width="auto"
Height="22"
VerticalAlignment="Center"
FontSize="16"
Foreground="#385278"
LineHeight="19"
Text="文件夹"
TextAlignment="Center" />
<StackPanel
Grid.Column="1"
Margin="105,0,0,0"
Orientation="Horizontal">
<TextBlock
Grid.Column="1"
Height="22"
VerticalAlignment="Center"
FontSize="16"
Foreground="#385278"
LineHeight="19"
Text="EXT."
TextAlignment="Center" />
<TextBlock
Grid.Column="2"
Height="22"
Margin="50,0,0,0"
VerticalAlignment="Center"
FontSize="16"
Foreground="#385278"
LineHeight="19"
Text="大小"
TextAlignment="Center" />
<TextBlock
Grid.Column="3"
Height="22"
Margin="60,0,0,0"
VerticalAlignment="Center"
FontSize="16"
Foreground="#385278"
LineHeight="19"
Text="文件"
TextAlignment="Center" />
<TextBlock
Grid.Column="4"
Height="22"
Margin="80,0,0,0"
VerticalAlignment="Center"
FontSize="16"
Foreground="#385278"
LineHeight="19"
Text="备注"
TextAlignment="Center" />
<TextBlock
Grid.Column="5"
Height="22"
Margin="80,0,0,0"
VerticalAlignment="Center"
FontSize="16"
Foreground="#385278"
LineHeight="19"
Text="修改"
TextAlignment="Center" />
<TextBlock
Grid.Column="6"
Height="22"
Margin="60,0,0,0"
VerticalAlignment="Center"
FontSize="16"
Foreground="#385278"
LineHeight="19"
Text="存储"
TextAlignment="Center" />
<TextBlock
Grid.Column="7"
Height="22"
Margin="40,0,0,0"
FontSize="16"
Foreground="#385278"
LineHeight="19"
Text="属性"
TextAlignment="Center" />
</StackPanel>
</Grid>
</Border>
<!-- PC区树状目录结构 -->
<Border
Grid.Row="1"
Margin="8,0,8,0"
Background="#FFFFFF"
BorderBrush="#33375278"
BorderThickness="1,1,1,0">
<Border.Effect>
<DropShadowEffect
BlurRadius="10"
Direction="315"
Opacity="0.2"
ShadowDepth="2"
Color="#377484" />
</Border.Effect>
<TreeView
x:Name="PCtree"
Height="273"
VerticalAlignment="Bottom"
ItemContainerStyle="{StaticResource TreeViewItemStyle}"
ItemsSource="{Binding PCModels}">
<TreeView.Resources>
<local:FileFolderTemplateSelector
x:Key="FileFolderTemplateSelector"
DirectoryDataTemplate="{StaticResource DirectoryDataTemplate}"
FileDataTemplate="{StaticResource FileDataTemplate}" />
</TreeView.Resources>
<TreeView.ItemTemplateSelector>
<StaticResource ResourceKey="FileFolderTemplateSelector" />
</TreeView.ItemTemplateSelector>
</TreeView>
</Border>
<HierarchicalDataTemplate
x:Key="FileDataTemplate"
DataType="{x:Type local:PCModel}"
ItemsSource="{Binding Children}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<StackPanel
Grid.Column="0"
Margin="2"
Orientation="Horizontal">
<Image
Width="16"
Height="16"
Margin="10,6"
HorizontalAlignment="Center"
VerticalAlignment="Center"
SnapsToDevicePixels="True"
Source="{DynamicResource FileDocumentIcon}"
Stretch="Uniform"
UseLayoutRounding="True" />
<TextBlock
Width="auto"
Margin="0,1,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
Foreground="#375278"
LineHeight="16"
Text="{Binding Name}" />
</StackPanel>
<StackPanel
Grid.Column="1"
Margin="2"
Orientation="Horizontal">
<TextBlock
Margin="20,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
Foreground="#375278"
Text="{Binding FileDetail.PCFileExt}" />
<TextBlock
Margin="20,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
Foreground="#375278"
Text="{Binding FileDetail.PCFileSize}" />
<TextBlock
Margin="20,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
Foreground="#375278"
Text="{Binding FileDetail.PCNCFileName}" />
<TextBlock
Margin="20,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
Foreground="#375278"
Text="{Binding FileDetail.PCFileComment}" />
<TextBlock
Margin="20,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
Foreground="#375278"
Text="{Binding FileDetail.PCFileModify}" />
<TextBlock
Margin="20,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
Foreground="#375278"
Text="{Binding FileDetail.PCFileStorage}" />
<TextBlock
Margin="20,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
Foreground="#375278"
Text="{Binding FileDetail.PCFileAttributes}" />
</StackPanel>
</Grid>
</HierarchicalDataTemplate>
所有回答(1)
0
在您的 WPF 应用程序中实现树形层级结构时，确保文件夹标题和文件节点的详细信息对齐，您可以尝试以下方法：
使用 UniformGrid 布局： 可以使用 UniformGrid 来确保树节点的详细信息在每个列中对齐。UniformGrid 会均匀分配每个单元格的宽度。例如，您可以在每个树节点的详细信息部分使用 UniformGrid 来排列文本块，以确保它们对齐。
调整列宽度： 确保每个列的宽度足够容纳其内容，以便在不需要滚动的情况下显示完整的内容。您可以根据内容的长度和布局需求来调整列的宽度。
使用 Grid 的 SharedSizeGroup 属性： 如果您使用的是 Grid 布局，可以使用 SharedSizeGroup 属性来确保各列具有相同的大小。这样可以确保每个树节点的详细信息在每个列中对齐。将 SharedSizeGroup 属性应用于每个树节点详细信息列的相应 Grid 列定义。
以下是调整您的代码以实现这些建议的示例：
xml
Copy code
<Grid Grid.Column="1" Margin="2" Orientation="Horizontal">
<TextBlock Margin="20,0,0,0" HorizontalAlignment="Center" VerticalAlignment="Center"
FontSize="14" Foreground="#375278" Text="{Binding FileDetail.PCFileExt}" />
<!-- 添加其他列 -->
</Grid>
您可以根据需要调整列的数量和内容，以确保它们对齐。通过使用这些方法，您应该能够在树形层级结构中实现标题和节点详细信息的对齐。
