Создаём тематические иконки для приложения на Android 13
В 2021 году Google анонсировал Material You и тем самым взял курс на персонализацию Android-устройств.
Одним из способов настройки внешнего вида своего рабочего стола для пользователя стала добавленная в этом году в Android 13 новая функция — «Тематические значки».
Тематические значки — это иконки, которые могут изменять свой цвет в зависимости от цвета, выбранного пользователем:
На момент публикации удалось найти только пару приложений, которые уже имеют адаптивные иконки (не считая приложений Google, разумеется):
Далее мы рассмотрим весь процесс создания тематической иконки для вашего приложения.
Итак, определимся, что файл с иконкой у нас будет называться ic_launcher.xml.
Укажем его в манифесте:
Создаем папку res/mipmap-anydpi-v26 и в ней файл ic_launcher.xml следующего вида:
где iconColor — это основной цвет фона вашей иконки, а ic_launcher_foreground —
это сама иконка в векторном формате.
Файл ic_launcher_foreground.xml должен находиться у вас в папке drawable-v24 .
Пример содержимого файла ic_launcher_foreground.xml :
Google накладывает следующие ограничения для адаптивных иконок:
- Иконка должна иметь один слой
- Размер слоя должен быть 108x108dp
- Размер самого логотипа на иконке должен быть не меньше 48x48dp, но и не превышать 72x72dp
- Нужно оставить отступы 18dp от каждой стороны логотипа
- Для иконки нельзя использовать тени или маски
Вот и все. Теперь ваше приложение поддерживает новую функцию Android 13 «Тематические значки», и его иконку хочется перенести на рабочий стол на видное место.
- Разработка мобильных приложений
- Разработка под Android
Установить иконку приложения Android Studio
Создаем в Adobe Photoshop иконку размером 512 на 512 с расширением .jpg. Открываем проект в Android Studio и находим папку с ресурсами — res. Обычно находится в каталоги Имя вашего проекта -> src -> main -> res. Правой кнопкой кликаем на res, открывается контекстное меню, переходим New -> Image Asset.
Открывается окно Configure Image Asset в поле Path указываем путь к нашей иконки.
Предупреждение An icon with the same name already exists and will be overwritten говорит о том, что иконка с таким же именем уже существует и будет перезаписана.
После чего должны смениться стандартные иконки Android Studio на ваши.
Далее жмём Next и Finish.
Предупреждение Some existing files (shown in red) will be overwritten by tjhjs operation. указывает на то, что файлы выделенные красным цветом будут заменены на новые файлы.
После чего в папке res создадутся новые папки с иконками c разными разрешениями: mipmap-anydpi-v26, mipmap-hdpi, mipmap-mdpi, mipmap-xhdpi, mipmap-xxhdpi, mipmap-xxxhdpi.
2492
Как изменить стандартную иконку Апк приложенния сделанного на Android Studio?
Покажите как изменить иконку на примере .
- Вопрос задан более трёх лет назад
- 26108 просмотров
Комментировать
Решения вопроса 0
Ответы на вопрос 2
Android разработчик
ic_launcher ищи в ресурсах проекта. A еще, как вариант, на папке res правой кнопкой -> New -> Image Asset — > Launcher Icons
Ответ написан более трёх лет назад
Комментировать
Нравится 3 Комментировать
mister_byt @mister_byt
Добавить в папку drawable нужное изображение и в файле Manifest прописать путь android:icon=»@drawable/название_изображения»
Ответ написан более трёх лет назад
Нравится 3 1 комментарий
Кстати, хорошая идея, но вот засада: если выйти из приложения и просмотреть открытые вкладки, то отображаться будет стандартная иконка андроида. Печаль .
Ваш ответ на вопрос
Войдите, чтобы написать ответ
- Android
- +1 ещё
Как корректно реализовать Базу данных в приложении на Андроид?
- 1 подписчик
- вчера
- 53 просмотра
Векторная иконка приложения для Андроид — полное руководство.
Однажды копаясь в Андроид документации я с большим удивлением заметил, что в SDK к версии 26 были добавлены не только адаптивные иконки, но и возможность совсем отказаться от растровых иконок лаунчера на новейших версиях Андроид. Это значит, что вам вовсе не нужно создавать по растровому ассету к каждому разрешению экрана воспользоваться одним/двумя векторными файлами для всех возможных разрешений! Так как растровые иконки достаточно увесистые вы можете таким образом сэкономить много килобайтов в размере приложения. Тут как и везде есть свои моменты и к сожалению я не нашел в интернете полного описания всего процесса. Ну что же, значит пришла моя пора заполнить этот пробел! Ниже вы найдёте видео процесса изготовления единой векторной иконки для приложения, а руководство также доступно на английском и чешском языках.
Прежде чем мы начнём
Избавится от растровых изображений в целой аппликации — мечта многих оптимизаторов. Особенно если приложения не большое а растровые иконки, при неправильном изготовлении весят почти четверть общего размера приложения. Но тут как и везде есть свои недостатки, давайте поговорим о них, возможно в вашем случае векторная икона — не вариант. Итак:
- Векторный формат в ОС Андроид был введен в версии 21, в качестве иконки приложения в лаунчере векторные изображения можно использовать только в версиях 26 и выше. Это значит, что если Ваше приложение должно поддерживать и более старые версии — Вам все равно придется иметь в наличии растровые иконки. Так что бонус тут не большой.
- Векторный формат который используется в ОС Андроид это не привычные нам SVG/EPS/AI и так далее, это формат XML, а это значит очень ограниченное использование. Этот формат не поддерживает атрибуты стилей, т.е. какие либо эффекты, блендинг, даже простейшие тени, блюр. Вы можете видеть начале видео, что происходит с тенями — они просто пропадают. Если у вас достаточно умелый график в команде, то в принципе это ограничение можно обойти переведя например тени в простые градиенты от полного цвета в абсолютно прозрачный итд. Если же у вас вовсе нет векторного оригинала или там слишком много эффектов — возможно игра не стоит свеч.
На этом минусы заканчиваются. Если ваше приложение должно запускаться лишь на устройствах которые ещё получают закладки безопасности (т.е. в момент написания статьи SDK версии 27+) или же использует какие то новшества современных Андроид систем/датчиков/устройств — векторная иконка отличный выбор. Вы можете сэкономить в несколько раз как на размере так и на файлах для иконки, имея лишь 1-2 файла изображения и пару файлов с их описанием! Звучит круто? Тогда ниже вы найдете рецепт того как это все приготовить.
Подготовка файлов
Я не буду вдаваться в подробности создания файлов иконки, так как они абсолютно идентичны остальным адаптивным иконкам. В интернете буквально тонны всевозможных шаблонов для адаптивных иконок и руководств для них. Можно использовать их все, с той лишь разницей, что в результате мы будем использовать файлы SVG а не PNG. Т.е. это будет один или два файла: первый с задним фоном, который должен иметь область для параллакс эффекта и файл переднего плана. В моем примере я использую вариант где задним фоном служит просто цвет, так что у меня будет один файл с описанием цвета и один файл с векторной графикой.
Итак если вы имеете файл(ы) SVG, то в следующем шаге нам понадобится Android Studio, впрочем если вы занимаетесь разработкой для ОС Андроид, вы и так знаете этот софт. Это бесплатное ПО можно скачать по адресу:
Важно! Векторные ассеты можно создавать лишь в версии 4.2.2 и выше.
Запустите студию, откройте свой проект, после загрузки выберете вкладку Project (первая вкладка слева сверху). В папке с ресурсами с помощью правого клика мыши выведите контекстное меню. В нем выберете первый элемент — New, затем Vector Asset. Откроется Asset Studio, в нем выберете тип: Локальный файл и путь через кнопку с папкой. Проверьте как иконка выглядит и нажмите кнопку Next. Тут вы увидите путь и название к вашему XML файлу с векторной иконкой. Повторите для второго файла если вы используете вектор как в переднем так и на заднем плане. Готово.
Настройка файлов конфигурации
И так изображения готовы, но ваш проект пока не знает пути к ним и как их отобразить. Вам нужно будет добавить/изменить несколько файлов:
- build.gradle — здесь необходимо включить поддержку векторных файлов, просто добавьте эти две строки в конфигурацию и зависимости:
android defaultConfig vectorDrawables.useSupportLibrary = true
>
>
dependencies implementation("com.android.support:appcompat-v7:23.2.0")
>
- в папку с ресурсами добавьте папку “mipmap-anydpi-v26”, т.е. как видно из названия это ассеты для любого DPI в версиях ОС выше 26. В нем будут два файла: ic_launcher_round.xml и ic_launcher.xml в которых необходимо описать что использовать как фон а что как передний план. В моем случае это цвет для фона и векторная графика для переднего плана.
- Ну и на конец то что мы описали в предыдущем пункте нужно добавить в папку drawable а также если вы использовали цвет в качестве фона — описать этот цвет в colors.xml.
Теперь система знает как, где и что, использовать в качестве иконки приложения в лаунчере. Запустите чистую инсталляцию и проверьте результаты своей работы. Как видите, техническая часть достаточно простая (если сравниватъ с PNG иконками).
В результате VCS должна показать вот такие изменения:
Как минимум две новые строки в файле:
./app/build.gradle
Новая папка “mipmap-anydpi-v26” с двумя файлами:
./app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml
./app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml
Один XML файл с изображением переднего плана:
./app/src/main/res/drawable/ic_launcher_foreground.xml
И либо описание цвета в качестве фона:
./app/src/main/res/values/colors.xml
либо изображение:
./app/src/main/res/drawable/ic_launcher_background.xml (в данной конфигурации отсутствует).
В ссылке ниже вы найдете все необходимые файлы из примера показанного в видео. Можете использовать их как пример для своего приложения. Спасибо за внимание!