Проектируйте для больших экранов с самого начала

Устройства Android выпускаются в различных форм-факторах — телефоны, планшеты, складные устройства, устройства ChromeOS — с широким диапазоном размеров экрана. Android поддерживает множество режимов отображения, включая многооконный, многоэкранный, произвольный и «картинка в картинке». Складные устройства могут находиться в различных положениях, например, на столе или в виде книги.

Приступая к разработке приложения, учитывайте различные сценарии его использования. Например:

  • Устройства с большим экраном предоставляют пользователям больше пространства для взаимодействия с контентом вашего медиаприложения различными способами.

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

  • Пользователи могут использовать планшеты для поддержания связи посредством видеозвонков и более детального просмотра своих друзей и семьи. Ваше приложение может отображать более подробную информацию о названии или сцене в пользовательском всплывающем окне воспроизведения или предлагать больше вариантов управления на экране.

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

Учтите, что ваше медиаприложение работает с одним и тем же кодом на стандартном телефоне, складном устройстве, планшете и устройствах ChromeOS, поэтому вам следует разрабатывать приложение с учетом больших экранов с самого начала его разработки. Для получения дополнительной информации и наглядных примеров см. галерею «Большие экраны» .

Сделайте ваше медиаприложение адаптивным по умолчанию.

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

Ваше приложение должно быть адаптивным, чтобы учитывать различные размеры, ориентации и форм-факторы экранов. Адаптивный макет изменяется в зависимости от доступного ему пространства на экране. Для получения дополнительной информации см. раздел «Поддержка различных размеров экранов» .

Проектирование в соответствии с рекомендациями.

Базовое качество приложения — это основа всех приложений Android, независимо от размера экрана, положения устройства или других специфических особенностей устройства. Ваше приложение должно соответствовать этим основным требованиям, прежде чем вы начнете разрабатывать его для большого экрана. Для получения дополнительной информации см. раздел «Базовое качество приложения» .

Ваше приложение должно обеспечивать превосходный пользовательский опыт независимо от форм-фактора устройства, размера экрана, режима отображения или положения тела, поэтому разрабатывайте приложение в соответствии со следующими рекомендациями уровней 1, 2 и 3.

В рекомендациях определен исчерпывающий набор требований к качеству для большинства типов приложений Android.

Уровень 3:

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

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

Уровень 2:

В этом разделе ваше приложение реализует оптимизацию компоновки для всех размеров экрана и конфигураций устройств, а также расширенную поддержку внешних устройств ввода. Подробнее см. раздел «Оптимизация для больших экранов» .

Уровень 1:

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

Там, где это применимо, приложение поддерживает многозадачность, складывание экрана, перетаскивание и ввод с помощью стилуса. На этом уровне приложения сильно различаются, поэтому внимательно изучите рекомендации по таким параметрам, как многозадачность и складывание экрана. Для получения дополнительной информации см. «Различия для больших экранов» .

Оптимизированные макеты

Воспользуйтесь преимуществами увеличенного пространства больших экранов без черных полос (из-за ограничения ориентации) или растягивания. Оптимизировав макет вашего приложения для медиаконтента и социальных сетей, вы расширите охват вашего приложения и создадите лучший пользовательский опыт на всех форм-факторах с большими экранами — планшетах, складных устройствах и устройствах ChromeOS — а также обеспечите поддержку всех размеров телефонов.

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

Макеты медиафайлов

Сделайте ваше приложение более удобным в использовании, внедрив макеты, специфичные для медиаконтента, для списка с подробной информацией, ленты новостей и вспомогательной панели. Для получения информации о макетах MDX, Flutter и Compose см. раздел «Ресурсы по макетам» .

  • Макет «Список-подробности»: Разработка приложения с интерактивным медиабраузером позволяет пользователям просматривать различные медиафайлы во время просмотра или прослушивания. Заголовки медиафайлов отображаются рядом с воспроизводимым видео- или аудиофайлом. При изменении ориентации устройства макет «Список-подробности» реагирует, сохраняя состояние приложения. Для получения дополнительной информации см. раздел «Макеты «Список-подробности»» .

  • Лента: Макет ленты располагает эквивалентные элементы контента в настраиваемой сетке для быстрого и удобного просмотра большого объема контента, например, музыкальной ленты или киоска с фильмами и телепередачами в вашем приложении. Для получения дополнительной информации см. Макеты ленты .

  • Вспомогательная панель: Благодаря основной и дополнительной областям отображения ваше приложение может встраивать вспомогательную панель для контекста, релевантности или справочной информации, например, прокручиваемый список похожих названий, опубликованных рецензий или дополнительных работ тех же исполнителей или актеров. Для получения дополнительной информации см. раздел «Макеты вспомогательных панелей» .

Подборку макетов медиафайлов можно посмотреть в медиагалерее .

Макеты для социальных сетей

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

  • Макет «Список-подробности»: идеально подходит для мессенджеров, менеджеров контактов или файловых менеджеров. Например, ваше приложение может отображать список бесед рядом с подробными сведениями, чтобы вы всегда были в курсе последних сообщений. Для получения дополнительной информации см. «Макеты «Список-подробности»» .

  • Лента: Типичными элементами этого стиля оформления являются карточки и списки. Например, можно создать коллаж из постов в гибком формате сетки или использовать размер и положение для привлечения внимания к наиболее важным постам. Пользователи могут быстро просматривать большие группы контента. Для получения дополнительной информации см. раздел «Макеты ленты» .

  • Вспомогательная панель: Приложения для поиска и поиска информации или приложения для повышения производительности могут извлечь выгоду из такого стиля компоновки. Он позволяет пользователю держать инструменты для создания контента под рукой. Например, ваше приложение может позволить пользователям настраивать параметры, получать доступ к цветовым палитрам, применять эффекты и мгновенно видеть изменения. Для получения дополнительной информации см. раздел «Компоновка вспомогательных панелей» .

Подборку макетов для социальных сетей вы найдете на странице «Галерея социальных сетей» .

Рекомендации по использованию мультимедийных приложений на больших экранах.

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

Ориентация и изменение размера

Если ваше медиаприложение устанавливает ограничения по ориентации и изменению размера, Android активирует режим совместимости. Хотя режим совместимости гарантирует корректную работу приложения, удобство использования значительно снижается, и страдает пользовательский опыт.

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

Любые ограничения по ориентации экрана снижают возможности взаимодействия пользователей с контентом или потребления медиаконтента, что ограничивает использование вашего приложения. Изменение ориентации может в некоторой степени повлиять на размер, но изменение размера не обязательно изменит ориентацию.

Клавиатурные сочетания

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

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

Поддержка предварительного просмотра камеры

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

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

Для получения более подробной информации см. предварительный просмотр CameraX или предварительный просмотр Camera2 .

Складные позы

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

Включение возможности складывания в ваш план разработки делает ваше приложение доступным для большего количества устройств и расширяет его охват. Вы расширяете возможности взаимодействия пользователя с медиаконтентом способами, недоступными для других устройств без возможности складывания. Для получения дополнительной информации см. раздел «Возможность складывания» .