Connect with us

Разработка

Устройства Android плавно переходят в десктопный режим

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

Опубликовано

/

     
     

Google пишет в своем блоге о новой функции работы Android с подключенными экранами.

Мы рады объявить о важном этапе сближения мобильных и настольных вычислительных систем на Android: поддержка подключенных дисплеев стала общедоступной с выходом Android 16 QPR3!

Как было показано на Google I/O 2025, подключенные дисплеи позволяют пользователям подключать свои Android-устройства к внешним мониторами и мгновенно получать доступ к оконной среде рабочего стола. Приложения можно использовать в окнах произвольной формы или развернутых окнах, а пользователи могут работать в многозадачном режиме так же, как и в настольной ОС.

Google и Samsung объединили усилия, чтобы обеспечить бесперебойную и мощную работу с оконным рабочим столом на устройствах всей экосистемы Android под управлением Android 16 при подключении к внешнему дисплею.

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

Как это работает?

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

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

Когда устройство, поддерживающее оконный режим рабочего стола (например, планшет, такой как Samsung Galaxy Tab S11), подключается к внешнему дисплею, сессия рабочего стола расширяется на оба дисплея, открывая еще более обширное рабочее пространство. Затем два дисплея функционируют как единая непрерывная система, позволяя окнам приложений, контенту и курсору свободно перемещаться между дисплеями.

Почему это важно?

В релизе Android 16 QPR3 мы завершили разработку поведения окон, взаимодействия с панелью задач и совместимости ввода (мышь и клавиатура), определяющих работу на подключенных дисплеях. Мы также добавили средства обеспечения совместимости для масштабирования окон и предотвращения перезапуска приложения при переключении дисплеев.

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

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

  • Не предполагайте постоянный объект Display: Объект Display, связанный с контекстом вашего приложения, может изменяться при перемещении окна приложения на внешний дисплей или при изменении конфигурации дисплея. Ваше приложение должно корректно обрабатывать события изменения конфигурации и динамически запрашивать метрики дисплея, а не кэшировать их.
  • Учитывайте изменения плотности пикселей: Внешние дисплеи могут иметь значительно отличающуюся плотность пикселей от основного экрана устройства. Убедитесь, что ваши макеты и ресурсы корректно адаптируются к этим изменениям, чтобы сохранить ясность и удобство использования пользовательского интерфейса. Используйте пиксели, не зависящие от плотности (dp), для макетов, предоставляйте ресурсы, зависящие от плотности, и обеспечьте соответствующее масштабирование пользовательского интерфейса.
  • Корректно поддерживайте внешние периферийные устройства: Когда пользователи подключаются к внешнему монитору, они часто создают среду, более похожую на рабочий стол. Это часто включает использование внешних клавиатур, мышей, трекпадов, веб-камер, микрофонов и динамиков. Улучшите поддержку взаимодействия с клавиатурой и мышью.

Создание для рабочего стола с помощью современных инструментов

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

Новые классы размеров окон: Large и Extra-large

Самое большое обновление в Jetpack WindowManager 1.5.0 — это добавление двух новых классов ширины окон: Large и Extra-large.

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

Вот новые пороговые значения ширины:

  • Large: для ширины от 1200dp до 1600dp
  • Extra-large: для ширины ≥1600dp

Устройства Android плавно переходят в десктопный режим

На очень больших поверхностях простое масштабирование планшетного Expanded макета не всегда обеспечивает наилучший пользовательский опыт. Например, почтовый клиент может комфортно отображать две панели (почтовый ящик и сообщение) в классе размера окна Expanded. Но на сверхбольшом настольном мониторе почтовый клиент может элегантно отображать три или даже четыре панели, например, почтовый ящик, список сообщений, полное содержимое сообщения и панель календаря/задач, — всё одновременно.

Чтобы включить новые классы размеров окон в свой проект, просто вызовите функцию из набора WindowSizeClass.BREAKPOINTS_V2 вместо WindowSizeClass.BREAKPOINTS_V1:

val currentWindowMetrics =
    WindowMetricsCalculator.getOrCreate()
    .computeCurrentWindowMetrics(LocalContext.current)

val sizeClass = WindowSizeClass.BREAKPOINTS_V2
    .computeWindowSizeClass(currentWindowMetrics)

Затем примените правильную компоновку, когда убедитесь, что в вашем приложении достаточно места:

if(sizeClass.isWidthAtLeastBreakpoint(
    WindowSizeClass.WIDTH_DP_LARGE_LOWER_BOUND)){
    ...
	// Window is at least 1200 dp wide.
}

Создавайте адаптивные макеты с помощью Jetpack Navigation 3

Navigation 3 — это новейшее дополнение к коллекции Jetpack. Navigation 3, только что вышедший в первой стабильной версии, представляет собой мощную библиотеку навигации, разработанную для работы с Compose.

Navigation 3 также является отличным инструментом для создания адаптивных макетов, позволяя отображать несколько элементов одновременно и обеспечивая плавное переключение между ними.

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

Для стандартных канонических макетов, таких как список-подробности и поддерживающая расширение, вы можете использовать сцены из библиотеки Compose Material 3 Adaptive (доступна в версии 1.3 и выше).

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

class ThreePaneScene<T : Any>(
    override val key: Any,
    override val previousEntries: List<NavEntry<T>>,
    val firstEntry: NavEntry<T>,
    val secondEntry: NavEntry<T>,
    val thirdEntry: NavEntry<T>
) : Scene<T> {
    override val entries: List<NavEntry<T>> = listOf(firstEntry, secondEntry, thirdEntry)
    override val content: @Composable (() -> Unit) = {
        Row(modifier = Modifier.fillMaxSize()) {
            Column(modifier = Modifier.weight(1f)) {
                firstEntry.Content()
            }
            Column(modifier = Modifier.weight(1f)) {
                secondEntry.Content()
            }
            Column(modifier = Modifier.weight(1f)) {
                thirdEntry.Content()
            }
        }
    }

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

class ThreePaneSceneStrategy<T : Any>(val windowSizeClass: WindowSizeClass) : SceneStrategy<T> {
    override fun SceneStrategyScope<T>.calculateScene(entries: List<NavEntry<T>>): Scene<T>? {
        if (windowSizeClass.isWidthAtLeastBreakpoint(WIDTH_DP_LARGE_LOWER_BOUND)) {
            val lastThree = entries.takeLast(3)
            if (lastThree.size == 3 && lastThree.all { it.metadata.containsKey(MULTI_PANE_KEY) }) {
                val firstEntry = lastThree[0]
                val secondEntry = lastThree[1]
                val thirdEntry = lastThree[2]


                return ThreePaneScene(
                    key = Triple(firstEntry.contentKey, secondEntry.contentKey, thirdEntry.contentKey),
                    previousEntries = entries.dropLast(3),
                    firstEntry = firstEntry,
                    secondEntry = secondEntry,
                    thirdEntry = thirdEntry
                )
            }
        }
        return null
    }
}

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

val strategy = ThreePaneSceneStrategy() then TwoPaneSceneStrategy()

NavDisplay(..., 
  sceneStrategy = strategy,
  entryProvider = entryProvider { 
    entry<MyScreen>(metadata = mapOf(MULTI_PANE_KEY to true))) { ... }
    ... other entries...
  }
)

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

Используя сцены и стратегии, вы можете добавлять в свое приложение макеты с одной, двумя и тремя панелями!

Ознакомьтесь с документацией, чтобы узнать больше о создании пользовательских макетов с помощью Scenes в Navigation 3.

Автономные адаптивные макеты

Если вам нужен отдельный (standalone) адаптивный лейаут, библиотека Compose Material 3 Adaptive помогает создавать интерфейсы, которые автоматически подстраиваются под конфигурацию окна — например, шаблоны list-detail или layout с дополнительной панелью (supporting pane). Адаптация происходит на основе классов размеров окна (window size classes) или положения устройства (device posture).

Хорошая новость: библиотека уже обновлена с учётом новых брейкпоинтов. Начиная с версии 1.2, стандартные scaffold-директивы для панелей по умолчанию поддерживают классы ширины окна Large и Extra-large.

Вам нужно только указать в файле сборки Gradle, что вы хотите использовать новые контрольные точки:

currentWindowAdaptiveInfo(supportLargeAndXLargeWidth = true)

Начало работы

Изучите функцию подключенного дисплея в последней версии Android. Установите Android 16 QPR3 на поддерживаемое устройство, затем подключите его к внешнему монитору, чтобы начать тестирование вашего приложения уже сегодня!

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

Если вы нашли опечатку - выделите ее и нажмите Ctrl + Enter! Для связи с нами вы можете использовать info@apptractor.ru.
Telegram

Популярное

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: