Twórz mapy bitowe z możliwością zmiany rozmiaru (pliki z 9 poprawkami)
Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Narzędzie Draw 9-patch to edytor WYSIWYG dostępny w Android Studio. Narzędzie pozwala tworzyć obrazy bitmapowe, które automatycznie zmieniają swój rozmiar w celu dopasowania do zawartości widoku i rozmiaru ekranu. Wybrane części obrazu możesz skalować w poziomie lub w pionie, zgodnie ze wskaźnikami narysowanymi na obrazie.
Wprowadzenie do grafiki NinePatch i sposobu ich działania znajdziesz w artykule o elementach rysunkowych NinePatch.
Rysunek 1. Narzędzie Rysuj 9-patch w Android Studio, które wyświetla obraz NinePatch.
Wykonaj te czynności, aby utworzyć grafikę NinePatch za pomocą narzędzia Draw 9-patch w Android Studio. Potrzebujesz obrazu PNG, z którego chcesz utworzyć obraz NinePatch.
- W Android Studio kliknij prawym przyciskiem myszy obraz PNG, z którego chcesz utworzyć obraz NinePatch, a następnie kliknij Utwórz plik 9-poprawek.
- Wpisz nazwę pliku obrazu NinePatch i kliknij OK. Obraz zostanie utworzony z rozszerzeniem pliku
.9.png
.
- Kliknij dwukrotnie nowy plik NinePatch, aby otworzyć go w Android Studio.
W otwartym obszarze roboczym lewy panel to obszar rysowania, w którym możesz edytować linie rozciągniętych obszarów i obszaru treści. Panel po prawej to obszar podglądu, w którym możesz wyświetlić podgląd grafiki po rozciągnięciu.
- Kliknij w obszarze 1 piksela, aby narysować linie definiujące plamy rozciągnięte oraz (opcjonalnie) obszar treści.
Kliknij prawym przyciskiem myszy, aby usunąć wcześniej narysowane linie (na Macu przytrzymaj Shift i kliknij).
- Gdy skończysz, kliknij Plik > Zapisz, aby zapisać zmiany.
Aby otworzyć istniejący plik NinePatch w Android Studio, kliknij go dwukrotnie.
Aby grafika NinePatch była poprawnie skalowana w dół, sprawdź, czy wszystkie rozciągnięte obszary mają rozmiar co najmniej 2 x 2 piksele.
W przeciwnym razie te regiony mogą zniknąć po zmniejszeniu. Aby uniknąć interpolacji podczas skalowania, która może spowodować zmianę kolorów na granicach, zapewnij 1 piksel dodatkowej bezpiecznej przestrzeni w grafice przed i za obszarami rozciąganymi.
Uwaga: zwykły plik PNG (*.png
) jest wczytywany z pustym obramowaniem o szerokości 1 piksela. Możesz narysować elastyczne plamy i obszar treści w ramce.
Zapisany wcześniej plik NinePatch (*.9.png
) zostanie wczytany w niezmienionej postaci bez obszaru rysowania, ponieważ już istnieje.
Rysunek 2. Obraz NinePatch w Android Studio przedstawiający treści oraz poprawki i nieprawidłowe poprawki.
Opcjonalne opcje obejmują:
- Powiększenie: dostosuj poziom powiększenia grafiki w obszarze rysowania.
- Skala poprawek: dostosuj skalę obrazów w obszarze podglądu.
- Pokaż blokadę: pozwala zobaczyć nierysowany obszar grafiki po najechaniu na nie kursorem myszy.
- Pokaż plamy: sprawdź podgląd rozciągniętych różowych plam w obszarze rysowania. Kolor różowy oznacza miejsce, które można rozciągać, tak jak pokazano na ilustracji 2.
- Pokaż treść: zaznacz obszar treści na obrazach podglądu. Fioletowy wskazuje obszar, w którym treści są dozwolone (tak jak na ilustracji 2).
- Pokaż nieprawidłowe poprawki: dodaje czerwone obramowanie wokół obszarów wymagających obszarów, które po rozciągnięciu mogą powodować powstawanie na obrazie artefaktów, jak widać na ilustracji 2. Jeśli usuniesz wszystkie nieprawidłowe poprawki, zachowasz wizualną spójność rozciągniętego obrazu.
Treść strony i umieszczone na niej fragmenty kodu podlegają licencjom opisanym w Licencji na treści. Java i OpenJDK są znakami towarowymi lub zastrzeżonymi znakami towarowymi należącymi do firmy Oracle lub jej podmiotów stowarzyszonych.
Ostatnia aktualizacja: 2025-07-27 UTC.
[[["Łatwo zrozumieć","easyToUnderstand","thumb-up"],["Rozwiązało to mój problem","solvedMyProblem","thumb-up"],["Inne","otherUp","thumb-up"]],[["Brak potrzebnych mi informacji","missingTheInformationINeed","thumb-down"],["Zbyt skomplikowane / zbyt wiele czynności do wykonania","tooComplicatedTooManySteps","thumb-down"],["Nieaktualne treści","outOfDate","thumb-down"],["Problem z tłumaczeniem","translationIssue","thumb-down"],["Problem z przykładami/kodem","samplesCodeIssue","thumb-down"],["Inne","otherDown","thumb-down"]],["Ostatnia aktualizacja: 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."]]