Bitmaps mit anpassbarer Größe erstellen (9-Patch-Dateien)
Mit Sammlungen den Überblick behalten
Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.
Das Draw 9-Patch-Tool ist ein WYSIWYG-Editor in Android Studio. Mit dem Tool können Sie Bitmapbilder erstellen, deren Größe automatisch an den Inhalt der Ansicht und die Bildschirmgröße angepasst wird. Sie können ausgewählte Teile des Bilds basierend auf den im Bild gezeichneten Indikatoren horizontal oder vertikal skalieren.
Eine Einführung in NinePatch-Grafiken und ihre Funktionsweise findest du in den NinePatch-Drawables.
Abbildung 1: Das Draw 9-Patch-Tool von Android Studio, das ein NinePatch-Image anzeigt.
Führe die folgenden Schritte aus, um mit dem Draw 9-Patch-Tool in Android Studio eine NinePatch-Grafik zu erstellen. Du benötigst das PNG-Image, aus dem du ein Neun-Patch-Image erstellen möchtest.
- Klicken Sie in Android Studio mit der rechten Maustaste auf das PNG-Image, aus dem Sie ein NinePatch-Image erstellen möchten, und klicken Sie dann auf 9-Patch-Datei erstellen.
- Geben Sie einen Dateinamen für das NinePatch-Image ein und klicken Sie auf OK. Ihr Bild wird mit der Dateiendung
.9.png
erstellt.
- Doppelklicken Sie auf Ihre neue NinePatch-Datei, um sie in Android Studio zu öffnen.
Im daraufhin geöffneten Arbeitsbereich ist der linke Bereich der Zeichenbereich, in dem Sie die Linien für die dehnbaren Patches und den Inhaltsbereich bearbeiten können. Der rechte Bereich ist der Vorschaubereich, in dem du eine Vorschau deiner Grafik ansehen kannst, wenn sie gestreckt wird.
- Klicken Sie innerhalb des 1-Pixel-Umrisses, um die Linien zu zeichnen, die die dehnbaren Bereiche und (optional) den Inhaltsbereich definieren.
Klicken Sie mit der rechten Maustaste, um zuvor gezeichnete Linien zu löschen (halten Sie auf dem Mac die Umschalttaste gedrückt und klicken Sie).
- Wenn Sie fertig sind, klicken Sie auf Datei > Speichern, um Ihre Änderungen zu speichern.
Doppelklicken Sie auf die Datei, um eine vorhandene NinePatch-Datei in Android Studio zu öffnen.
Damit Ihre NinePatch-Grafik richtig herunterskaliert wird, müssen alle dehnbaren Bereiche mindestens 2 x 2 Pixel groß sein.
Andernfalls werden diese Regionen beim Herunterskalieren möglicherweise ausgeblendet. Um Interpolation während der Skalierung zu vermeiden, die dazu führen kann, dass sich die Farbe an den Grenzen ändert, biete in den Grafiken vor und nach den dehnbaren Bereichen 1 Pixel zusätzlichen sicheren Platz an.
Hinweis:Eine normale PNG-Datei (*.png
) wird mit einem leeren 1-Pixel-Rahmen um das Bild herum geladen. Sie können die dehnbaren Flächen und den Inhaltsbereich innerhalb des Rahmens zeichnen.
Eine zuvor gespeicherte NinePatch-Datei (*.9.png
) wird unverändert geladen, ohne dass ein Zeichenbereich hinzugefügt wird, da sie bereits vorhanden ist.
Abbildung 2: Ein NinePatch-Image in Android Studio mit Inhalten, Patches und fehlerhaften Patches.
Zu den optionalen Steuerelementen gehören:
- Zoom: Passen Sie die Zoomstufe der Grafik im Zeichnungsbereich an.
- Patchskalierung: Passen Sie die Größe der Bilder im Vorschaubereich an.
- Sperre anzeigen: Der nicht zeichnende Bereich der Grafik wird bei Mouseover visualisiert.
- Flecken anzeigen: Sehen Sie sich eine Vorschau der rosafarbenen dehnbaren Flecken im Zeichnungsbereich an. Rosa steht für ein dehnbares Fleck, wie in Abbildung 2 dargestellt.
- Inhalt anzeigen: Markieren Sie den Inhaltsbereich in den Vorschaubildern. Lila zeigt den Bereich an, in dem Inhalte erlaubt sind (siehe Abbildung 2).
- Schlechte Flecken anzeigen: Patchbereiche, die beim Dehnen Artefakte erzeugen können, werden rot umrandet (Abbildung 2). Wenn Sie alle schädlichen Flecken entfernen, erhalten Sie die visuelle Kohärenz des gestreckten Bilds.
Alle Inhalte und Codebeispiele auf dieser Seite unterliegen den Lizenzen wie im Abschnitt Inhaltslizenz beschrieben. Java und OpenJDK sind Marken oder eingetragene Marken von Oracle und/oder seinen Tochtergesellschaften.
Zuletzt aktualisiert: 2025-07-27 (UTC).
[[["Leicht verständlich","easyToUnderstand","thumb-up"],["Mein Problem wurde gelöst","solvedMyProblem","thumb-up"],["Sonstiges","otherUp","thumb-up"]],[["Benötigte Informationen nicht gefunden","missingTheInformationINeed","thumb-down"],["Zu umständlich/zu viele Schritte","tooComplicatedTooManySteps","thumb-down"],["Nicht mehr aktuell","outOfDate","thumb-down"],["Problem mit der Übersetzung","translationIssue","thumb-down"],["Problem mit Beispielen/Code","samplesCodeIssue","thumb-down"],["Sonstiges","otherDown","thumb-down"]],["Zuletzt aktualisiert: 2025-07-27 (UTC)."],[],[],null,["# Create resizable bitmaps (9-patch files)\n\nThe Draw 9-patch tool is a WYSIWYG editor included in Android Studio. The tool lets you create\nbitmap images that automatically resize to accommodate the contents of the view and the size of\nthe screen. You can scale selected parts of the image horizontally or vertically based on indicators\ndrawn within the image.\n\nFor an introduction to NinePatch graphics and how they work, read\n[NinePatch drawables](/guide/topics/graphics/2d-graphics#nine-patch).\n\n**Figure 1.** Android Studio's\nDraw 9-patch tool displaying a NinePatch image.\n\nFollow these steps to create a NinePatch graphic using the Draw 9-patch tool in Android\nStudio. You'll need the PNG image that you'd like to create a NinePatch image from.\n\n1. In Android Studio, right-click the PNG image you'd like to create a NinePatch image from, then click **Create 9-patch file**.\n2. Enter a filename for your NinePatch image and click **OK** . Your image will be created with the `.9.png` file extension.\n3. Double-click your new NinePatch file to open it in Android Studio. \n\n In the workspace that opens, the left pane is your drawing area, where you can edit\n the lines for the stretchable patches and content area. The right\n pane is the preview area, where you can preview your graphic when stretched.\n4. Click within the 1-pixel perimeter to draw the lines that define the stretchable patches and (optional) the content area. \n\n Right-click to erase\n previously drawn lines (on Mac, hold Shift and click).\n5. When done, click **File** \\\u003e **Save** to save your changes.\n\nTo open an existing NinePatch file in Android\nStudio, double-click the file.\n\nTo make sure that your NinePatch graphics scale down properly, verify that any\nstretchable regions are at least 2x2 pixels in size.\nOtherwise, those regions may disappear when scaled down. To avoid interpolation during scaling\nthat may cause the color at the boundaries to change, provide 1 pixel of extra safe\nspace in the graphics before and after stretchable regions.\n\n**Note:** A normal PNG file (`*.png`) is\nloaded with an empty 1-pixel border added around the image. You can draw\nthe stretchable patches and content area within the border.\nA previously saved NinePatch file (`*.9.png`) is loaded as-is,\nwith no drawing area added because it already exists.\n\n**Figure 2.** A NinePatch image in Android Studio\nshowing content, patches, and bad patches.\n\nOptional controls include:\n\n- **Zoom**: Adjust the zoom level of the graphic in the drawing area.\n- **Patch scale**: Adjust the scale of the images in the preview area.\n- **Show lock**: Visualize the non-drawable area of the graphic on mouse-over.\n- **Show patches**: Preview the pink stretchable patches in the drawing area. Pink indicates a stretchable patch, as shown in figure 2.\n- **Show content**: Highlight the content area in the preview images. Purple indicates the area where content is allowed, as shown in figure 2.\n- **Show bad patches**: Adds a red border around patch areas that may produce artifacts in the graphic when stretched, as shown in figure 2. If you eliminate all bad patches, you will maintain the visual coherence of your stretched image."]]