1

我需要创建一个带有向左旋转选项卡的 WPF TabControl 控件。

我在网上找到的资源表明,这可以通过将以下两件事应用于 TabControl 来完成:

<Setter Property="LayoutTransform">
   <Setter.Value>
     <RotateTransform Angle="270"/>
   </Setter.Value>
</Setter>

<TabControl TabStripPlacement="Left" ...


所有这些都有效,并且选项卡根据需要显示,但由于某种原因,选项卡中的标题文本在旋转后显得模糊,请说明为什么会发生这种情况,如果我能做些什么来解决这个问题。

完整的 XAML:

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TabControl BorderBrush="Gray" BorderThickness="1" TabStripPlacement="Left">
            <TabControl.ItemContainerStyle>
                <Style TargetType="{x:Type TabItem}">
                    <Setter Property="LayoutTransform">
                        <Setter.Value>
                            <RotateTransform Angle="270"/>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="Template">
                        <Setter.Value>                            
                            <ControlTemplate TargetType="{x:Type TabItem}">
                                <Grid>
                                    <Border Name="Border" BorderBrush="Gray" BorderThickness="1" CornerRadius="6,6,0,0">
                                        <ContentPresenter x:Name="ContentSite"
                                        VerticalAlignment="Center" HorizontalAlignment="Center" 
                                        ContentSource="Header" Margin="12,2,12,2"/>
                                    </Border>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </TabControl.ItemContainerStyle>
            <TabItem Header="Item 1" />
            <TabItem Header="Item 2" />
            <TabItem Header="Item 3" />
        </TabControl>
    </Grid>
</Window>

在此处输入图像描述

4

3 回答 3

17

将以下属性添加到窗口声明 XAML

TextOptions.TextFormattingMode="Display"
TextOptions.TextRenderingMode="ClearType"
UseLayoutRounding="true"
于 2012-09-26T10:44:51.593 回答
2

您可以查看控制对象渲染行为的 RenderOptions 类。例如看到这个(WPF 中的图像变得模糊),它用于减少图像的模糊。

于 2012-09-26T09:25:57.960 回答
1

尝试将SnapsToDevicePixels="True"和添加UseLayoutRounding="True"到您的 Border 或 TabControl 标签。在大多数情况下,这些解决了我的模糊问题。
我建议这个代码片段:

<TabControl TabStripPlacement="Left" Margin="5"  FontSize="13" FontFamily="Verdana" Grid.ColumnSpan="2" SnapsToDevicePixels="True" UseLayoutRounding="True" >
                        <TabControl.Resources>
                            <Style TargetType="{x:Type TabItem}">
                                <Setter Property="BorderThickness" Value="0"/>
                                <Setter Property="Padding" Value="0" />
                                <Setter Property="HeaderTemplate">
                                    <Setter.Value>
                                        <DataTemplate>
                                            <Border x:Name="grid" Margin="0" >
                                                <Border.LayoutTransform>
                                                    <RotateTransform Angle="270" ></RotateTransform>
                                                </Border.LayoutTransform>
                                                <ContentPresenter>
                                                    <ContentPresenter.Content>
                                                        <TextBlock FontFamily="Verdana"   Margin="4"  Text="{TemplateBinding Content}">

                                                        </TextBlock>

                                                    </ContentPresenter.Content>
                                                </ContentPresenter>
                                            </Border>
                                        </DataTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </TabControl.Resources>
                        <TabItem Name="General"   Header="YourHeader"  > ..
于 2012-09-26T09:40:19.937 回答