Question

我习惯于慢慢设置样式，特别是在模板（DataTemplates，Templates，ControlTemplates等）方面。

然而，我迷失了

我正在尝试将我的TabItem全部变为白色（我还没有触发器，因此所选项目将不会显示），并且内容为灰色。整个事情是无边界。

我正在关注MSDN example，我的精简版本是

<TabControl ItemsSource="{Binding Tabs}" SelectedItem="{Binding SelectedTab, UpdateSourceTrigger=PropertyChanged}" Margin="20">
            <TabControl.Resources>
                <Style TargetType="{x:Type TabControl}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type TabControl}">
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="*"></RowDefinition>
                                    </Grid.RowDefinitions>
                                    <Border Background="Red">
                                        <ContentPresenter x:Name="PART_SelectedContentHost"
                          Margin="4"
                          ContentSource="SelectedContent" />
                                    </Border>

                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
                <Style TargetType="{x:Type TabItem}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type TabItem}">
                                <Grid>

                                        <ContentPresenter x:Name="ContentSite"
                          VerticalAlignment="Center"
                          HorizontalAlignment="Center"
                          ContentSource="Header"
                          Margin="12,2,12,2"
                          RecognizesAccessKey="True" />
                                </Grid>

                            </ControlTemplate>

                        </Setter.Value>
                    </Setter>
                </Style>
            </TabControl.Resources>
        </TabControl>

我的WPF只在屏幕上显示一条细红线。

我正在使用MVVM方法，所以我可以看到虽然我将ItemsSource设置为一个名为Tabs的属性，但我没有在其他地方定义它。我绑定的Tabs都有一个名为Title的属性。应在TabItem标题

中查看此标题

所以，我尝试更新以下内容（在TabItem样式中）

<ContentPresenter Content="{Binding Title}" />

没有区别。

与MSDN文章相比，我无法看到我应该做什么，也无法看到我出错的地方。

我的最终目标是拥有类似的东西（非选定的TabItems是白色的（我知道我可以使用触发器），TabPanel是白色的，内容是灰色的）。模糊的位是标题（文本）：

enter image description here

我的问题是，如何显示Title属性并从默认TabControl的TabItem中删除边框

Answer 1

如果您要重新定义TabItem.Template应该是什么样的内容，您应该只为TabItem属性提供一个值...我猜你只想要一个正常{{1} }}。不要试图定义新的TabItem来绑定您的ControlTemplate属性，而只需将其设置为Title值：

TabItem.Header

Answer 2

<TabControl ItemsSource="{Binding Tabs}" SelectedItem="{Binding SelectedTab, UpdateSourceTrigger=PropertyChanged}" Margin="20">
            <TabControl.Resources>
                <Style TargetType="{x:Type TabControl}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type TabControl}">

                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto"></RowDefinition>
                                        <RowDefinition Height="*"></RowDefinition>
                                    </Grid.RowDefinitions>
                                    <Border Background="White">
                                        <TabPanel Name="HeaderPanel"
                                            Grid.Row="0"
                                            Panel.ZIndex="1" 
                                            Margin="0" 
                                            IsItemsHost="True"
                                            KeyboardNavigation.TabIndex="1"
                                            HorizontalAlignment="Left"/>
                                    </Border>
                                    <Border Background="Teal" Grid.Row="1">
                                        <ContentPresenter ContentSource="SelectedContent"></ContentPresenter>
                                    </Border>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="Background" Value="#FFF3F3F3"></Setter>
                    <Setter Property="BorderThickness" Value="0" />
                </Style>
                <Style TargetType="{x:Type TabItem}" >
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type TabItem}">
                                <Grid>
                                        <ContentPresenter Content="{Binding Title}" Margin="20,0,20,0"  />
                                </Grid>

                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsSelected" Value="True">
                                        <Setter Property="Background" Value="Orange" />
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>

                        </Setter.Value>
                    </Setter>
                    <!--<Setter Property="Background" Value="White"></Setter>
                    <Setter Property="Header" Value="{Binding Title}" />
                    <Setter Property="BorderThickness" Value="0" />


                </Style>
                 </TabControl.Resources>
        </TabControl>

另外，请确保您使用的是MVVM，您是否为每个View / ViewModel分类了DataTemplate，否则它（内容）不会有高度，并且看起来好像不存在！< / p>

无法设置我的TabControl样式

2 个答案: