Урок 5: Ресурсы (res), квалификаторы, локализация, шрифты

Типы ресурсов в Android

В этом уроке углубимся в понимание различных типов ресурсов в каталоге res. Расскажу как их применять. При разработке приложений мы постоянно используем ресурсы. Если вы путаетесь в большом количестве непонятных файлов в папке res, то после просмотра этого урока вы будете понимать что означает каждый из них. В качестве практики импортируем новые шрифты в приложение, которые возьмем из макета в Figma. А также узнаем что такое квалификаторы. Вынесем захардкоженный в XML разметке текст в строковые ресурсы и настроим локализацию. Чтобы приложение меняло язык в зависимости от системного языка. Это просто.

Папка res

Но сперва выясним что такое ресурсы. Это некие статические объекты, которые хранятся в приложении. Это могут быть строки, цвета, макеты, стили, шрифты, векторные и не только изображения. Ну если очень грубо — ресурсы это все что не является кодом.

Это могут быть такие данные:

• drawable — этот каталог используется для хранения различных типов графических файлов или объектов. Например:
  • графические изображения форматов, таких как .png, .jpg, .gif;
  • векторные изображения, которые мы импортируем, например, из SVG;
  • shape drawable — XML файлы, которые определяют различные формы, которые мы задавали в качестве атрибута background;
  • layer drawable — XML файлы, которые позволяют определять несколько изображений в один слой и распределять их по принципу стека. Последний отрисовываемый drawable отображается сверху;
  • или это может быть transition drawable — XML файлы, позволяющие создавать анимацию перехода между двумя графическими объектами.
• layout — файлы макетов экрано
• Каталоги mipmap иконок — используется для хранения иконок приложения (и только для них) для самых различных мест. Например, рабочий стол, экраны с настройками, экраны выбора запускаемого приложения и так далее. Основное отличие этого каталога от drawable — это то, что они хранятся в оригинальном качестве, без масштабирования. Поэтому они расфасованы по папкам, которые отвечают за разное разрешение экрана (разную плотность пикселей) и берутся автоматически в зависимости от устройства. Иконки хранятся в наиболее современном на сегодняшний день формате для изображений webp, который занимает минимум места.

• Есть отдельная категория для относительно свежих операционных систем с пометкой v26. Эти ресурсы будут использоваться на устройствах с версией API 26 и выше (Android 8).
• В папке values хранятся файлы, в которых мы создаем уникальные цвета, строки, размеры или темы. При разработке мы обращаемся к этим файлам наиболее часто, используя специальный синтаксис. Через знак “@” в разметке и или класс R, который вы могли наблюдать, когда мы задавали в MainActivity конкретный файл макета. Через “собачку” мы уже обращались к некоторым ресурсам ранее в предыдущем уроке. Также это можно наблюдать в Манифесте. Там указана ссылка на строку, в которой хранится название приложения.

И если провалиться по ссылке в ресурс (используя ctrl или cmd + клик), то мы оказываемся непосредственно в файле со строковыми ресурсами.

Добавлю, что все строки, которые мы пишем в разметке макета или в коде следует выносить вот в этот строковый файл.

Это необходимо, если вы планируете делать локализацию на разные языки. Чем мы и займемся ниже.

• Также тут есть отдельная папка для ресурсов темной темы.
• И отдельная папка для разных пользовательских конфигурационных файлов, для которых не нашлось места в основных каталогах.

Все их их можно описать или импортировать, а потом обращаться к ним в коде через специальный класс с константами R. Он хранит “айдишники” всех создаваемых ресурсов. Это также нужно, чтобы переиспользовать эти значения в разных местах вашего приложения. А также массово их редактировать.

Импорт шрифтов

Хорошо. Как вы могли заметить на экране нашего приложения по прежнему системные шрифты, которые отличаются от дизайн-макета. Сейчас перед нами стоит задача найти, скачать и прикрутить новые шрифты в приложение. Сначала выясним какие шрифты нужны.

В макете используется два семейства шрифтов: Rubik для вариантов слов и Nunito для всего остального. Искать их исходники будем на Google Fonts. Rubik нам нужен с толщиной Regular — то есть обычный. Nunito нам понадобится обычный, полужирный, жирный. Добавляем их все и скачиваем как есть.

Создание директории font

После разархивации удалим лишнее и переименуем нужные нам шрифты в стиле snake case. Все что нам останется это создать новый каталог font в ресурсах и скопировать шрифты туда. Для создания специального каталога нужно вызвать контекстное меню у папки res и выбрать New → Android Resource Directory. Далее задаем название font и выбираем такой же тип в выпадающем списке. Больше ничего трогать не нужно, жмем ОК.

Добавление шрифтов элементам разметки

Пересоберем проект, чтобы подтянулись новые ресурсы. И теперь нужно только расставить шрифты по элементам TextView согласно макету. Делается это через атрибут fontFamily с указанием соответствующей ссылки на шрифт в качестве значения.

Пересоберем приложение и убедимся, что все работает.

Строковые ресурсы

Далее. Как вы помните я упоминал ранее о необходимости выносить строки в строковые ресурсы.

Это делается по нескольким основным причинам:

• Переиспользование одних и тех же строк в разных местах
• Массовое редактирование строк
• Локализация приложения

Но сначала обратимся к макету, а именно к вьюхам-изображениям. Как видите, они подсвечиваются варнингом. Там написано “Missing contentDescription attribute on image”. Content description — это описание изображения на экране. В первую очередь он задается для так называемых скринридеров — программ-синтезаторов речи для людей с нарушением зрения.

Жмем setContentDescription и заполняем описание. Напоминаю, у нас два изображения на этом экране, требующие заполнения.

Отлично. И теперь этот атрибут тоже загорелся варнингом. Среда разработки нам подсвечивает захардкоженные строки. И теперь переходим к этапу выноса строк в ресурсы.

Слова для вопроса и вариантов ответа будут динамически меняться и добавляться программно. Поэтому по хорошему их следует вообще вынести в технический атрибут tools и убрать атрибут text. Но пока для визуальной составляющей экрана при запущенном приложении мы их оставим. Чтобы убрать “варнинг” воспользуемся предложением добавления тега для игнорирования захардкоженного текста.

Что следует вынести безапелляционно, так это информационные строки о правильности или неправильности выбранного варианта ответа. А также текст на кнопках “Пропустить” и “Продолжить”.

Вынести строку в ресурсы можно, создав ресурс вручную в файле strings.xml. Или воспользоваться контекстным меню. Для этого надо навести курсор на атрибут текста и нажать Extract string resource. В окне создания ресурса напротив поля Resource name задается уникальный идентификатор строки в стиле snake_case. Как обычно, именование рекомендуется начинать с типа строки, затем уже конкретизировать контекст.

Поэтому я назову строку button_skip. А в поле Resource value указывается непосредственно текст, который мы хотим получать, обращаясь по “айдишнику” выше.

Готово. “Варнинг” пропал и в значение атрибута записалась ссылка на ресурс с уже знакомым синтаксисом. Через “@” указан тип ресурса, затем id.

Клик по атрибуту вместе ctrl или cmd — перенесет нас непосредственно к ресурсу. Все окей, значение записалось в файле strings.xml. По аналогии вынесем остальные строки.

Квалификаторы на примере локализации ресурсов

Что такое квалификаторы

Великолепно! В Android есть такая классная фишка как квалификаторы. Они позволяют использовать разные значения ресурсов в зависимости от того, какой девайс используется. Представьте, у нас есть приложение, которое нужно перевести на разные языки. Мы можем создать папки для каждого языка и в каждой папке положить файл со строками на нужной локали. Ну, например, у нас есть папка «en» с файлом на английском, а в папке «ru» лежит файл на русском. И когда мы обращаемся к строкам через класс R, система сама выбирает нужные строки в зависимости от языка на устройстве.

Но квалификаторы не только для языковых ресурсов. Мы можем использовать их для разных типов девайсов. Например, можем определить разные изображения в зависимости от плотности пикселей экрана, как это по умолчанию сделано для иконок приложения. Или показывать разные интерфейсы в зависимости от ориентации или версии Android устройства. То есть, можно создавать кучу разных конфигураций и адаптироваться под все возможные требования.

Как локализировать Android приложение

Теперь применим на практике полученную информацию о квалификаторах и добавим локализацию. Первое, что нужно сделать это добавить новый каталог для русскоязычной локализации. По аналогии с каталогом ночной темы. Строки на английском будут в каталоге по-умолчанию.

Для создания нового каталога кликаем на корневую папку res и выбираем New → Android Resource Directory. Тип оставляем values, а в названии добавляем ru. Теперь надо скопировать strings.xml в новую папку.

В Android Studio есть удобный инструмент для заполнения переводов. Жмем на Open Editor. Откроется табличка. Чем больше у вас языков, тем больше тут будет столбцов. Добавляем переводы для соответствующих значений. Для строк, которые не нуждаются в переводе устанавливается чекбокс Untranslatable — он прописывает выбранной строке новый атрибут с Boolean значением. Элементы с таким атрибутом не будут показывать предупреждение в случае отсутствия продублированного значения в других локализационных файлах.

Теперь при смене основного языка вашей операционной системы будут подтягиваться строки с определенным квалификатором языка. Если же у вас в приложении нет нужного языка, будут использоваться строки из каталога по умолчанию — без квалификатора языка. Поэтому хорошей практикой является этот каталог заполнять на английском языке.

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