Festlegen von Farben, Pinseln und Masken

Das Ändern der visuellen Darstellung von Objekten ist eine wesentliche Aufgabe in Microsoft Expression Blend. Mithilfe der Eigenschaften, die im Eigenschaftenpanel unter Darstellung und Pinsel verfügbar sind, können Sie die Strich- und Füllfarbe, die Deckkraft und die Sichtbarkeit von ausgewählten Objekten ändern. Je nach Typ des im Expression Blend-Projekt ausgewählten Objekts werden die Eigenschaften der Kategorien Darstellung und Pinsel dynamisch an den Inhalt des Objekts angepasst, um die entsprechenden optischen Attribute widerzuspiegeln.

Allgemeine Darstellungseigenschaften

Die gängigste visuelle Veränderung von Objekten ist das Anwenden von Pinseln auf bestimmte Eigenschaften. In der folgenden Tabelle werden diese Eigenschaften beschrieben.

Eigenschaft

Beschreibung

Füllung

Legt den Pinsel fest, der auf das Innere einer Form oder eines Pfads angewendet wird.

Stroke

Legt den Pinsel fest, der auf die Konturen (Rahmen) einer Form oder eines Pfads angewendet wird.

Background

Legt den Pinsel fest, der auf den Hintergrund eines Objekts angewendet wird. Diese Eigenschaft wird normalerweise auf den Hintergrund von Steuerelementen angewendet, die Text anzeigen, beispielsweise auf den Hintergrund von Button- oder TextBlock-Steuerelementen.

Foreground

Legt den Pinsel fest, der auf den Vordergrund eines Objekts angewendet wird. Diese Eigenschaft wird normalerweise auf den in Steuerelementen angezeigten Text angewendet, beispielsweise auf den Text in Button- oder TextBlock-Steuerelementen.

BorderBrush

Legt den Pinsel fest, der auf den Rahmen von bestimmten Steuerelementen angewendet wird.

Opacity

Legt die Deckkraft für das gesamte Objekt fest.

Sichtbarkeit

Bestimmt, ob ein Objekt zur Laufzeit sichtbar oder ausgeblendet ist. Untergeordnete Objekte können auch durch die Sichtbarkeitseinstellung des übergeordneten Elements beeinflusst werden.

OpacityMask

Legt einen Pinsel fest, dessen Farbe ignoriert und dessen Deckkraft auf das maskierte Objekt übertragen wird. Wenn die Deckkraftmaske deckend ist, wird das maskierte Objekt deckend; wenn die Deckkraftmaske transparent ist, wird das maskierte Objekt transparent.

Pinsel

Pinsel werden zum Festlegen der grafischen Darstellung eines Objekts auf der Zeichenfläche verwendet. Sie können z. B. einen Pinsel mit blauer Volltonfarbe für die Füllung eines Rechtecks verwenden (wie im ersten Bild unten). Pinsel sind in verschiedenen Formen verfügbar, angefangen bei einfachen Pinseln mit Volltonfarbe oder Farbverlaufspinseln bis hin zu komplexeren Kacheleffekten. In der folgenden Tabelle werden die in Expression Blend verfügbaren Pinsel beschrieben. Darüber hinaus können Sie über die Registerkarte Kein PinselCc294765.706bbd5c-c0e0-43a1-9604-297f019d0275(DE-DE,Expression.30).png alle Farben aus der ausgewählten Eigenschaft entfernen. Sie können beispielsweise die Fill-Eigenschaft (Füllung) des Rechtecks auf Kein Pinsel einstellen, und die Stroke-Eigenschaft (Strich) auf Pinsel mit Volltonfarbe, um einen Umriss für ein Rechteck zu erzeugen.

Pinsel

Darstellung

Beschreibung

Pinsel mit Volltonfarbe

Cc294765.b83764e5-b1f6-4a94-b75b-7513bef1a430(DE-DE,Expression.30).png

Besteht aus einer einzigen Farbe.

Linearer Farbverlaufspinsel

Cc294765.50efa3cf-d265-4ea4-af0f-bdcaed4d15fa(DE-DE,Expression.30).png Cc294765.4f1dddeb-7c03-449d-8199-0fa82122f4b2(DE-DE,Expression.30).png

Besteht aus einem linearen Farbverlauf.

Radialer Farbverlaufspinsel

Cc294765.c02b5484-1814-40d7-9bd8-1fa88f76fab8(DE-DE,Expression.30).png Cc294765.c66dd0d9-ce5a-4c6c-9621-7b3cc16a9429(DE-DE,Expression.30).png

Besteht aus einem radialen Farbverlauf.

Bildpinsel

Cc294765.81f84f56-906d-456b-8288-d77da1e01e31(DE-DE,Expression.30).png Cc294765.d3782ca8-64da-47a4-a095-c6cdd0fa47a2(DE-DE,Expression.30).png Cc294765.38ae3691-f3f1-4a1e-82ca-c7fa164bf56e(DE-DE,Expression.30).png

Wird basierend auf einem Bild erstellt. Von links nach rechts: der Bildpinsel im Ausgangszustand, der Bildpinsel mit Kacheleffekt und der gekippte Bildpinsel.

Zeichenpinsel

Cc294765.197666ac-ef57-4c5c-9779-669e991a00a5(DE-DE,Expression.30).png Cc294765.ba09cda3-4cee-40ba-b3d4-edc032158bdc(DE-DE,Expression.30).png Cc294765.15bf6021-620c-4490-9eae-086153d3f14f(DE-DE,Expression.30).png

Wird basierend auf einer Vektorzeichnung erstellt. Von links nach rechts: der Zeichenpinsel im Ausgangszustand, der Zeichenpinsel mit Kacheleffekt und der gekippte Zeichenpinsel.

Visueller Pinsel

Cc294765.fb6c90e0-153c-48fe-b563-e601beac6227(DE-DE,Expression.30).png Cc294765.e261b99f-7d8f-4d91-bc84-19c7beccc255(DE-DE,Expression.30).png

Wird basierend auf einem Steuerelement, z. B. einer Schaltfläche, erstellt. Von links nach rechts: die Ausgangsschaltfläche und der Pinsel mit der Einstellung Nebeneinander für Kachelmodus. Beachten Sie, dass visuelle Pinsel aufgrund der Komplexität der zu ihrer Erstellung verwendeten Steuerelemente die Leistung der ausgeführten Anwendung beeinträchtigen können.

Pinselressourcen

Nachdem Sie einen Pinsel für ein Objekt erstellt haben, können Sie den Pinsel in eine Ressource konvertieren, die dann auf andere Objekte angewendet werden kann.

Pinselressourcen sind nicht auf einzelne Pinsel- oder Farbeigenschaften beschränkt. Sie können eine Pinselressource mit verschiedenen auf der Zeichenfläche verfügbaren Objekten erstellen. Sie können sogar einen Pinsel namens VisualBrush erstellen, der sein Aussehen während der Laufzeit an Änderungen der Objekte anpasst, mit denen er zur Laufzeit erstellt wurde.

Sie können Ressourcenverzeichnisse für die Pinsel erstellen, sodass sie im gesamten Projekt und sogar in anderen Projekten wiederverwendbar sind.

Weitere Informationen finden Sie unter Erstellen einer Pinsel- oder Farbressource und Konvertieren von Objekten in eine wiederverwendbare Pinselressource.

Weitere Informationen zu Ressourcen finden Sie unter Erstellen von wiederverwendbaren Ressourcen.

Farbe und Farbräume

In Expression Blend steht im Eigenschaftenpanel unter Pinsel ein Farb-Editor zur Verfügung. Der Farb-Editor wird auch angezeigt, wenn Sie eine Pinselressource im Ressourcenpanel bearbeiten. Er verfügt über die folgenden vier Farbräume sowie einen Hexadezimalmodus (#AARRGGBB):

  • RGB   Rot (0-255), Grün (0-255), Blau (0-255).

  • HLS   Farbton (360°-Farbrad), Leuchtkraft (0 bis 100 %), Sättigung (0 bis 100 %).

  • HSB   Farbton (360°-Farbrad), Sättigung (0 bis 100 %), Helligkeit (0 bis 100 %).

  • CMYK   Zyan (0 bis 100 %), Magenta (0 bis 100 %), Gelb (0 bis 100 %, Schwarz (0 bis 100 %).

Wenn Sie den Farbraum wechseln möchten, können Sie auf einen der unterstrichenen Buchstaben im aktuellen Farbraum klicken, um ein Popupmenü der alternativen Farbräume anzuzeigen.

Formatpipette und Füllwerkzeuge

In Expression Blend stehen zwei Werkzeuge zur Verfügung, die speziell für das Kopieren und Anwenden von Attributen auf Objekte konzipiert sind. Wird die Formatpipette oder das Füllwerkzeug verwendet, werden die folgenden Eigenschaften kopiert oder angewendet:

  • Pinsel   Foreground, Background, BorderBrush, Fill, Stroke und OpacityMask

  • Darstellung   Opacity, StrokeThickness, StrokeMiterLimit, StrokeStartLineCap, StrokeEndLineCap, StrokeLineJoin und StrokeDashCap

  • Text   FontFamily, FontSize, FontWeight, FontStyle, TextDecorations, LineHeight, TextIndent und TextAlignment

Cc294765.199cf53a-f100-43f6-9a06-7c9f1a453f39(DE-DE,Expression.30).png

Formatpipette

Kopiert die Darstellungseigenschaften eines anderen Objekts zu dem oder den momentan ausgewählten Objekten.

Cc294765.39a62108-d8d1-4c6b-8d89-8678a055ff36(DE-DE,Expression.30).png

Füllwerkzeug

Kopiert die Darstellungseigenschaften des oder der momentan ausgewählten Objekte zu einem anderen Objekt.

Weitere Informationen zu den Werkzeugen Formatpipette und Füllwerkzeug erhalten Sie unter Kopieren oder Anwenden von Attributen auf ein Objekt.

In der rechten unteren Ecke des Farb-Editors wird ebenfalls eine Farbformatpipette Cc294765.2ab2d2fb-3478-4b33-87fb-3cdeb9df4d52(DE-DE,Expression.30).png angezeigt, wenn Sie einen Pinsel mit Volltonfarbe Cc294765.3a66ec96-47bb-47fc-8876-6b9456feec3a(DE-DE,Expression.30).png oder einen Farbverlaufsstopp auf einem Farbverlaufspinsel Cc294765.91fb0c61-7b3b-4ae7-8a59-760e625e3bd7(DE-DE,Expression.30).png bearbeiten. Bei ausgewählter Formatpipette können Sie an beliebigen Stellen auf Ihrem Desktop ein Farbmuster erfassen und auf den ausgewählten Pinsel anwenden. Über die ESC-TASTE können Sie die Formatpipette jederzeit beenden.

Farbverläufe

Mithilfe von Farbverläufen können Sie einen graduellen Verlauf von Farben auf ein Objekt anwenden, um eine gleichmäßige Farbabstufung zu erzeugen und dem Objekt eine größere Tiefe zu verleihen. Vielleicht möchten Sie dieses Objekt als Hintergrund verwenden, bei dem die linke Seite eine Farbe aufweist und nach rechts allmählich in Weiß übergeht. Auf diese Weise können Sie zwei verschiedene Bereiche eines andernfalls einförmigen Objekts erstellen.

Klicken Sie im Eigenschaftenpanel unter Pinsel auf Linearer FarbverlaufCc294765.bd5eefed-9628-4363-be5d-29bfb5962175(DE-DE,Expression.30).pngund Radialer FarbverlaufCc294765.4279aa9a-15c2-4435-9937-6848afc38618(DE-DE,Expression.30).png, um zwischen den zwei Pinseltypen für Farbverläufe zu wechseln.

Mit den beiden Pinseltypen für Farbverläufe können Sie graduelle Füllungen, Farbverlaufsstriche, Text mit einem Farbverlauf für die Foreground-Eigenschaft (Vordergrund) oder Hintergründe mit Farbverlauf für alle Element mit Background-Eigenschaft (Hintergrund) erstellen. Wenn Sie einen Farbverlauf auf eine Darstellungseigenschaft anwenden, werden auf dem Schieberegler für den Farbverlauf kleine, als Stopps bezeichnete Symbole angezeigt (Cc294765.a3c9e482-e99b-4504-8a02-9507487d1791(DE-DE,Expression.30).png). Sie können die Farbe der einzelnen Farbverlaufsstopps ändern und dem Schieberegler für den Farbverlauf beliebig viele Stopps hinzufügen, indem Sie einfach auf den Schieberegler klicken. Umgekehrt können Sie nicht mehr benötigte Stopps ganz einfach entfernen, indem Sie sie unten aus dem Schieberegler für den Farbverlauf herausziehen. (Wenn Sie sie an den Seiten oder oben herausziehen, werden sie nicht entfernt.)

Sie können auch einige Optionen für den Farbverlaufspinsel festlegen. Klicken Sie im Eigenschaftenpanel unter Pinsel auf Erweiterte Eigenschaftenoptionen Cc294765.de239c9d-42ce-4f5e-83b9-5f9924c0431f(DE-DE,Expression.30).png, um die Eigenschaft SpreadMethod auf eine der folgenden Optionen festzulegen:

  • Auffüllen   Erweitert die Farben der äußeren Farbverlaufsstopps bis zu den Rändern des Objekts.

  • Reflektieren   Spiegelt die Farbverlaufsfüllung.

  • Wiederholen   Wiederholt die Farbverlaufsfüllung.

Diese Optionen gelten sowohl für lineare als auch für radiale Farbverläufe, wenn Sie die Option PinseltransformationCc294765.8dc54a0d-02cc-44cd-b802-5a78309f4503(DE-DE,Expression.30).png zum Bearbeiten des Pinsels verwenden. Weitere Informationen finden Sie im folgenden Abschnitt "Pinseltransformationswerkzeug".

Pinseltransformationswerkzeug

Wenn Sie die Füllung, den Pinselstrich, die Deckkraftmaske oder einen anderen auf ein Objekt angewendeten Pinsel transformieren möchten, wählen Sie im Eigenschaftenpanel die Pinseleigenschaft aus, und wählen Sie dann im Werkzeugpanel das Werkzeug PinseltransformationCc294765.8dc54a0d-02cc-44cd-b802-5a78309f4503(DE-DE,Expression.30).png aus. Auf der Zeichenfläche wird ein Pinseltransformationspfeil angezeigt, den Sie mit dem Mauszeiger ändern können. Wenn Sie einen Farbverlaufspinsel verwenden, entsprechen die Endpunkte des Transformationspfeils den Farbverlaufsstopps an den Enden der Farbleiste. Sie können das Verhalten des Pinseltransformationswerkzeugs folgendermaßen ändern:

  • Halten Sie beim Ziehen eines Endpunkts die UMSCHALTTASTE gedrückt, um die Bewegung auf die gerade Linie zwischen den Endpunkten zu beschränken.

  • Halten Sie beim Verschieben des gesamten Pfeils die UMSCHALTTASTE gedrückt, um die Bewegung auf die X- oder die Y-Ebene zu beschränken.

  • Halten Sie beim Drehen eines Endpunkts die UMSCHALTTASTE gedrückt, um ein Einrasten alle 15 Grad zu ermöglichen.

  • Halten Sie beim Ziehen eines Endpunkts die ALT-TASTE gedrückt, um beide Endpunkte gleichzeitig zu verschieben. Dadurch wird die Position des Mittelpunkts beibehalten.

Die folgenden Bilder zeigen das Aussehen eines rechteckigen Objekts, nachdem verschiedene Transformationen auf den Farbverlaufspinsel der Fill-Eigenschaft angewendet wurden.

Cc294765.ddadfdb4-f9f5-4239-8e56-d04014592af4(DE-DE,Expression.30).png

Transformationen, die auf den linearen Farbverlaufspinsel eines Rechtecks angewendet wurden

Cc294765.06d84067-19a1-4699-af39-18d0b11679a0(DE-DE,Expression.30).png

Transformationen, die auf den radialen Farbverlaufspinsel eines Rechtecks angewendet wurden

Wenn Sie im Eigenschaftenpanel unter Pinsel auf Erweiterte Eigenschaftenoptionen Cc294765.de239c9d-42ce-4f5e-83b9-5f9924c0431f(DE-DE,Expression.30).png klicken, können Sie optional die Ausbreitungsmethode eines Farbverlaufspinsels festlegen, indem Sie die Option für die SpreadMethod-Eigenschaft auswählen. Im vorhergehenden Bild ist die Option Füllen ausgewählt. Wenn Sie die Option Reflektieren oder Wiederholen ausgewählt haben und den Transformationspfeil dann kürzer gemacht haben als das Objekt, erhalten Sie einen Welleneffekt.

Sie können außer Farbverlaufspinseln weitere Pinseltypen transformieren. Weitere Informationen zu Pinseltransformationen finden Sie unter Transformieren eines Farbverlaufspinsels oder Kacheleffekts.

Freistellen

Gelegentlich werden beim Transformieren eines Pinsels Teile des Objekts freigestellt (d. h., Teile außerhalb des Begrenzungsrahmens werden ausgeblendet). Sie können Freistellungsprobleme auf folgende Weise beheben:

  • Deaktivieren Sie im Eigenschaftenpanel unter Darstellung das Kontrollkästchen für die ClipToBounds-Eigenschaft (An Begrenzung freistellen).

  • Verwenden Sie im Eigenschaftenpanel unter Transformation die Eigenschaften der Kategorie LayoutTransform statt die der Kategorie RenderTransform. Dies ist vor allem bei der Transformation von visuellen Pinseln hilfreich.

Striche

Striche sind die Rahmen eines Objekts. Sie können den angewendeten Pinsel (einfarbig, Farbverlauf oder Kacheleffekt), die Deckkraft, die Breite und die Gehrungsgrenze des Strichs eines Objekts sowie die Art der Ecken und Abschlüsse ändern. Der Strich für ein Objekt wird immer über einer Füllung angewendet, auch wenn auf dieses Objekt keine Füllung angewendet wurde. Um den Strich für ein Objekt zu ändern, müssen Sie im Eigenschaftenpanel in der Liste unter Pinsel die Option Strich auswählen.

  • Strichbreite   Die Breite eines Strichs für ein Objekt wird in Pixel (geräteunabhängige Einheit, die ca. 1/96 Zoll beträgt) angegeben. Zulässige Werte liegen im Bereich zwischen 0 und der Hälfte der Breite oder Höhe der Form. Im Allgemeinen bedeckt der Strich die gesamte Füllung, sobald die Strichstärke die Hälfte der Breite und Höhe der Form erreicht hat. Sie können den Wert für die Strichbreite im Eigenschaftenpanel unter Darstellung über die StrokeThickness-Eigenschaft (Strichstärke) festlegen.

  • Ecken   Bei Objekten mit Ecken (z. B. Rechtecken) können Sie die Darstellung des Strichs an den einzelnen Eckpunkten ändern. Sie können eine von drei Ecken anwenden: GehrungsverbindungCc294765.25182a96-9a69-478a-9cfe-5b360e6a9bea(DE-DE,Expression.30).png, abgerundete VerbindungCc294765.05fe4b1d-f584-4bd2-99b6-8bc2d735a89d(DE-DE,Expression.30).png und abgeschrägte VerbindungCc294765.f0c1ff71-7814-42ba-806b-7ea92d616e69(DE-DE,Expression.30).png. Sie können die Eckenart im Eigenschaftenpanel unter Darstellung über die StrokeLineJoin-Eigenschaft (Strichlinienverbindung) festlegen.

    Cc294765.64381b5b-b70f-47a7-b298-4e4f4fe982a6(DE-DE,Expression.30).png

  • Gehrungsgrenze   Steuert, wie lang der Eckpunkt einer Gehrungsgrenze werden kann, bevor er automatisch abgeschrägt wird. Sie können die Gehrungsgrenze im Eigenschaftenpanel unter Darstellung über die StrokeMiterLimit-Eigenschaft (Strichgehrungsgrenze) festlegen. Im folgenden Bild werden drei Winkel mit einer Strichstärke von 40 und einer StrokeMiterLimit-Eigenschaft (Strichgehrungsgrenze) von 1 Cc294765.25182a96-9a69-478a-9cfe-5b360e6a9bea(DE-DE,Expression.30).png, 2,2 Cc294765.05fe4b1d-f584-4bd2-99b6-8bc2d735a89d(DE-DE,Expression.30).png und 4 Cc294765.f0c1ff71-7814-42ba-806b-7ea92d616e69(DE-DE,Expression.30).png angezeigt. Die Größe des Winkels und die Strichstärke bestimmen den visuellen Effekt der Gehrungsgrenze.

    Cc294765.9bed7ef3-df8f-4844-9341-98d3f726f267(DE-DE,Expression.30).png

  • Abschluss   Für Pfade mit nicht verbundenen Enden (z. B. Linien) können Sie die Darstellung der Enden von Strichen anpassen, indem Sie einen von vier Abschlussstilen anwenden: Flache AbschlüsseCc294765.25182a96-9a69-478a-9cfe-5b360e6a9bea(DE-DE,Expression.30).png, Runde AbschlüsseCc294765.05fe4b1d-f584-4bd2-99b6-8bc2d735a89d(DE-DE,Expression.30).png, Gerade AbschlüsseCc294765.f0c1ff71-7814-42ba-806b-7ea92d616e69(DE-DE,Expression.30).png und Dreieckiger AbschlussCc294765.eb6fad93-f17e-4f62-a926-8c8651862891(DE-DE,Expression.30).png. Sie können die Abschlussart im Eigenschaftenpanel unter Darstellung über die Eigenschaft StrokeEndLineCap (Abschluss für Strichendlinie) oder StrokeStartLineCap (Abschluss für Strichanfangslinie) festlegen.

    Cc294765.2e5bbb1b-f631-466d-b510-5a4bf824cc74(DE-DE,Expression.30).png

Deckkraft und Sichtbarkeit

Wenn Sie die Deckkraft eines Objekts verringern, nimmt seine Transparenz zu, sodass hinter dem Objekt liegende Objekte sichtbar werden. Die Deckkraft wird über einen Alphakanal gesteuert, in dem alle Informationen zur Transparenz eines Objekts, eines Farbverlaufs oder einer Deckkraftmaske gespeichert sind. In der folgenden Tabelle werden drei Methoden zum Ändern der Deckkraft von Objekten beschrieben.

Methode

Ergebnisse

Deckkraft   Ändert die Transparenz des gesamten Objekts, einschließlich aller visuellen Attribute. Das Bild rechts zeigt ein Objekt mit einem Deckkraftwert von 60 %.

Cc294765.a5f77efb-94c4-4746-9b51-3fcb35d530a1(DE-DE,Expression.30).png

Transparenz   Legt den Alphawert (A) eines einzelnen Pinselattributs für ein Objekt, z. B. der Füllung oder des Strichs, so fest, dass es leicht transparent dargestellt wird, ohne dass Sie alle Attribute des Objekts ändern müssen. Das Bild rechts zeigt, dass nur die Füllung der Ellipse eine größere Transparenz aufweist, da der Alphawert für die Füllung auf 50 % festgelegt wurde. Der Strich für die Ellipse bleibt bei 100 %.

Cc294765.87ccf3e4-01f4-4b47-b77f-d2099e400983(DE-DE,Expression.30).png

Visibility   Ermöglicht es, ein Objekt zu unterschiedlichen Zeitpunkten aus- oder einzublenden. Dies ist besonders bei Animationen wirkungsvoll, wenn Sie die Objekte nicht vollständig von der Zeichenfläche entfernen möchten. Im rechten Bild wurde das linke Objekt mit der blaue Füllung und dem breiten schwarzen Strich, das auch in den beiden vorherigen Beispielen in dieser Tabelle verwendet wurde, auf Ausgeblendet eingestellt.

Cc294765.7c2aa173-830c-4444-b588-f725ea563077(DE-DE,Expression.30).png

Siehe auch

Konzepte

Anwenden von Effekten