У меня полноэкранный PNG, который я хочу отображать на заставке. Только одна ошибка там, и я понятия не имею , что размер положить в каждой вытяжке папку ( ldpi
, mdpi
, hdpi
и xhdpi
). Мое приложение должно работать хорошо и красиво на всех телефонах и планшетах. Какие размеры (в пикселях) я должен создать, чтобы заставка хорошо отображалась на всех экранах?
214
Ответы:
отказ
Этот ответ с 2013 года и серьезно устарел. Начиная с Android 3.2, сейчас существует 6 групп плотности экрана. Этот ответ будет обновлен, как только я смогу, но без ETA. Обратитесь к официальной документации для всех плотностей на данный момент (хотя информацию о конкретных размерах пикселей как всегда трудно найти).
Вот версия TL / DR
Создайте 4 изображения, по одному для каждой плотности экрана:
Прочитайте введение в 9-патч в Руководстве для разработчиков Android
При этом Android выберет соответствующий файл для плотности изображения устройства, затем растянет изображение в соответствии со стандартом 9-патчей.
конец TL; Dr. Полный пост впереди
Я отвечаю на вопрос, связанный с дизайном. Я не разработчик, поэтому я не смогу предоставить код для реализации многих предоставленных решений. Увы, моя цель - помочь дизайнерам, которые так же растерялись, как и я, когда помогали разработать свое первое приложение для Android.
Подходит для всех размеров
С помощью Android компании могут разрабатывать свои мобильные телефоны и таблицы практически любого размера, практически с любым разрешением, которое они хотят. Из-за этого не существует «правильного размера изображения» для заставки, так как нет фиксированного разрешения экрана. Это создает проблему для людей, которые хотят реализовать заставку.
Ваши пользователи действительно хотят видеть заставку?
(Кстати, среди пользователей юзабилити несколько не рекомендуется использовать заставки). Утверждается, что пользователь уже знает, к какому приложению он прикоснулся, и маркировка вашего изображения заставкой не нужна, поскольку это только прерывает взаимодействие с пользователем. «объявление». Однако его следует использовать в приложениях, которые требуют некоторой значительной загрузки при инициализации (5 с +), включая игры и т. д., чтобы пользователь не застревал, задаваясь вопросом, произошло ли сбой приложения или нет)
Плотность экрана; 4 класса
Таким образом, учитывая огромное количество разных разрешений экрана в телефонах, представленных на рынке, Google реализовал несколько альтернатив и изящных решений, которые могут помочь. Первое, что вы должны знать, это то, что Android разделяет ВСЕ экраны на 4 различных плотности экрана:
Из этого (если вы дизайнер) нужно знать, что Android в основном выбирает из 4 изображений для отображения в зависимости от устройства. Таким образом, вам в основном нужно создать 4 разных изображения (хотя может быть разработано больше для разных форматов, таких как широкоэкранный, портретный / альбомный режим и т. Д.).
Помните об этом: если вы не создадите экран для каждого отдельного разрешения, используемого в Android, ваше изображение растянется до размера экрана. И если ваше изображение в основном не градиентное или размытое, вы получите нежелательные искажения при растяжении. Таким образом, у вас есть два основных варианта: создать изображение для каждой комбинации размера / плотности экрана или создать четыре 9-патч-изображения.
Самым сложным решением является создание отдельного заставки для каждого разрешения. Вы можете начать, следуя разрешениям в таблице в конце этой страницы (их больше. Пример: 960 x 720 там не указан). И, предполагая, что у вас есть небольшая деталь на изображении, например, мелкий текст, вы должны создать более одного экрана для каждого разрешения. Например, изображение 480x800, отображаемое на среднем экране, может выглядеть нормально, но на меньшем экране (с более высокой плотностью / dpi) логотип может стать слишком маленьким или текст может стать нечитаемым.
9-патч
Другое решение состоит в том, чтобы создать изображение с 9 участками . По сути, это прозрачная граница размером 1 пиксель вокруг вашего изображения, и, рисуя черные пиксели в верхней и левой областях этой рамки, вы можете определить, какие части вашего изображения будут растягиваться. Я не буду вдаваться в подробности того, как работают изображения с 9 участками, но, вкратце, пиксели, которые выровнены с отметками в верхней и левой областях, - это пиксели, которые будут повторяться для растягивания изображения.
Несколько основных правил
Таким образом, вы можете разместить 1 точку по обе стороны от вашего логотипа (в верхней границе) и 1 точку выше и ниже ее (в левой границе), и эти отмеченные строки и столбцы будут единственными пикселями для растяжения.
пример
Вот изображение из 9 патчей, 102x102px (конечный размер 100x100, для целей приложения):
Вот 200% зум того же изображения:
Обратите внимание на отметки 1px сверху и слева, указывающие, какие строки / столбцы будут расширяться.
Вот как это изображение будет выглядеть в 100x100 внутри приложения:
А вот что было бы, если бы оно было расширено до 460x140:
И последнее, что нужно учитывать. Эти изображения могут хорошо смотреться на экране вашего монитора и на большинстве мобильных телефонов, но если устройство имеет очень высокую плотность изображения (dpi), изображение будет выглядеть слишком маленьким. Вероятно, все еще разборчиво, но на планшете с разрешением 1920x1200 изображение будет выглядеть как очень маленький квадрат в середине. Так в чем же решение? Создайте 4 разных изображения запуска с 9 патчами, каждое для разного набора плотности. Чтобы гарантировать, что сжатие не произойдет, вы должны разработать самое низкое общее разрешение для каждой категории плотности. Сжатие здесь нежелательно, потому что 9-патч учитывает только растяжение, поэтому в процессе сжатия мелкий текст и другие элементы могут потерять разборчивость.
Вот список самых маленьких, наиболее распространенных разрешений для каждой категории плотности:
Поэтому создайте четыре заставки в указанных выше разрешениях, разверните изображения, поместив прозрачную рамку размером 1 пиксель вокруг холста, и отметьте, какие строки / столбцы будут растягиваться. Имейте в виду, что эти изображения будут использоваться для ЛЮБОГО устройства в категории плотности, поэтому изображение ldpi (240 x 320) может быть растянуто до 1024x600 на очень большом планшете с небольшой плотностью изображения (~ 120 dpi). Таким образом, 9-patch - лучшее решение для растяжки, если вы не хотите, чтобы фотография или сложная графика использовались для заставки (имейте в виду эти ограничения при создании дизайна).
Опять же, единственный способ избежать этого растяжения - создать один экран для каждого разрешения (или один для каждой комбинации плотности разрешения, если вы хотите избежать слишком маленького / большого размера изображений на устройствах с высокой / низкой плотностью) или указать изображение, которое не растягивается и имеет фоновый цвет, появляется везде, где может произойти растяжение (также помните, что определенный цвет, отображаемый движком Android, вероятно, будет отличаться от того же конкретного цвета, отображаемого в фотошопе, из-за цветовых профилей).
Я надеюсь, что это имело какой-то смысл. Удачи!
источник
РЕЖИМ ПОРТРЕТА
MDPI 320x480 dp = 320x480px (1x)
LDPI составляет 0,75 x MDPI = 240x360 пикселей
HDPI составляет 1,5 x MDPI = 480x720 пикселей
XHDPI - 2 x MDPI = 640x960 пикселей
XXHDPI - 3 x MDPI = 960x1440 пикселей
XXXHDPI - 4 x MDPI = 1280x1920 пикселей
ЛАНДШАФТНЫЙ РЕЖИМ
MDPI - 480x320 точек на дюйм = 480x320 пикселей (1x)
LDPI составляет 0,75 x MDPI = 360x240 пикселей
HDPI составляет 1,5 х MDPI = 720x480 пикселей
XHDPI - 2 x MDPI = 960x640 пикселей
XXHDPI - 3 x MDPI = 1440x960 пикселей
XXXHDPI - 4 x MDPI = 1920x1280 пикселей
РЕДАКТИРОВАТЬ:
Я бы предложил использовать Lottie для заставки, если вы читаете это в 2019+
источник
ПОРТРЕТ
LDPI: 200x320 пикселей
MDPI: 320x480 пикселей
HDPI: 480x800 пикселей
XHDPI: 720px1280px
ПЕЙЗАЖ
LDPI: 320x200 пикселей
MDPI: 480x320 пикселей
HDPI: 800x480 пикселей
XHDPI: 1280x720 пикселей
источник
Я искал лучший и самый простой ответ, чтобы сделать 9-патч изображения. Теперь сделать 9-патч-образ - самая легкая задача.
На странице https://romannurik.github.io/AndroidAssetStudio/index.html вы можете сделать изображение из 9 патчей для всех разрешений - XHDPI, HDPI, MDPI, LDPI одним щелчком мыши.
источник
Использование PNG не очень хорошая идея. На самом деле это дорого, если речь идет о производительности. Вы можете использовать нарисованные XML-файлы, например, фон Facebook .
Это поможет вам сгладить и ускорить вашу работу, а для логотипа использовать патч .9.
источник
источник
Некоторое время назад я создал файл Excel с поддерживаемыми размерами.
Надеюсь, это кому-нибудь пригодится
Честно говоря, я потерял идею, но это относится к другой функции экрана как размер (не только плотность)
https://developer.android.com/guide/practices/screens_support.html
Пожалуйста, сообщите мне, если есть ошибки
Ссылка 1: размеры.xlsx
Ссылка 2: размеры.xlsx
источник
В моем случае я использовал список, который можно нарисовать в style.xml. При наличии списка слоев, вам нужен только один png для всех размеров экрана.
и flash_screen.xml в папке для рисования.
"background_noizi" - это файл png в папке drawable. Надеюсь, это поможет.
источник
** Если вы ищете подробности экрана для всех видов основных устройств **
перейти к материалу.
источник
Отредактированное решение, которое сделает ваш SplashScreen превосходным на всех API, включая API 21 - API 23
Если вы ориентируетесь только на APIs24 +, вы можете просто уменьшить свой вектор, который можно нарисовать, прямо в его XML-файле, например:
в приведенном выше коде я изменяю масштабируемость для рисования, которое я нарисовал на холсте 640x640, чтобы получить размер 240x240 тогда я просто положил его в свой экран-заставку drawable вот так, и он прекрасно работает:
мой код на самом деле только рисует треугольник на картинке внизу, но здесь вы видите, что вы можете достичь с этим. Разрешение наконец-то велико, в отличие от пиксельных краев, которые я получал при использовании растрового изображения. поэтому используйте вектор, который можно рисовать любым способом (есть сайт под названием vectr, который я использовал для создания моего без необходимости загружать специализированное программное обеспечение).
РЕДАКТИРОВАТЬ, чтобы заставить его работать также на API21-22-23
Хотя вышеприведенное решение работает для устройств с API24 +, я очень разочаровался после установки моего приложения на устройство с API22. Я заметил, что заставка снова пытается заполнить весь вид и выглядит как дерьмо. Вырвав себе брови на полдня, я наконец-то перебил решение проблемы силой воли.
вам нужно создать второй файл с именем в точности как XML-файл splashscreen (скажем, splash_screen.xml) и поместить его в 2 папки с именами drawable-v22 и drawable-v21, которые вы создадите в папке res / (чтобы увидеть их, вы необходимо изменить вид вашего проекта с Android на Project). Это позволяет вашему телефону перенаправлять файлы, помещенные в эти папки, всякий раз, когда на соответствующем устройстве запускается API, соответствующий суффиксу -vXX в папке drawable, см. Эту ссылку . поместите следующий код в список слоев файла splash_screen.xml, который вы создаете в этих папках:
По какой-то причине для этих API вы должны обернуть рисованный объект в растровое изображение, чтобы заставить его работать и получить окончательный результат, который выглядит одинаково. Проблема заключается в том, что вы должны использовать подход с дополнительными отрисовываемыми папками, поскольку вторая версия файла splash_screen.xml приведет к тому, что заставка вообще не будет отображаться на устройствах с API выше 23. Возможно, вам также придется разместить первая версия файла splash_screen.xml в drawable-v24, поскольку android по умолчанию использует ближайшую папку drawable-vXX, которую он может найти для ресурсов. надеюсь это поможет
источник
Основываясь на этом ответе от Лукаса Серро, я рассчитал размеры, используя соотношения в документах по Android , используя базовую линию в ответе. Надеюсь, это поможет кому-то еще зайти на этот пост!
источник