WPF tabcontrol tabitem 标题
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12425457/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
WPF tabcontrol tabitem header
提问by klashagelqvist
I have styled the tabitem in a tabcontrol as such
我已经在 tabcontrol 中设置了 tabitem 的样式
<Style x:Key="TabHeaderStyle" TargetType="{x:Type TabItem}">
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate >
<Grid HorizontalAlignment="Stretch" Height="22">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="2" ></RowDefinition>
<RowDefinition Height="Auto" ></RowDefinition>
</Grid.RowDefinitions>
<Rectangle Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem} }, Path=Content.DataContext.HeaderColor}" Grid.ColumnSpan="2"></Rectangle>
<TextBlock Grid.Row="1" Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem} }, Path=Content.DataContext.HeaderInfo}"
VerticalAlignment="Bottom" Margin="4,0,8,0"/>
<Button Grid.Row="1" Grid.Column="1" Content="x" ToolTipService.ToolTip="Close this view." BorderBrush="{x:Null}" Background="{x:Null}" Foreground="#FF224A71" VerticalAlignment="Center" Padding="3,0">
<Button.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#4BFFFFFF" Offset="1"/>
</LinearGradientBrush>
</Button.OpacityMask>
<ei:Interaction.Triggers>
<ei:EventTrigger EventName="Click">
<Controls:CloseTabbedViewAction />
</ei:EventTrigger>
</ei:Interaction.Triggers>
</Button>
</Grid>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
The tabitem look ok when i have a couple of tabs open like this
当我像这样打开几个选项卡时，tabitem 看起来不错
This look ok with the "x" , close view right aligned. My problem is that when i open more tabs, the standard tabcontrol functionallity is to add a row when there is to little space for the tabs. When this happens the tabitems are resized but it does not seem that they notify the childcontrols because the tabs look like this
这看起来与 "x" 一致，关闭视图右对齐。我的问题是，当我打开更多选项卡时，标准的 tabcontrol 功能是在选项卡空间很小时添加一行。发生这种情况时，tabitems 会调整大小，但它们似乎没有通知 childcontrols，因为选项卡看起来像这样
Notice that the "x" is not right aligned as before. I have tried to base the datatemplate on both grid and stackpanel with different style to no avail. Anyone knows how i will get the "x" button right aligned even when i have multiple rows of tabs.
请注意，“x”不像以前那样右对齐。我试图将数据模板建立在具有不同样式的网格和堆栈面板上，但无济于事。任何人都知道如何让“x”按钮右对齐，即使我有多行选项卡。
回答by Ross
Your Grid's ColumnDefinitionswill limit their width (Automeans automatically size to content)
你Grid的ColumnDefinitions将限制它们的宽度（Auto意味着根据内容自动调整大小）
Instead try:
而是尝试：
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
(Also, I don't know if will make a difference, but in my TabItemstyles I usually set the Templatewith a ControlTemplate, rather than set the HeaderTemplatewith a DataTemplateas you are doing)
（另外，我不知道是否会有所作为，但在我的TabItem风格中，我通常将Templatea设置为ControlTemplate，而不是像您那样设置HeaderTemplatewith a DataTemplate）
回答by Raúl Ota?o
Try this in your TabItem template...
在您的 TabItem 模板中试试这个...
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
Let me know if it solves your problem. I cant test your code here.
让我知道它是否能解决您的问题。我无法在这里测试您的代码。
