1

次のようなテキストボックスを複製しようとしています:

ドロップ シャドウ付きのテキスト ボックス

テキスト ボックスの外側の背景は、親コンテナーによって処理されます。

私の知る限り、世話をする必要がある4つの項目があります。

  • 角を丸くする
  • 上部と右側に内側のドロップ シャドウを追加する
  • 左側と下部に外側のドロップ シャドウを追加する
  • 影の効果を継承するテキスト ボックス内のテキストを回避します。

WPF の角の丸いテキスト ボックスとhttp://www.codeproject.com/Articles/225076/Creating-Inner-Shadows-for-WPF-and-Silverlightからコードを借用しましたが、WPF を十分に把握していません。これを行う。

現在のコード:

<Window x:Class="Test.TestWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Window.Resources>
    <ControlTemplate x:Key="TextBoxBaseControlTemplate" TargetType="{x:Type TextBoxBase}">
        <Border Background="{TemplateBinding Background}" 
            x:Name="Bd" BorderBrush="Black"
            BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="8"
                ClipToBounds="True">
            <Border Background="Transparent" BorderBrush="Black" BorderThickness="0,10,10,0" Margin="0,-11,-11,0">
                <Border.Effect>
                    <DropShadowEffect ShadowDepth="0" BlurRadius="8"/>
                </Border.Effect>
                <ScrollViewer x:Name="PART_ContentHost"/>
            </Border>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" TargetName="Bd"/>
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
            </Trigger>
            <Trigger Property="Width" Value="Auto">
                <Setter Property="MinWidth" Value="100"/>
            </Trigger>
            <Trigger Property="Height" Value="Auto">
                <Setter Property="MinHeight" Value="20"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
</Window.Resources>
<Grid>
    <TextBox Template="{StaticResource TextBoxBaseControlTemplate}" Height="25" Margin="5">
        Text
    </TextBox>
</Grid>
</Window>

これは次のようにレンダリングされます。

現在のコード

問題は、ドロップ シャドウが右上の丸い角の外側にあることです。テキストは影付きです。左と下の外側に影を追加する方法がわかりません。

外すと

CornerRadius="8"

BorderThickness から、内側に影のある長方形を取得します。

私はこれを解決する方法についての指針を受け入れています。

4

1 に答える 1

0

を持つBackgroundに null または透明以外を入れます。そうしないと、それに含まれるすべての要素もドロップシャドウを取得します。また、 のDirectionプロパティをいじって、さまざまな角度で影を取得します。BorderDropShadowEffectDropShadowEffect

于 2012-11-06T03:09:31.523 に答える