Question

我想在这个项目（https://github.com/thielj/MetroFramework）中实现一个tabcontrol样式。不幸的是，metroframework项目仅适用于winforms。

有人可以帮助我在xaml中设置这个样式吗？

如果我有蓝色/灰色线分隔tabitem和tabcontent的样式，那么我会有很多帮助。

提前致谢。

Answer 1

首先创建两个ResourceDictionary来存储新模板，一个用于TabControl，另一个用于TabItem，并将它们命名为TabControlTemplate.xaml和TabItemTemplate.xaml
右键点击TabControl和TabItem，然后选择Edit Template > Edit a copy...，为上述控件创建默认模板的副本。然后选择您的样式名称MetroLikeTabControl和MetroLikeTabItem，并为每个模板设置目标资源字典。 Visual Studio在所选文件中创建该模板的副本。

在TabControlTemplate.xaml中将此setter标记添加到控件样式中：

<Setter Property="ItemContainerStyle" Value="{DynamicResource MetroLikeTabItem}" />

然后更改模板的这一部分：

<TabPanel Grid.Row="0" Grid.Column="0" x:Name="HeaderPanel" 
          Margin="2,2,2,0" Panel.ZIndex="1"
          Background="Transparent" IsItemsHost="True" KeyboardNavigation.TabIndex="1" />

到这个新的：

<Grid Grid.Row="0" Grid.Column="0">
      <Border BorderThickness="0 0 0 2" BorderBrush="Gray" />
      <TabPanel x:Name="HeaderPanel" Margin="2,2,2,0" Panel.ZIndex="1"
                Background="Transparent" IsItemsHost="True" KeyboardNavigation.TabIndex="1" />
</Grid>

这会添加一个只有底部粗细的边框，并使TabPanel的边框与TabItem的边框重叠（为什么只有底边？因为我在{{1时实现了你想要的} TabControl属性设置为TabStripPlacement。您可以设置触发器来实现所有其他状态。

在Top为名称为TabItemTemlate.xaml的元素设置BorderBrush = "0 0 0 2"并删除innerBorder属性。
然后根据需要更改Opacity = "0"，IsMouseOver = true和IsSelected = true的样式。这是我编辑的选定状态触发器，可将IsSelected = false (default style of a TabItem)的内容和TabItem的颜色更改为蓝色。
```
Border
```

Metro选项卡控件样式WPF

1 个答案: