Android pracujący z SVG / Vector Drawables

Podczas tworzenia aplikacji na Androida, obsługa wielu rozdzielczości jest czasem koszmarem dla programistów. Włączenie wielu obrazów dla różnych rozdzielczości również zwiększa rozmiar projektu. Rozwiązaniem jest użycie grafiki wektorowej, takiej jak obrazy SVG.

Co to jest Vector Drawable?

A VectorDrawablejest grafiką wektorową zdefiniowaną w pliku XML jako zbiór punktów, linii i krzywych wraz z powiązanymi informacjami o kolorze. Główną zaletą użycia wektorowego drawable jest skalowalność obrazu. Teraz nie ma potrzeby tworzenia różnych rozmiarów obrazu dla mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi itd. Vector drawable może być skalowany bez utraty jakości wyświetlania, co oznacza, że ten sam plik jest zmieniany dla różnych gęstości ekranu bez utraty jakości obrazu. Skutkuje to mniejszymi plikami APK i mniejszym nakładem pracy programistów.

Tworzenie projektu Android

1. Utwórz nowy projekt w Android Studio z File ⇒ New Project i wypełnij szczegóły projektu.

2. Otwórz build.gradle i dodaj poniższą linię wewnątrz bloku defaultConfig.

vectorDrawables.useSupportLibrary = true

Jeśli używasz gradle w wersji poniżej 2.0 to użyj następującego

aaptOptions {
additionalParameters " — no-version-vectors"
}

Tworzenie VectorDrawable

Istnieją 2 sposoby tworzenia VectorDrawable używając Android Studio Vector asset tool.

I) Material Icons

Więc zacznijmy od tworzenia VectorDrawable z Material Icons. Ikony te są oficjalnym zestawem ikon od Google, które zostały zaprojektowane zgodnie z wytycznymi Material Design.

  1. W projekcie kliknij prawym przyciskiem myszy na katalog drawable
  2. Go to New ⇒ Vector Asset
  3. Kliknij na ikonę launchera, aby przeglądać Material Icons.
  4. Wybierz ikonę i kliknij OK.
  5. Zobacz nazwę pliku i kliknij next.
  6. Teraz Vector Asset Studio pokaże lokalizację gdzie plik jest zapisany, przejrzyj ją i kliknij na finish.
  7. Folder drawable będzie teraz składał się z nowo utworzonego pliku.

II) Plik SVG lub PSD

Teraz stworzyliśmy vectorDrawable z Material Icon, co jeśli chcemy mieć osobną ikonę? Możemy ją stworzyć z SVG lub PSD, poniżej przedstawiamy procedurę

  1. W projekcie kliknij prawym przyciskiem myszy na katalog drawable
  2. Go to New ⇒ Vector Asset
  3. Select Local File (SVG, PSD) option
  4. Click on the browse icon and navigate to your SVG or PSD file to select it and click on OK.
  5. Weryfikuj obraz w podglądzie i kliknij Next ⇒ Finish.

Używanie VectorDrawable

Pomyślnie dodaliśmy VectorDrawables do projektu, teraz czas na ich użycie. Otwórz plik layoutu głównej aktywności (activity_main.xml) i dodaj poniższy plik xml. Ten layout pokazuje jak używać VectorDrawable z ImageView i innymi widokami (jako tło)

Aby używać VectorDrawable z javy lub używać ich jako tło (również w xml) musisz zaimplementować AppCompatDelegate, aby umożliwić kompatkowanie wektorów z zasobów. Poniżej znajduje się kod do tego celu.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany.