WPF TreeView引导程序样式
WPF TreeView引导程序样式
提问于 2018-09-13 19:39:29
可以像这样设计https://www.phpflow.com/demo/bootstrap_treeview_example_demo的TreeView吗？我试着设计它的样式，但我在第二层崩溃了(在图片上是名为Mobile的项目)。
<TreeView >
<TreeViewItem Header="Electronics">
<TreeViewItem Header="Mobile">
<TreeViewItem Header="Samsung"/>
<TreeViewItem Header="Apple"/>
</TreeViewItem>
<TreeViewItem Header="Laptop">
<TreeViewItem Header="Keyboard" />
<TreeViewItem Header="Computer Peripherals">
<TreeViewItem Header="Printers"/>
<TreeViewItem Header="Monitor"/>
</TreeViewItem>
<TreeViewItem Header="Dell" />
</TreeViewItem>
</TreeViewItem>
<TreeViewItem Header="Single Menu Item" />
<TreeViewItem Header="Other" />
</TreeView>如何制作像Bootsrtap示例中那样的菜单？我尝试过这种样式，但我无法缩进较低的菜单项。
<Style TargetType="TreeViewItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TreeViewItem">
<Grid Margin="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Border Name="Bd"
Background="#8c8c8c"
BorderBrush="LightGray"
BorderThickness="0.6"
CornerRadius="7"
Padding="0"
SnapsToDevicePixels="True">
<Grid>
<Expander Name="Exp" IsExpanded="{TemplateBinding TreeViewItem.IsExpanded}">
<Expander.Header>
<ContentPresenter ContentSource="Header" />
</Expander.Header>
<ItemsPresenter />
</Expander>
<ContentPresenter Name="CntPres"
ContentSource="Header"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Visibility="Collapsed" />
</Grid>
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="TreeViewItem.HasItems" Value="false">
<Setter
TargetName="Exp"
Property="Visibility"
Value="Collapsed" />
<Setter
TargetName="CntPres"
Property="Visibility"
Value="Visible" />
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="Cyan"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>回答 2
Stack Overflow用户
回答已采纳
发布于 2018-09-18 23:44:29
Stack Overflow用户
发布于 2018-09-18 03:24:14
问题是您没有在ItemsPresenter控件上设置边距。只需将Expander控件中的<ItemsPresenter />替换为<ItemsPresenter Margin="19,0,0,0" />，就会看到它的神奇之处！
它会自动添加嵌套子元素的边距。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52312952
复制相关文章
相似问题