Freigeben über


Was ist der Bild-Editor in Visual Studio?

Der Bild-Editor in Visual Studio ist ein Tool, mit dem Sie Textur- und Bildressourcen anzeigen und ändern können. Insbesondere können Sie den Bild-Editor verwenden, um mit den Arten von umfangreichen Textur- und Bildformaten zu arbeiten, die in der DirectX-App-Entwicklung verwendet werden. Der Bild-Editor bietet Unterstützung für beliebte Bilddateiformate und Farbcodierungen, Features wie Alphakanäle und MIP-Zuordnung sowie viele der stark komprimierten, hardwarebeschleunigten Texturformate, die DirectX unterstützt.

Unterstützte Formate

Der Bild-Editor unterstützt die folgenden Bildformate:

Formatname Dateinamenerweiterung
Portable Network Graphics .png
JPEG .jpg, .jpeg, .jpe, .jfif
Direct Draw Surface .dds
Graphics Interchange Format .gif
Rastergrafik .bmp, DIB
Markiertes Bilddateiformat .tif, .tiff
TGA (Targa) TGA

Get started

In diesem Abschnitt wird beschrieben, wie Sie Ihrem Visual Studio-Projekt ein Bild hinzufügen und es für Ihre Anforderungen konfigurieren.

Hinzufügen eines Bilds zu Ihrem Projekt

  1. Öffnen Sie im Projektmappen-Explorer das Kontextmenü für das Projekt, dem Sie das Bild hinzufügen möchten, und wählen Sie dann "Neues Element> aus.

  2. Wählen Sie im Dialogfeld " Neues Element hinzufügen " unter "Installiert" die Option "Grafiken" und dann ein geeignetes Dateiformat für das Bild aus.

    Hinweis

    Wenn die Grafikkategorie im Dialogfeld " Neues Element hinzufügen " nicht angezeigt wird, müssen Sie möglicherweise die Komponente "Bild- und 3D-Modell-Editoren " installieren. Schließen Sie das Dialogfeld, und wählen Sie dann im Menüband Extras>Tools und Features abrufen aus, um das Visual Studio-Installationsprogramm zu öffnen. Wählen Sie die Registerkarte "Einzelne Komponenten " und dann die Komponente " Bild- und 3D-Modell-Editoren " unter der Kategorie "Spiele und Grafiken " aus. Wählen Sie aus, ändern Sie.

    Komponente für Bild- und 3D-Modell-Editoren

    Informationen zum Auswählen eines Dateiformats basierend auf Ihren Anforderungen finden Sie unter Auswählen des Bildformats.

  3. Geben Sie den Namen der Bilddatei und den Speicherort an, an dem sie erstellt werden soll.

  4. Klicken Sie auf die Schaltfläche Hinzufügen.

Auswählen des Bildformats

Je nachdem, wie Sie das Bild verwenden möchten, sind bestimmte Dateiformate möglicherweise besser geeignet als andere. Einige Formate unterstützen z. B. kein Feature, das Sie benötigen, z. B. Transparenz oder ein bestimmtes Farbformat. Einige Formate bieten möglicherweise keine geeignete Komprimierung für die Art von Bildinhalten, die Sie geplant haben.

Die folgenden Informationen können Ihnen bei der Auswahl eines Bildformats helfen, das Ihren Anforderungen entspricht:

Bitmapbild (.bmp)

Das Bitmapbildformat. Ein nicht komprimiertes Bildformat, das 24-Bit-Farben unterstützt. Das Bitmapformat unterstützt keine Transparenz.

GIF-Bild (.gif)

Das Gif-Bildformat (Graphics Interchange Format). Ein LZW-komprimiertes, verlustfreies Bildformat, das bis zu 256 Farben unterstützt. Nicht geeignet für Fotos und Bilder, die über eine erhebliche Farbdetailmenge verfügen, bieten aber gute Komprimierungsverhältnisse für Bilder mit niedriger Farbe, die einen hohen Grad an Farbkonsistenz aufweisen.

JPG-Bild (.jpg)

Das Jpeg-Bildformat (Joint Photographic Experts Group). Ein stark komprimiertes, verlustbehaftetes Bildformat, das 24-Bit-Farben unterstützt und für die allgemeine Komprimierung von Bildern geeignet ist, die einen hohen Grad an Farbkohärenz aufweisen.

PNG-Bild (.png)

Das PNG-Bildformat (Portable Network Graphics). Ein mäßig komprimiertes, verlustfreies Bildformat, das 24-Bit-Farben und Alphatransparenz unterstützt. Es eignet sich sowohl für natürliche als auch für künstliche Bilder, bietet jedoch keine Komprimierungsverhältnisse wie verlustbehaftete Formate wie JPG oder GIF.

TIFF-Bild (.tif)

Das Tagged Image File Format (TIFF oder TIF)-Bildformat. Ein flexibles Bildformat, das mehrere Komprimierungsschemas unterstützt.

DDS-Textur (.dds)

Das DirectDraw Surface (DDS)-Texturformat. Ein stark komprimiertes, verlustbehaftetes Texturformat, das 24-Bit-Farben und Alphatransparenz unterstützt. Seine Komprimierungsverhältnisse können so hoch wie 8:1 sein. Sie basiert auf der S3-Texturkomprimierung, die auf Grafikhardware dekomprimiert werden kann.

TGA Image (.tga)

Das TGA-Bildformat (Truevision Graphics Adapter) (auch bekannt als Targa). Ein RLE-komprimiertes, verlustfreies Bildformat, das sowohl Farbzuordnungen (Farbpalette) als auch direkte Farbbilder von bis zu 24-Bit-Farben und Alphatransparenz unterstützt. Nicht geeignet für Fotos und Bilder mit vielen Farbdetails, bietet jedoch ein gutes Komprimierungsverhältnis für Bilder mit langen, gleichfarbigen Bereichen.

Konfigurieren des Bilds

Bevor Sie mit der Arbeit mit dem von Ihnen erstellten Image beginnen, können Sie die Standardkonfiguration ändern. Sie können z. B. seine Abmessungen oder das von ihm verwendete Farbformat ändern. Informationen zum Konfigurieren dieser und anderer Eigenschaften des Bilds finden Sie unter "Bildeigenschaften".

Hinweis

Bevor Sie Ihre Arbeit speichern, stellen Sie sicher, dass Sie die Color Format-Eigenschaft festlegen, wenn Sie ein bestimmtes Farbformat verwenden möchten. Wenn das Dateiformat die Komprimierung unterstützt, können Sie die Komprimierungseinstellungen anpassen, wenn Sie die Datei zum ersten Mal speichern oder wenn Sie "Speichern unter" auswählen.

Arbeiten mit dem Bild-Editor zum Ändern von Texturen und Bildern

Befehle, die sich auf den Zustand des Bild-Editors auswirken, befinden sich zusammen mit erweiterten Befehlen auf der Symbolleiste für den Bild-Editor-Modus . Die Symbolleiste befindet sich am oberen Rand der Entwurfsoberfläche des Bild-Editors . Zeichentools befinden sich auf der Bild-Editor-Symbolleiste am äußerst linken Rand der Entwurfsoberfläche des Bild-Editors .

Symbolleiste für den Bild-Editor-Modus

Screenshot der Symbolleiste für den Bild-Editor-Modus in Visual Studio.

In der folgenden Tabelle werden die Elemente auf der Symbolleiste für den Bild-Editor-Modus beschrieben, die in der Reihenfolge aufgeführt sind, in der sie von links nach rechts angezeigt werden:

Symbolleistenelement Description
Auswählen Aktiviert die Auswahl eines rechteckigen Bereichs eines Bilds. Nachdem Sie einen Bereich ausgewählt haben, können Sie ihn ausschneiden, kopieren, verschieben, skalieren, drehen, kippen oder löschen. Wenn eine aktive Auswahl vorhanden ist, wirken sich Zeichentools nur auf den ausgewählten Bereich aus.
Unregelmäßige Auswahl Aktiviert die Auswahl eines unregelmäßigen Bereichs eines Bilds. Nachdem Sie einen Bereich ausgewählt haben, können Sie ihn ausschneiden, kopieren, verschieben, skalieren, drehen, kippen oder löschen. Wenn eine aktive Auswahl vorhanden ist, wirken sich Zeichentools nur auf den ausgewählten Bereich aus.
Wandauswahl Aktiviert die Auswahl eines ähnlich farbigen Bereichs eines Bilds. Die Toleranz – d. h. der maximale Unterschied zwischen benachbarten Farben, in denen sie als ähnlich betrachtet werden – kann so konfiguriert werden, dass sie einen kleineren oder breiteren Bereich ähnlicher Farben enthalten. Nachdem Sie einen Bereich ausgewählt haben, können Sie ihn ausschneiden, kopieren, verschieben, skalieren, drehen, kippen oder löschen. Wenn eine aktive Auswahl vorhanden ist, wirken sich Zeichentools nur auf den ausgewählten Bereich aus.
Pfanne Aktiviert die Bewegung des Bilds relativ zum Fensterrahmen. Wählen Sie im Schwenkmodus einen Punkt auf dem Bild aus, und bewegen Sie ihn dann herum.

Sie können den Schwenkmodus vorübergehend aktivieren, indem Sie die STRG-TASTE drücken und halten.
Zoom Aktiviert die Anzeige von mehr oder weniger Bilddetails relativ zum Fensterrahmen. Wählen Sie im Zoommodus einen Punkt auf dem Bild aus, und verschieben Sie ihn dann nach rechts oder unten, um zu zoomen, oder nach links oder nach oben, um das Bild zu verkleineren.

Sie können vergrößern oder verkleinern, indem Sie STRG drücken und halten, während Sie entweder das Mausrad verwenden oder das Pluszeichen (+) bzw. das Minuszeichen (-) drücken.
Zoom auf tatsächliche Größe Zeigt das Bild mithilfe einer 1:1-Beziehung zwischen den Pixeln des Bilds und den Pixeln des Bildschirms an.
Einpassen Zeigt das vollständige Bild im Fensterrahmen an.
Auf Breite zoomen Zeigt die vollständige Breite des Bilds im Fensterrahmen an.
Raster Aktiviert oder deaktiviert das Raster, das Pixelbegrenzungen anzeigt. Das Raster wird möglicherweise erst angezeigt, wenn Sie das Bild vergrößern.
Nächste MIP-Ebene anzeigen Aktiviert die nächste größere MIP-Ebene in einer MIP-Kartenkette. Die aktive MIP-Ebene wird auf der Entwurfsoberfläche angezeigt. Dieses Element ist nur für Texturen mit MIP-Ebenen verfügbar.
Vorherige MIP-Ebene anzeigen Aktiviert die nächste kleinere MIP-Ebene in einer MIP-Kartenkette. Die aktive MIP-Ebene wird auf der Entwurfsoberfläche angezeigt. Dieses Element ist nur für Texturen mit MIP-Ebenen verfügbar.
Roter Kanal

Grüner Kanal

Blauer Kanal

Alphakanal
Aktiviert oder deaktiviert den spezifischen Farbkanal. Anmerkung: Durch die systematische Aktivierung oder Deaktivierung von Farbkanälen können Sie Probleme isolieren, die mit einem oder mehreren davon zusammenhängen. Beispielsweise könnten Sie eine fehlerhafte Alphatransparenz identifizieren.
Hintergrund Aktiviert oder deaktiviert die Anzeige des Hintergrunds durch transparente Teile des Bilds. Sie können konfigurieren, wie der Hintergrund angezeigt wird, indem Sie die folgenden Optionen auswählen:

Schachbrettmuster
Verwendet eine grüne Farbe zusammen mit der angegebenen Hintergrundfarbe, um den Hintergrund als Checkerboardmuster anzuzeigen. Sie können diese Option verwenden, um transparente Teile des Bilds besser sichtbar zu machen.

Weißer Hintergrund
Verwendet die Farbe Weiß, um den Hintergrund anzuzeigen.

Schwarzer Hintergrund
Verwendet die Farbe Schwarz, um den Hintergrund anzuzeigen.

Hintergrund animieren
Schwenkt das Schachbrettmuster langsam. Sie können diese Option verwenden, um transparente Teile des Bilds besser sichtbar zu machen.
Eigenschaften Öffnet oder schließt das Eigenschaftenfenster abwechselnd.
Advanced Enthält zusätzliche Befehle und Optionen.

Filter

Stellt mehrere gängige Bildfilter bereit: Schwarzweiß, Weichzeichnen, Aufhellen, Abdunkeln, Kantenerkennung, Relief, Farben umkehren, Kräuseln, Sepiaton und Schärfen.

Grafikmodule

Rendern mit D3D11
Verwendet Direct3D 11 zum Rendern der Bild-Editor-Entwurfsoberfläche .

Rendern mit D3D11WARP
Verwendet Direct3D 11 Windows Advanced Rasterization Platform (WARP) zum Rendern der Bild-Editor-Entwurfsoberfläche .

Werkzeuge

Horizontal kippen
Transponiert das Bild um seine horizontale oder x-Achse.

Vertikal kippen
Transponiert das Bild um seine vertikale oder y-Achse.

Mips generieren
Generiert MIP-Ebenen für ein Bild. Wenn MIP-Ebenen bereits vorhanden sind, werden sie von der größten MIP-Ebene neu erstellt. Alle Änderungen, die an kleineren MIP-Ebenen vorgenommen wurden, gehen verloren. Um die generierten MIP-Ebenen zu speichern, müssen Sie das .dds Format verwenden, um das Bild zu speichern.

View

Bildrate
Wenn diese Option aktiviert ist, wird die Bildfrequenz in der oberen rechten Ecke der Entwurfsoberfläche angezeigt. Die Bildfrequenz ist die Anzahl der Frames, die pro Sekunde gezeichnet werden. Tipp: Sie können die Schaltfläche Erweitert auswählen, um den letzten Befehl erneut auszuführen.

Symbolleiste für den Bild-Editor

Screenshot der Symbolleiste für den Bild-Editor in Visual Studio.

In der folgenden Tabelle werden die Elemente auf der Bild-Editor-Symbolleiste beschrieben, die in der Reihenfolge aufgeführt sind, in der sie von oben nach unten angezeigt werden:

Symbolleistenelement Description
Bleistift Verwendet die aktive Farbauswahl, um einen aliasierten Strich zu zeichnen. Sie können die Farbe und Stärke des Strichs im Eigenschaftenfenster festlegen.
Bürsten Verwendet die aktive Farbauswahl, um einen antialiasierten Strich zu zeichnen. Sie können die Farbe und Stärke des Strichs im Eigenschaftenfenster festlegen.
Airbrush Verwendet die aktuelle Farbauswahl, um einen antialiasierten Strich zu zeichnen, der mit dem Bild kombiniert wird und mit der Zeit intensiver wird. Sie können die Farbe und Stärke des Strichs im Eigenschaftenfenster festlegen.
Pipette Legt die aktive Farbauswahl auf die Farbe des ausgewählten Pixels fest.
Füllen Verwendet die aktive Farbauswahl, um einen Bereich des Bilds auszufüllen. Der betroffene Bereich wird als das Pixel definiert, wo die Füllung angewendet wird, zusammen mit allen Pixeln, die durch Pixel derselben Farbe verbunden sind und selbst die gleiche Farbe haben. Wenn die Füllung innerhalb einer aktiven Auswahl angewendet wird, wird der betroffene Bereich durch die Auswahl eingeschränkt.

Standardmäßig wird die aktive Farbauswahl entsprechend ihrer Alphakomponente zusammen mit dem betroffenen Bereich des Bilds gemischt. Um die aktive Farbauswahl zum Überschreiben des betroffenen Bereichs zu verwenden, halten Sie die UMSCHALTTASTE gedrückt, wenn Sie das Fülltool verwenden.
Radiergummi Legt Pixel auf die vollständig transparente Farbe fest, wenn das Bild einen Alphakanal unterstützt. Andernfalls legt Eraser die Pixel auf die aktive Hintergrundfarbe fest.
Linie, Rechteck, abgerundetes Rechteck, Ellipse Zeichnet eine Form auf dem Bild. Sie können die Farbe und Stärke der Gliederung im Eigenschaftenfenster festlegen.

Um einen Grundtyp mit gleicher Breite und Höhe zu zeichnen, halten Sie die Shift-Taste gedrückt, beim Zeichnen.
Text Verwendet die Vordergrundfarbauswahl, um Text zu zeichnen. Die Hintergrundfarbe wird durch die Hintergrundfarbauswahl bestimmt. Bei einem transparenten Hintergrund muss der Alphawert der Hintergrundfarbauswahl 0 sein. Während der Textbereich aktiv ist, können Sie festlegen, ob der Text mit einem antialiasierten Strich gezeichnet wird, und Sie können den Textwert, die Schriftart, den Schriftgrad und die Formatvorlage "Fett", " Kursiv" oder " Unterstrichen" im Eigenschaftenfenster festlegen. Der Inhalt und die Darstellung des Texts werden abgeschlossen, wenn der Textbereich nicht mehr aktiv ist.
Drehen Dreht das Bild um 90 Grad im Uhrzeigersinn.
Anpassen Schneidet das Bild auf die aktive Auswahl.

Arbeiten mit MIP-Ebenen

Einige Bildformate, z. B. DirectDraw Surface (.dds), unterstützen MIP-Ebenen für Texturbereichsebenen (Level-of-Detail, LOD).

Arbeiten mit Transparenz

Einige Bildformate, z. B. DirectDraw Surface (.dds), unterstützen Transparenz. Es gibt verschiedene Möglichkeiten, transparenz zu verwenden, je nach tool, das Sie verwenden. Um die Transparenz für eine Farbauswahl anzugeben, legen Sie im Eigenschaftenfenster die A-Komponente (Alpha) der Farbauswahl fest.

In der folgenden Tabelle wird beschrieben, wie verschiedene Arten von Tools steuern, wie Transparenz angewendet wird:

Tool Description
Bleistift, Pinsel, Airbrush, Linie, Rechteck, abgerundetes Rechteck, Ellipse, Text Um die aktive Farbauswahl zusammen mit dem Bild zu mischen, erweitern Sie im Eigenschaftenfenster die Eigenschaftengruppe " Kanäle ", und legen Sie das Kontrollkästchen " Zeichnen " im Alphakanal fest, und zeichnen Sie dann normal.

Um mit der aktiven Farbauswahl zu zeichnen und den Alphawert des Bilds an Ort und Stelle zu lassen, deaktivieren Sie das Kontrollkästchen " Zeichnen " des Alphakanals , und zeichnen Sie dann normal.
Füllen Wenn Sie die aktive Farbauswahl zusammen mit dem Bild mischen möchten, wählen Sie einfach den zu füllenden Bereich aus.

Wenn Sie die aktive Farbauswahl ( einschließlich des Werts des Alphakanals ) verwenden möchten, um das Bild zu überschreiben, halten Sie die UMSCHALTTASTE gedrückt, und wählen Sie dann den zu füllenden Bereich aus.

Bildeigenschaften

Sie können das Eigenschaftenfenster verwenden, um verschiedene Eigenschaften des Bilds anzugeben. Sie können z. B. die Eigenschaften für Breite und Höhe festlegen, um die Größe des Bilds zu ändern.

In der folgenden Tabelle werden die Bildeigenschaften beschrieben:

Eigentum Description
Breite Die Breite des Bilds.
Höhe Die Höhe des Bilds.
Bits pro Pixel Die Anzahl der Bits, die jedes Pixel darstellen. Der Wert dieser Eigenschaft hängt vom Farbformat des Bilds ab.
Transparente Auswahl True , um die Auswahlebene zusammen mit dem Hauptbild zu mischen, basierend auf dem Alphawert der Auswahlebene; andernfalls "False". Dieses Element ist nur für Bilder verfügbar, die Alpha unterstützen.
Format Das Farbformat des Bilds. Je nach Bildformat können Sie verschiedene Farbformate angeben. Das Farbformat definiert die Anzahl und Art von Farbkanälen, die im Bild enthalten sind, sowie die Größe und Codierung verschiedener Kanäle.
Mip-Ebene Die aktive MIP-Ebene. Dieses Element ist nur für Texturen mit MIP-Ebenen verfügbar.
Anzahl der Mip-Ebenen Die Gesamtzahl der MIP-Ebenen im Bild. Dieses Element ist nur für Texturen mit MIP-Ebenen verfügbar.
Frameanzahl Die Gesamtanzahl der Frames im Bild. Dieses Element ist nur für Bilder verfügbar, die Texturarrays unterstützen.
Rahmen Der aktuelle Frame. Nur der erste Frame kann angezeigt werden; Alle anderen Frames gehen verloren, wenn das Bild gespeichert wird.
Tiefenschnittanzahl Die Gesamtanzahl der Tiefensegmente im Bild. Dieses Element ist nur für Bilder verfügbar, die Volumentexturen unterstützen.
Tiefenschnitt Die aktuelle Tiefenschicht. Nur das erste Segment kann angezeigt werden; Alle anderen Segmente gehen verloren, wenn Sie das Bild speichern.

Hinweis

Da die Eigenschaft "Drehen nach" für alle Tools und ausgewählten Bereiche gilt, wird sie immer am unteren Rand des Eigenschaften-Fensters zusammen mit anderen Werkzeugeigenschaften angezeigt. Drehen nach wird immer angezeigt, da das gesamte Bild implizit ausgewählt wird, wenn keine andere Auswahl oder kein aktives Werkzeug vorhanden ist. Weitere Informationen zur Eigenschaft "Drehen nach " finden Sie unter Tooleigenschaften.

Ändern der Größe von Bildern

Es gibt zwei Möglichkeiten zum Ändern der Größe eines Bilds. In beiden Fällen verwendet der Bild-Editor bilineare Interpolation, um das Bild zu resampeln.

  • Geben Sie im Eigenschaftenfenster neue Werte für die Eigenschaften "Width" und "Height " an.

  • Wählen Sie das gesamte Bild aus, und verwenden Sie die Rahmenmarkierungen, um die Größe des Bilds zu ändern.

Ausgewählte Regionen

Auswahlen im Bild-Editor definieren Bereiche des aktiven Bilds. Aktive Regionen sind von Tools und Transformationen betroffen. Wenn eine aktive Auswahl vorhanden ist, sind Bereiche außerhalb des ausgewählten Bereichs von den meisten Tools und Transformationen nicht betroffen. Wenn keine aktive Auswahl vorhanden ist, ist das gesamte Bild aktiv.

Die meisten Tools (Bleistift, Pinsel, Airbrush, Füllung, Radierer und 2D-Primitiven) und Transformationen (Drehen, Kürzen, Farben umkehren, Horizontal kippen und Vertikal kippen) werden durch die aktive Auswahl eingeschränkt oder definiert. Einige Werkzeuge (Pipette und Text) und Transformationen (Mips generieren) sind jedoch nicht von einer aktiven Auswahl betroffen. Diese Tools verhalten sich immer so, als ob das gesamte Bild die aktive Auswahl ist.

Während Sie einen Bereich auswählen, können Sie die Umschalttaste gedrückt halten, um eine proportionale (quadratische) Auswahl zu treffen. Andernfalls ist die Auswahl nicht eingeschränkt.

Auswahlgrößen ändern

Nachdem Sie einen Bereich ausgewählt haben, können Sie die Größe des Bereichs oder dessen Bildinhalte ändern, indem Sie die Größe der Markierung ändern. Während Sie die Größe des ausgewählten Bereichs ändern, können Sie die folgenden Modifizierertasten verwenden, um das Verhalten des ausgewählten Bereichs während der Größenänderung zu ändern:

STRG – Kopiert den Inhalt des ausgewählten Bereichs, bevor die Größe angepasst wird. Dadurch bleibt das Ursprüngliche Bild erhalten, während die Größe der Kopie geändert wird.

Umschalt - Ändert die Größe des ausgewählten Bereichs im Verhältnis zur ursprünglichen Größe.

ALT : Ändert die Größe des Auswahlbereichs. Dadurch bleibt das Bild unverändert.

In der folgenden Tabelle werden die gültigen Zusatztastenkombinationen beschrieben:

Ctrl Shift Alt Description
Ändert die Größe des Inhalts des ausgewählten Bereichs.
Shift Ändert die Größe des Inhalts des ausgewählten Bereichs proportional.
ALT Ändert die Größe des ausgewählten Bereichs. Dadurch wird ein neuer Auswahlbereich definiert.
Shift ALT Ändert die Größe des ausgewählten Bereichs proportional. Dadurch wird ein neuer Auswahlbereich definiert.
STRG Kopiert und ändert dann die Größe des Inhalts des ausgewählten Bereichs.
STRG Umschalten Kopiert und ändert dann die Größe des Inhalts des ausgewählten Bereichs proportional.

Tooleigenschaften

Während ein Tool ausgewählt ist, können Sie das Eigenschaftenfenster verwenden, um Details darüber anzugeben, wie es sich auf das Bild auswirkt. Sie können z. B. die Stärke des Bleistifttools oder die Farbe des Pinseltools festlegen.

Sie können sowohl eine Vordergrundfarbe als auch eine Hintergrundfarbe festlegen. Beide unterstützen einen Alphakanal, um eine benutzerdefinierte Deckkraft zu ermöglichen. Die Einstellungen gelten für alle Tools. Wenn Sie eine Maus verwenden, entspricht die linke Maustaste der Vordergrundfarbe, und die rechte Maustaste entspricht der Hintergrundfarbe.

In der folgenden Tabelle werden die Tooleigenschaften beschrieben:

Tool Eigenschaften
Alle Werkzeuge und Auswahlen Drehen um
Definiert den Winkel in Grad, um den der Auswahl- oder Werkzeugeffekt im Uhrzeigersinn gedreht wird.
Bleistift, Pinsel, Airbrush, Radierer Dicke
Definiert die Größe des Bereichs, der vom Tool betroffen ist.
Text Antialias
Zeichnet Text mit antialiasierten Kanten. Dadurch wird Text reibungsloser dargestellt.

Wert
Der zu zeichnende Text.

Font
Die Schriftart, die zum Zeichnen des Texts verwendet wird.

Größe
Die Größe des Texts.

Bold
Macht die Schrift fett.

Italics
Formatiert die Schrift kursiv.

Unterstrichen
Macht den Text unterstrichen.
2D-Primitiv Antialias
Zeichnet Grundtypen mit antialiasierten Kanten. Dadurch wirkt es glatter.

Dicke
Definiert die Stärke der Linie, die die Grenze des Primitivs bildet.

Radius X
(Nur abgerundetes Rechteck) Definiert den Rundungsradius für die oberen und unteren Kanten der Primitive.

Radius Y
(Nur abgerundetes Rechteck) Definiert den Rundungsradius für die linken und rechten Ränder des Grundtyps.
Bleistift, Pinsel, Airbrush, 2D-Primitive Kanäle
Aktiviert oder deaktiviert bestimmte Farbkanäle zum Anzeigen und Zeichnen. Wenn "Ansicht" für einen bestimmten Farbkanal festgelegt ist, ist dieser Kanal im Bild sichtbar; andernfalls ist sie nicht sichtbar. Wenn Draw für einen bestimmten Farbkanal festgelegt ist, wird dieser Kanal von Zeichnungsvorgängen beeinflusst; andernfalls wird er nicht beeinflusst.
Wandauswahl, Füllung Toleranz
Definiert den maximalen Unterschied zwischen benachbarten Farben, in denen sie als ähnlich betrachtet werden, sodass weniger oder mehr ähnliche Farben zu einem Teil des betroffenen oder ausgewählten Bereichs gemacht werden. Standardmäßig ist der Wert 32, was bedeutet, dass benachbarte Pixel innerhalb von 32 Schattierungen (heller oder dunkler) der Originalfarbe als Teil des Bereichs betrachtet werden.

Tastenkürzel

Command Tastenkürzel
Wechseln zum Auswahlmodus S
Wechseln zum Zoommodus Z
Wechseln zum Schwenkmodus K
Alle auswählen Strg+Ein
Aktuelle Auswahl löschen Löschen
Abbrechen der aktuellen Auswahl ESC (Escape)
Vergrößern Strg+Mausrad vorwärts

Strg+PageUp

Pluszeichen (+)
Herauszoomen Strg-Mausrad rückwärts

Strg-PageDown

Minuszeichen (-)
Bild nach oben verschieben Mausrad rückwärts

PageDown
Bild nach unten verschieben Mausrad vorwärts

PageUp
Bild nach links verschieben Shift+Mausrad nach unten

Mausrad nach links

Shift+PageDown
Bild nach rechts verschieben Umschalten+Mausrad vorwärts

Mausrad rechts

Shift+PageUp
Zoomen auf tatsächliche Größe Strg+0 (Null)
Bild in Fenster anpassen Strg+G, STRG+F
Bild an Fensterbreite anpassen Strg+G, STRG+I
Raster umschalten Strg+G, STRG+G
Bild auf die aktuelle Auswahl zuschneiden Strg+G, STRG+C
Nächste (höhere Details) MIP-Ebene anzeigen Strg+G, STRG+6
Vorherige MIP-Ebene anzeigen (niedrigere Details) Strg+G, STRG+7
Umschalten des roten Farbkanals Strg+G, STRG+1
Umschalten des grünen Farbkanals Strg+G, STRG+2
Blauer Farbkanal umschalten Strg+G, STRG+3
Alphakanal umschalten (Transparenz) Strg+G, STRG+4
Umschalten des Alpha-Checkerboardmusters Strg+G, STRG+B
Wechseln zu unregelmäßigen Auswahltools L
Zu Wandauswahltool wechseln M
Wechseln zum Bleistifttool P
Zum Pinseltool wechseln B
Wechseln zum Fülltool F
Wechseln zum Radierertool E
Zu Texttool wechseln T
Wechseln zum Farbauswahltool (Pipette) Ich
Verschieben Sie die aktive Auswahl und deren Inhalt. Pfeiltasten .
Ändern Sie die Größe der aktiven Auswahl und deren Inhalt. Strg+Pfeiltasten
Verschieben Sie die aktive Auswahl, aber nicht deren Inhalt. Shift+Pfeiltasten
Ändern Sie die Größe der aktiven Auswahl, aber nicht deren Inhalt. Shift+Strg+Pfeiltasten
Aktuelle Ebene übernehmen Rückgabe
Verkleinern der Werkzeugstärke [
Erhöhung der Werkzeugstärke ]

Beispiele für den Bild-Editor

In den Beispielen in diesem Abschnitt wird gezeigt, wie Sie mit dem Bild-Editor eine einfache Textur erstellen und MIP-Ebenen generieren und ändern können.

Erstellen einer einfachen Textur

Sie können den Bild-Editor verwenden, um Bilder und Texturen für Ihr Spiel oder Ihre App zu erstellen und zu ändern. Sie können z. B. die Größe der Textur festlegen, die Vordergrund- und Hintergrundfarben festlegen, den Alphakanal (Transparenz) verwenden, die Füll- und Ellipse-Tools verwenden und Tooleigenschaften festlegen.

In diesem Beispiel zeigen die folgenden Schritte, wie Sie eine Textur erstellen, die ein "Bullseye"-Ziel darstellt. Wenn Sie fertig sind, sollte die Textur wie das folgende Bild aussehen. Um die Transparenz in der Textur besser zu veranschaulichen, wurde der Bild-Editor so konfiguriert, dass ein grünes, kariertes Muster verwendet wird, um die Transparenz anzuzeigen.

Bilder, die ein

Bevor Sie beginnen, stellen Sie sicher, dass das Eigenschaftenfenster angezeigt wird. Sie verwenden das Eigenschaftenfenster , um die Bildgröße festzulegen, Die Tooleigenschaften zu ändern und Farben anzugeben, während Sie arbeiten.

Erstellen einer "Bullseye"-Zieltextur

  1. Erstellen Sie eine Textur, mit der Sie arbeiten können. Informationen zum Hinzufügen einer Textur zu Ihrem Projekt finden Sie im Bild-Editor.

  2. Legen Sie die Bildgröße auf 512 x 512 Pixel fest. Legen Sie im Eigenschaftenfenster die Werte der Eigenschaften Width und Height auf 512.

  3. Wählen Sie auf der Symbolleiste des Bild-Editors das Fülltool aus. Im Fenster "Eigenschaften " werden nun die Eigenschaften des Fülltools zusammen mit den Bildeigenschaften angezeigt.

  4. Legen Sie die Vordergrundfarbe auf vollständig transparent schwarz fest. Wählen Sie im Eigenschaftenfenster in der Gruppe " Farben "-Eigenschaft die Option "Vordergrund" aus. Legen Sie die Werte der Eigenschaften R, G, B und A neben der Farbauswahl auf 0.

  5. Wählen Sie auf der Symbolleiste des Bild-Editors das Fülltool aus, und halten Sie dann die UMSCHALTTASTE gedrückt, und wählen Sie einen beliebigen Punkt im Bild aus. Die Verwendung der Umschalttaste bewirkt, dass der Alphawert der Füllfarbe die Farbe im Bild ersetzt; andernfalls wird der Alphawert verwendet, um die Füllfarbe mit der Bildfarbe zu mischen.

    Von Bedeutung

    Dieser Schritt stellt zusammen mit der Farbauswahl im vorherigen Schritt sicher, dass das Basisbild für die Zieltextur "Bullseye" vorbereitet ist, die Sie zeichnen. Wenn das Bild mit transparentem Schwarz gefüllt ist und der Rahmen des Ziels schwarz ist, gibt es keine Aliasingartefakte um das Ziel.

  6. Wählen Sie auf der Symbolleiste des Bild-Editors das Ellipse-Tool aus.

  7. Legen Sie die Vordergrundfarbe auf vollständig undurchsichtig schwarz fest. Legen Sie die Werte der Eigenschaften R, G und B auf 0 und den Wert der A-Eigenschaft auf 255.

  8. Legen Sie die Hintergrundfarbe auf vollständig undurchsichtig weiß fest. Wählen Sie im Fenster "Eigenschaften" in der Gruppe " Farben " die Option "Hintergrund" aus. Legen Sie die Werte der Eigenschaften R, G, B und A auf 255.

  9. Legen Sie die Breite der Umrandung der Ellipse fest. Im Fenster Eigenschaften, in der Eigenschaftsgruppe Erscheinungsbild, legen Sie den Wert der Breite-Eigenschaft auf 8 fest.

  10. Stellen Sie sicher, dass die Antialiasierung aktiviert ist. Stellen Sie im Eigenschaftenfenster in der Gruppe " Appearance-Eigenschaft " sicher, dass die Antialias-Eigenschaft festgelegt ist.

  11. Zeichnen Sie mit dem Tool "Ellipse " einen Kreis von der Pixelkoordinate bis zur Pixelkoordinate (3, 3)(508, 508). Um den Kreis einfacher zu zeichnen, können Sie die UMSCHALTTASTE drücken und halten, während Sie zeichnen.

    Hinweis

    Die Pixelkoordinaten der aktuellen Zeigerposition werden auf der Visual Studio-Statusleiste angezeigt.

  12. Ändern Sie die Hintergrundfarbe. Legen Sie R auf 44, G auf 165, B auf 211 und A auf 255.

  13. Zeichnen Sie einen weiteren Kreis von Pixelkoordinate (64, 64) zu Pixelkoordinate (448, 448).

  14. Ändern Sie die Hintergrundfarbe wieder in vollständig undurchsichtiges Weiß. Legen Sie R, G, B und A auf 255.

  15. Zeichnen Sie einen anderen Kreis von Pixelkoordinate (128, 128) zu Pixelkoordinate (384, 384).

  16. Ändern Sie die Hintergrundfarbe. Legen Sie R auf 255, G und B auf 64und A auf 255.

  17. Zeichnen Sie einen weiteren Kreis von der Pixelkoordinate (192, 192) zur Pixelkoordinate (320, 320).

Die "Bullseye"-Zieltextur ist vollständig. Hier sehen Sie das endgültige Bild, das mit Transparenz dargestellt wird.

Illustration, die die Zieltextur

Zur Nachverfolgung können Sie MIP-Ebenen für diese Textur generieren. Informationen dazu finden Sie im nächsten Abschnitt.

Erstellen und Ändern von MIP-Ebenen

In diesem Dokument wird veranschaulicht, wie Sie mit dem Bild-EditorMIP-Ebenen für Texturbereichsebenen (Level of Detail, LoD) generieren und ändern.

Generieren von MIP-Ebenen

Mipmapping ist eine Technik, die verwendet wird, um die Renderinggeschwindigkeit zu erhöhen und Aliasingartefakte für texturierte Objekte zu reduzieren, indem mehrere Kopien einer Textur in unterschiedlichen Größen vorab berechnet und gespeichert werden. Jede Kopie, die als MIP-Ebene bezeichnet wird, ist die Hälfte der Breite und Höhe der vorherigen Kopie. Wenn eine Textur auf der Oberfläche eines Objekts gerendert wird, wird die MIP-Ebene, die dem Bildschirmbereich der texturierten Oberfläche am ehesten entspricht, automatisch ausgewählt. Dies bedeutet, dass die Grafikhardware keine überdimensionalen Texturen filtern muss, um eine konsistente visuelle Qualität zu gewährleisten. Obwohl die Speicherkosten für die Speicherung der MIP-Ebenen etwa 33 Prozent höher sind als die der ursprünglichen Textur, rechtfertigen die Leistungs- und Bildqualitätsgewinne sie.

MIP-Stufen generieren

  1. Beginnen Sie mit einer einfachen Textur. Geben Sie für optimale Ergebnisse eine Textur mit einer Breite und Höhe an, die eine Zweierpotenz betragen, z. B. 256, 512, 1024 usw.

  2. Generieren Sie die MIP-Ebenen. Wählen Sie auf der Bild-Editor-Modus-Symbolleiste "Erweiterte Werkzeuge>>Mips generieren" aus.

    Beachten Sie, dass die Schaltflächen "Gehe zur nächsten Mip-Ebene " und " Zur vorherigen Mip-Ebene wechseln" jetzt auf der Symbolleiste " Bild-Editormodus " angezeigt werden. Wenn das Eigenschaftenfenster angezeigt wird, beachten Sie außerdem, dass die schreibgeschützten Eigenschaften Mip Level und Mip Level Count jetzt in den Bildeigenschaften angezeigt werden.

Ändern von MIP-Ebenen

Um Spezialeffekte zu erzielen oder die Bildqualität auf bestimmten Detailebenen zu erhöhen, können Sie jede MIP-Ebene einzeln ändern. Sie können z. B. einem texturierten Objekt eine andere Darstellung in einem Abstand verleihen (größerer Abstand entspricht kleineren MIP-Ebenen), oder Sie können sicherstellen, dass Texturen, die Text oder Symbole enthalten, auch auf kleineren MIP-Ebenen lesbar bleiben.

So ändern Sie eine einzelne MIP-Ebene

  1. Wählen Sie die MIP-Ebene aus, die Sie ändern möchten. Verwenden Sie auf der Symbolleiste für den Bild-Editor-Modus die Schaltflächen "Gehe zu nächster MIP-Ebene " und "Zur vorherigen MIP-Ebene wechseln", um zwischen MIP-Ebenen zu wechseln.

  2. Nachdem Sie die zu ändernde MIP-Ebene ausgewählt haben, können Sie die Zeichentools verwenden, um sie zu ändern, ohne den Inhalt anderer MIP-Ebenen zu ändern. Die Zeichentools sind auf der Symbolleiste des Bild-Editors verfügbar. Nachdem Sie ein Tool ausgewählt haben, können Sie dessen Eigenschaften im Eigenschaftenfenster ändern.

Hinweis

Wenn Sie den Inhalt einzelner MIP-Ebenen nicht ändern müssen, wie Sie es tun könnten, um bestimmte Effekte zu erzielen, empfehlen wir, Mipmaps aus der Quelltextur zum Zeitpunkt der Erstellung zu generieren. Dadurch wird sichergestellt, dass MIP-Ebenen mit der Quelltextur synchronisiert bleiben, da Änderungen an einer MIP-Ebene nicht automatisch an andere Ebenen weitergegeben werden.

Besuchen Sie die Seite " Texturen exportieren ", um zu erfahren, wie Sie mit der Bildinhaltspipeline Texturen exportieren, die Mipmaps, Prämultipliziertes Alpha und mehr enthalten.