Настройка компоновок для всех устройств

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

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

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

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

  • Панель Быстрый стиль из виджетов Кнопка, Разделитель и Навигация по видам
  • Панель Динамическое содержание
  • Панель Добавить виджет из виджетов Заполнитель и Сетка
  • Панели Выбрать шаблон для страниц, верхних и нижних колонтитулов, окон, блоков и сеток

Подсказка:

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

Подсказка:

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