Добавить векторную графику различной плотности (виды)

Концепции и реализация Jetpack Compose

В Android Studio есть инструмент под названием Vector Asset Studio, который помогает добавлять иконки Material Design и импортировать файлы SVG (Scalable Vector Graphic) и PDF (Adobe Photoshop Document) в ваш проект в качестве векторных ресурсов. Использование векторных ресурсов вместо растровых изображений уменьшает размер APK-файла, поскольку один и тот же файл можно изменять в размере для разных плотностей экрана без потери качества изображения. Для более ранних версий Android, которые не поддерживают векторные ресурсы, Vector Asset Studio может во время сборки преобразовывать ваши векторные ресурсы в растровые изображения разных размеров для каждой плотности экрана.

О компании Vector Asset Studio

Vector Asset Studio добавляет векторное изображение в проект в виде XML-файла, описывающего изображение. Поддерживать один XML-файл может быть проще, чем обновлять множество растровых изображений с различным разрешением.

Android 4.4 (уровень API 20) и ниже не поддерживают векторные изображения. Если минимальный уровень API установлен на одном из этих уровней, у вас есть два варианта при использовании Vector Asset Studio: генерировать файлы Portable Network Graphic (PNG) (по умолчанию) или использовать метод обратной совместимости в AndroidX.

Для обеспечения обратной совместимости Vector Asset Studio генерирует растровые изображения векторных изображений. Векторные и растровые изображения упаковываются вместе в APK-файл. Вы можете ссылаться на векторные изображения как Drawable в Java-коде или @drawable в XML-коде; при запуске приложения соответствующее векторное или растровое изображение отображается автоматически в зависимости от уровня API.

Обратная совместимость в AndroidX

Для этого метода требуется AndroidX 1.0 или выше и Android Plugin for Gradle 3.2 или выше, и он использует только векторные изображения. Класс VectorDrawableCompat в AndroidX позволяет поддерживать VectorDrawable в Android 2.1 (уровень API 7) и выше.

Перед использованием Vector Asset Studio необходимо добавить в файл build.gradle следующее сообщение:

Классный 

android {
    defaultConfig {
        vectorDrawables.useSupportLibrary = true
    }
}

dependencies {
    implementation 'androidx.appcompat:appcompat:1.7.1'
}

Котлин 

android {
    defaultConfig {
        vectorDrawables.useSupportLibrary = true
    }
}

dependencies {
    implementation("androidx.appcompat:appcompat:1.7.1")
}

Для обеспечения обратной совместимости необходимо также использовать методы кодирования AndroidX, например, атрибут app:srcCompat вместо атрибута android:src для векторных изображений. Дополнительную информацию см. в разделе AndroidX .

Добавление векторного изображения в макет

В файле разметки можно задать любому виджету, связанному с иконками, например, ImageButton , ImageView и т. д., ссылку на векторный рисунок. Например, в следующей разметке показан векторный рисунок, отображаемый на кнопке:

Рисунок 1. Векторное изображение, отображаемое на кнопке в макете.

Чтобы отобразить векторное изображение на виджете, как показано на рисунке:

  1. Откройте проект и импортируйте векторный рисунок .

    В этом примере используется проект для телефона/планшета, созданный с помощью мастера создания нового проекта.

  2. В окне проекта (Android view ) дважды щелкните файл XML макета, например content_main.xml .

  3. Чтобы открыть редактор макетов , нажмите вкладку «Дизайн» .

  4. Перетащите виджет ImageButton из окна «Палитра» в редактор макетов.

  5. В диалоговом окне «Ресурсы» в левой панели выберите «Изображение» , а затем выберите импортированное векторное изображение. Нажмите «ОК» .

    Векторное изображение отображается на кнопке ImageButton в макете.

  6. Чтобы изменить цвет изображения на акцентный цвет, заданный в теме, в окне «Свойства» найдите свойство «Оттенок» и нажмите … .

  7. В диалоговом окне «Ресурсы» в левой панели выберите «Цвет» , а затем выберите «Акцент цвета» . Нажмите «ОК» .

    Цвет изображения меняется на акцентный цвет в макете.

Если в проекте используется AndroidX, код ImageButton должен выглядеть примерно так:

<ImageButton
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  app:srcCompat="@drawable/ic_build_black_24dp"
  tools:layout_editor_absoluteX="11dp"
  tools:layout_editor_absoluteY="225dp"
  android:id="@+id/imageButton"
  android:tint="@color/colorAccent" />

Если проект не использует AndroidX, код векторного изображения будет выглядеть следующим образом android:src="@drawable/ic_build_black_24dp" .

Ссылка на векторный объект в коде

Обычно вы можете ссылаться на векторный ресурс изображения универсальным способом в своем коде, и при запуске приложения соответствующее векторное или растровое изображение будет отображаться автоматически в зависимости от уровня API:

  • В большинстве случаев векторные изображения можно обозначать как @drawable в XML-коде или Drawable в Java-коде.

    Например, следующий XML-код разметки применяет изображение к представлению:

    <ImageView
  android:layout_height="wrap_content"
  android:layout_width="wrap_content"
  android:src="@drawable/myimage" />

    Следующий код извлекает изображение в виде Drawable :

    Котлин 

    val drawable = resources.getDrawable(R.drawable.myimage, theme)

    Java 

    Resources res = getResources();
Drawable drawable = res.getDrawable(R.drawable.myimage, getTheme());

    Метод getResources() находится в классе Context , который применяется к объектам пользовательского интерфейса, таким как активности, фрагменты, макеты, представления и так далее.

  • Если ваше приложение использует AndroidX (даже если в файле build.gradle нет оператора vectorDrawables.useSupportLibrary = true ), вы также можете ссылаться на векторный рисунок с помощью app:srcCompat . Например:

    <ImageView
  android:layout_height="wrap_content"
  android:layout_width="wrap_content"
  app:srcCompat="@drawable/myimage" />

  • Иногда может потребоваться привести тип ресурса drawable к его точному классу, например, когда необходимо использовать определенные возможности класса VectorDrawable . Для этого можно использовать следующий код:

    Котлин 

    if (Build.VERSION.SDK_INT &gt;= Build.VERSION_CODES.LOLLIPOP) {
  val vectorDrawable = drawable as VectorDrawable
} else {
  val bitmapDrawable = drawable as BitmapDrawable
}

    Java 

    if (Build.VERSION.SDK_INT &gt;= Build.VERSION_CODES.LOLLIPOP) {
  VectorDrawable vectorDrawable = (VectorDrawable) drawable;
} else {
  BitmapDrawable bitmapDrawable = (BitmapDrawable) drawable;
}

Доступ к векторным графическим ресурсам возможен только из основного потока.

Для Android 5.0 (уровень API 21) и выше можно использовать класс AnimatedVectorDrawable для анимации свойств класса VectorDrawable . В AndroidX для Android 3.0 (уровень API 11) и выше можно использовать класс AnimatedVectorDrawableCompat для анимации класса VectorDrawable . Дополнительную информацию см. в разделе «Анимация графических элементов» .