0

TabControl のビジュアル デザインのテンプレートを次のように作成しようとしています。

TabControl コンテンツ領域は、TabItems の上に小さな影を持つ必要があります

ただし、アクティブなタブ項目に影を適用しないでください

問題は、これらのテンプレートを個別のスタイルとしてしか記述できないことです。つまり、グリッドを使用すると、それらは異なるグリッドになってしまい、Zindex を変更して TabItem を 1 つだけ影の上にポップアウトさせることはできません。

Border を使用して影を適用しています

<Border BorderThickness="0" >
  <Border.Effect>
    <DropShadowEffect Direction="90" ShadowDepth="1" Color="#b6b6b6" />
  </Border.Effect>
</Border>

ここに画像の説明を入力

4

2 に答える 2

1

背景色を TabItem のグラデーションに変更すると、似たような結果が得られます。

<Style TargetType="TabItem">
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="False">
            <Setter Property="Background">
                <Setter.Value>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                        <GradientStop Color="#eeeeee" Offset="0.0"/>
                        <GradientStop Color="#eeeeee" Offset="0.6"/>
                        <GradientStop Color="#b6b6b6" Offset="1"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>
于 2013-07-16T10:28:21.017 に答える