C# XAML选项卡控制边界问题
我正在尝试制作一个自定义的C# XAML选项卡控制边界问题,c#,wpf,xaml,border,C#,Wpf,Xaml,Border,我正在尝试制作一个自定义的TabControl，该控件支持滚动，但保留了TabControl的原始外观，但它滚动的情况除外 首先，我选择编辑使用的原始模板TabControl的副本 然后我在选项卡面板周围放置了一个ScrollViewer。但是，这导致了一个小问题，即当选项卡被选中时，它们的底部有一个边框。通过比较图中正常的TabControl和样式化的TabControl可以看出这一点 起初我假设这是滚动查看器的z索引，但在尝试不同的值并确保滚动查看器的z索引和TabPanel都明显高于边框的
TabControlTabControlTabControl选项卡面板ScrollViewerTabControlTabControlTabPanel边框的z索引后，这没有什么区别
如果所选选项卡的底部没有边框，而它被包装在滚动查看器中，如何实现相同的效果
MainWindow.xaml
您可以尝试此操作，以获得蓝色背景的自定义圆形选项卡
至于滚动，scrollviewer应该完成这项工作
<TabControl.Resources>
<Style TargetType="TabItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TabItem">
<Border Name="Border" BorderThickness="1,1,1,1" CornerRadius="4,4,0,0" Margin="2,0" Background="#252e37">
<ContentPresenter x:Name="ContentSite"
VerticalAlignment="Center"
HorizontalAlignment="Center"
ContentSource="Header"
Margin="10,2"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter TargetName="Border" Property="Background" Value="LightSkyBlue" />
</Trigger>
<Trigger Property="IsSelected" Value="False">
<Setter TargetName="Border" Property="Background" Value="GhostWhite" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</TabControl.Resources>
因此，如果我们去看看一个ScrollViewer
注意那里有一个边框
，上面有一个设定的颜色，这就是您看到的工件
我们可以进入并编辑ScrollViewer的样式模板，然后将其删除……或者在本例中，我们可以让它保留其边框，并覆盖样式继承，以便在模板中执行以下操作：
<ScrollViewer ...>
<ScrollViewer.Resources>
<Color x:Key="BorderMediumColor">#FFFFFFFF</Color>
</ScrollViewer.Resources>
....
</ScrollViewer>
请参阅链接。我认为上述链接解决了您的问题。@Gokul感谢您的链接。我会调查的。不过，快速浏览一下，它似乎使用了设置的行大小和一些可以打破TabStripPlacement
属性行为的东西。显然，它可能会被修改以与这个想法一起工作。谢谢你的回答。但是，我确实相信默认的ScrollViewer
模板不包含边框。我很好奇这个边框是从哪里来的。我会打开一个默认模板，但不幸的是，我不再在.net/xaml商店工作，回家后可能会看一眼。谢谢。在我最初的问题中，我谈到了zindex，我仍然认为这是原因所在。我相信边框来自默认的TabControl
样式中的边框，该样式的名称为contentPanel
，然后当选择一个选项卡时，由于它的zindex较高，它会遮挡边框。这可以看出，如果改变的zindex被删除，然后它看起来和我的一样。我只是不明白为什么在scrollviewer中包装它会影响itAh ok，所以有两件事。我会对你设置的选项卡项.Selected.Border
颜色感到好奇，如果你不能将选项卡面板上的边距更改为margin=“2,2,2，-1”
，那么它会快速移动到那一行上…@Dan fair，完成了，完成了，祝你周末愉快！谢谢你的回答，但是除了改变标签的外观外，这没有什么区别
<ScrollViewer ...>
<ScrollViewer.Resources>
<Color x:Key="BorderMediumColor">#FFFFFFFF</Color>
</ScrollViewer.Resources>
....
</ScrollViewer>
<Window x:Class="ScrollableTabControl.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Window.Resources>
<SolidColorBrush x:Key="TabItem.Selected.Background" Color="#FFFFFF"/>
<SolidColorBrush x:Key="TabItem.Selected.Border" Color="#ACACAC"/>
<Style x:Key="TabControlStyle1" TargetType="{x:Type TabControl}">
<Setter Property="Padding" Value="2"/>
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Background" Value="{StaticResource TabItem.Selected.Background}"/>
<Setter Property="BorderBrush" Value="{StaticResource TabItem.Selected.Border}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TabControl}">
<Grid x:Name="templateRoot"
ClipToBounds="true"
SnapsToDevicePixels="true"
KeyboardNavigation.TabNavigation="Local"
UseLayoutRounding="True"> <!-- Gets rid of pixel rounding errors which cause small bugs when window is a certain size -->
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="ColumnDefinition0"/>
<ColumnDefinition x:Name="ColumnDefinition1" Width="0"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition x:Name="RowDefinition0" Height="Auto"/>
<RowDefinition x:Name="RowDefinition1" Height="*"/>
</Grid.RowDefinitions>
<ScrollViewer VerticalScrollBarVisibility="Auto"
HorizontalScrollBarVisibility="Auto"
Grid.Column="0"
Grid.Row="0"
Panel.ZIndex="1"
Margin="0, 0, 0, -1.25"
Background="Transparent"> <!-- +- 1.25 seems to be required when mixed with the ZIndex to hide the border underneath the selected tab -->
<TabPanel IsItemsHost="true"
Margin="2,2,2,1.25"
Background="Transparent"
KeyboardNavigation.TabIndex="1"
x:Name="headerPanel"/>
</ScrollViewer>
<Border x:Name="contentPanel"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}"
Grid.Column="0"
KeyboardNavigation.DirectionalNavigation="Contained"
Grid.Row="1"
KeyboardNavigation.TabIndex="2"
KeyboardNavigation.TabNavigation="Local">
<ContentPresenter x:Name="PART_SelectedContentHost"
ContentSource="SelectedContent"
Margin="{TemplateBinding Padding}"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TabControl Margin="5"
Grid.Row="0">
<TabItem Header="Tab 1"/>
<TabItem Header="Tab 2"/>
<TabItem Header="Tab 3"/>
</TabControl>
<TabControl Margin="5"
Grid.Row="1"
Style="{DynamicResource TabControlStyle1}">
<TabItem Header="Tab 1"/>
<TabItem Header="Tab 2"/>
<TabItem Header="Tab 3"/>
</TabControl>
</Grid>
</Window>