Gewusst wie: Erstellen von Text mit einem Schatten

Aktualisiert: August 2010

Die Beispiele in diesem Abschnitt zeigen, wie Sie einen Schatteneffekt für angezeigten Text erstellen.

Beispiel

Das DropShadowEffect-Objekt ermöglicht es Ihnen, eine Vielzahl von Schlagschatteneffekten für Objekte in Windows Presentation Foundation (WPF) zu erstellen. Das folgende Beispiel zeigt einen Text, auf den ein Schlagschatteneffekt angewendet wurde. In diesem Fall handelt es sich bei dem Schatten um einen weichgezeichneten Schatten, was eine Weichzeichnung der Schattenfarbe bedeutet.

Beispiel für Text mit einem weichgezeichneten Schatten

Sie können die Breite eines Schattens steuern, indem Sie die ShadowDepth-Eigenschaft festlegen. Ein Wert von 4.0 gibt eine Schattenbreite von 4 Pixel an. Indem Sie die BlurRadius-Eigenschaft ändern, können Sie die Intensität des weichgezeichneten Schattens ändern. Mit dem Wert 0.0 wird angegeben, dass keine Weichzeichnung festgelegt ist. Im folgenden Codebeispiel wird das Erstellen eines weichgezeichneten Schattens veranschaulicht.

<!-- Soft single shadow. -->
<TextBlock
  Text="Shadow Text"
  Foreground="Teal">
  <TextBlock.Effect>
    <DropShadowEffect
      ShadowDepth="4"
      Direction="330"
      Color="Black"
      Opacity="0.5"
     BlurRadius="4"/>
  </TextBlock.Effect>
</TextBlock>

Hinweis
Diese Schatteneffekte durchlaufen nicht die Textrenderingpipeline von Windows Presentation Foundation (WPF).Aus diesem Grund wird ClearType bei der Verwendung dieser Effekte deaktiviert.

Im folgenden Beispiel wird ein Text angezeigt, auf den ein Schlagschatteneffekt mit scharfer Kontur angewendet wurde. In diesem Fall wird der Schatten nicht weichgezeichnet.

Beispiel für Schlagschatten mit scharfer Kontur

Sie können einen Schlagschatten mit scharfer Kontur erstellen, indem Sie die BlurRadius-Eigenschaft auf 0.0 festlegen. Diese Einstellung gibt an, dass keine Weichzeichnung verwendet wird. Wenn Sie die Richtung des Schattens steuern möchten, ändern Sie die Direction-Eigenschaft. Legen Sie den Richtungswert dieser Eigenschaft auf einen Wert zwischen 0 und 360 Grad fest. In der folgenden Abbildung sind die Richtungswerte zum Einstellen der Direction-Eigenschaft dargestellt.

Richtungsdiagramm für DropShadow

Im folgenden Codebeispiel wird das Erstellen eines Schattens mit scharfer Kontur veranschaulicht.

<!-- Hard single shadow. -->
<TextBlock
  Text="Shadow Text"
  Foreground="Maroon">
  <TextBlock.Effect>
    <DropShadowEffect
      ShadowDepth="6"
      Direction="135"
      Color="Maroon"
      Opacity="0.35"
      BlurRadius="0.0" />
  </TextBlock.Effect>
</TextBlock>

Verwenden eines Weichzeichnereffekts

Ein BlurBitmapEffect wird zum Erstellen eines schattenähnlichen Effekts verwendet, der hinter einem Textobjekt platziert werden kann. Wenn Sie einen Bitmap-Weichzeichnereffekt auf einen Text anwenden, wird der Text in alle Richtungen gleichmäßig weichgezeichnet.

Im folgenden Beispiel wird ein Weichzeichnereffekt auf einen Text angewendet.

Beispiel für Text mit einem Weichzeichnereffekt

Im folgenden Codebeispiel wird das Erstellen eines Weichzeichnereffekts veranschaulicht.

<!-- Shadow effect by creating a blur. -->
<TextBlock
  Text="Shadow Text"
  Foreground="Green"
  Grid.Column="0" Grid.Row="0" >
  <TextBlock.Effect>
    <BlurEffect
      Radius="8.0"
      KernelType="Box"/>
  </TextBlock.Effect>
</TextBlock>
<TextBlock
  Text="Shadow Text"
  Foreground="Maroon"
  Grid.Column="0" Grid.Row="0" />

Verwenden von TranslateTransform (Verschieben einer Transformation)

Ein TranslateTransform wird für die Erstellung eines schattenähnlichen Effekts verwendet, der hinter einem Textobjekt platziert werden kann.

Im folgenden Codebeispiel wird ein TranslateTransform verwendet, um Text zu versetzen. In diesem Beispiel wird ein Schatteneffekt erzielt, indem die Kopie des Textes hinter dem primären Text geringfügig versetzt wird.

Beispiel für Text mit einer Transformation für einen Schatteneffekt

Das folgende Codebeispiel zeigt, wie eine Transformation für einen Schatteneffekt erstellt wird.

<!-- Shadow effect by creating a transform. -->
<TextBlock
  Foreground="Black"
  Text="Shadow Text"
  Grid.Column="0" Grid.Row="0">
  <TextBlock.RenderTransform>
    <TranslateTransform X="3" Y="3" />
  </TextBlock.RenderTransform>
</TextBlock>
<TextBlock
  Foreground="Coral"
  Text="Shadow Text"
  Grid.Column="0" Grid.Row="0">
</TextBlock>

Änderungsprotokoll

Datum	Versionsgeschichte	Grund
August 2010	Für die neuen Effect-Klassen aktualisiert.	Korrektur inhaltlicher Fehler.