1

タブを左に回転させた WPF TabControl コントロールを作成する必要があります。

私がオンラインで見つけたリソースは、TabControl に次の 2 つのことを適用することでこれを実行できることを示唆しています。

<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 クラスを確認できます。たとえば、画像のぼやけを減らすために使用されたthis ( Image in WPF gets Blurry ) を参照してください。

于 2012-09-26T09:25:57.960 に答える
1

Border または TabControl タグにSnapsToDevicePixels="True"andを追加してみてください。UseLayoutRounding="True"これらは、ほとんどの場合、ぼやけの問題を解決しました。
このコード スニペットをお勧めします。

<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 に答える