Компонент "Круговая галерея"

Этот компонент не поддерживается в объявлениях AMPHTML, видеорекламе и графических объявлениях.

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

Как выбрать галерею

В Google Web Designer есть четыре компонента с галереями:

  • Панорамная галерея позволяет показать объект со всех сторон. Объект можно поворачивать, перелистывая изображения. Этот компонент не работает с группами и элементами навигации.
  • Перелистываемая галерея позволяет создать простую вертикальную или горизонтальную галерею изображений или их групп.
  • Круговая галерея похожа на компонент "Перелистываемая галерея", но изображения сменяются с трехмерным эффектом, как на вращающемся экране.
  • Галерея переходов позволяет использовать ряд анимационных эффектов при смене изображений.

Как использовать в проекте компонент "Круговая галерея"

  1. Откройте панель Компоненты, а затем папку Галереи.

  2. Перетащите компонент Круговая галерея в рабочую область.

  3. Введите название компонента в соответствующем разделе панели Свойства.

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

    • Чтобы добавить в галерею изображения, выполните одно из следующих действий:
      • На панели Свойства в разделе компонента "Круговая галерея" нажмите кнопку Выберите изображения для галереи в поле Изображения. Затем воспользуйтесь функцией Выбрать изображения или перетащите изображения прямо в диалоговое окно.
      • В разделе свойств компонента на соответствующей панели в поле Изображения укажите URL изображений через запятую.
    • Чтобы добавить в галерею группы, сделайте следующее:
      • На панели Свойства в разделе компонента "Круговая галерея" укажите названия групп через запятую в поле Группы.
  5. При необходимости настройте описанные ниже дополнительные свойства компонента.

Как удалить изображения из галереи или изменить их порядок

  1. На панели Свойства в разделе компонента "Круговая галерея" нажмите кнопку Выберите изображения для галереи .
  2. Чтобы изменить порядок изображений, перетащите их. Чтобы удалить изображение из галереи, наведите на него указатель и нажмите кнопку Удалить .
  3. Нажмите ОК.

Свойства

Свойство Описание
Название Название компонента "Круговая галерея".
Изображения Позволяет выбрать изображения для галереи. Можно связать с динамическими данными.
Группы Разделенный запятыми список групп, используемых в галерее. Можно связать с динамическими данными.
Переход Время перехода между изображениями в миллисекундах.
Начальный кадр Номер изображения, которое должно показываться первым.
Автовоспроизведение Если флажок установлен, изображения галереи перелистываются автоматически.
Навигация Если флажок установлен, в галерее отображаются кнопки для перехода между изображениями.
Уменьшенные изображения Если установлены флажки "Уменьшенные изображения" и "Навигация", на панели навигации показываются уменьшенные изображения, а не значки.
Выделить цветом Определяет цвет рамки вокруг изображения в панели навигации.
Масштаб Позволяет адаптировать размеры изображений. Возможные варианты:
  • Вписать. Размер изображения изменяется с сохранением пропорций так, чтобы оно заполняло кадр без обрезки. Если у кадра и изображения разные соотношения сторон, добавляются поля.
  • Кадрировать. Размер изображения изменяется так, чтобы оно полностью заполняло кадр. Если у кадра и изображения разные соотношения сторон, оно обрезается.
  • Нет. Изображение исходного размера выравнивается по центру кадра. Если изображение меньше кадра, пустое пространство заполняется прозрачными полями. А если больше, изображение обрезается.
  • Растянуть и заполнить. Изображение растягивается так, чтобы оно заполняло кадр без обрезки.

Дополнительные свойства

Чтобы задать другие параметры, нажмите на значок в строке Дополнительные свойства на панели свойств компонента.

Ширина рамки Ширина кадра изображения в галерее (в пикселях).
Высота рамки Высота кадра изображения в галерее (в пикселях).
Вращение по ближайшим соседям Величина поворота соседних кадров.
Разделение по ближайшим соседям Расстояние между соседними кадрами.
Вертикальное смещение по ближайшим соседям Насколько высоко располагается соседний кадр.
Размер по ближайшим соседям Сравнительный масштаб соседнего изображения.
URL перехода Разделенный запятыми список URL, соответствующих кадрам галереи. Можно связать с динамическими данными.
Показать отражение (WebKit) Если этот флажок установлен, показывается отражение изображения. Эта функция поддерживается только в браузерах на основе WebKit.
Приостанавливать при выходе из кадра Если этот флажок установлен, при смене кадра будет приостановлено аудио или видео, воспроизводимое в текущем кадре (устраняет нежелательное воспроизведение содержимого в фоновом режиме).
Возобновлять при входе в кадр Если этот флажок установлен, при смене кадра начнется воспроизведение приостановленного аудио или видео в следующем кадре (устраняет нежелательное воспроизведение содержимого в фоновом режиме).

События и действия

События, отправляемые компонентом "Круговая галерея"

Перечисленные ниже события компонента "Круговая галерея" могут инициировать другие действия.

Событие Описание
Первое взаимодействие Отправляется, когда пользователь впервые использует галерею.
Все кадры просмотрены Отправляется, когда каждый кадр в галерее был показан не менее одного раза.
Изображения загружены Отправляется после загрузки всех кадров галереи.
Завершение автовоспроизведения Отправляется после завершения автовоспроизведения по любой причине.
Кадр показан Отправляется, когда каждый новый кадр полностью показан.
Кадр активирован Отправляется после начала смены кадра.
Завершение автовоспроизведения кадра Отправляется после активации кадра для автовоспроизведения.
Касание кадра Отправляется после нажатия на кадр.
Левый край Отправляется, когда после пролистывания достигнут левый край галереи.
Правый край Отправляется, когда после пролистывания достигнут правый край галереи.
Начало отслеживания Отправляется, когда начинается перетаскивание касанием либо мышью.
Отслеживание Регистрация координат компонента (X и Y) во время перетаскивания мышью или касанием.
Окончание отслеживания Отправляется, когда оканчивается перетаскивание касанием или мышью.

Чтобы выбрать одно из этих событий в диалоговом окне Событие, установите компонент "Круговая галерея" как цель.

Действия, выполняемые компонентом "Круговая галерея"

Другие события могут вызывать следующие действия в компоненте "Круговая галерея":

Действие Параметры настройки
Перейти к кадру
  • Индекс
  • Анимация: none или slide
Вперед Анимация: none или slide
Назад Анимация: none или slide
Однократный поворот
  • Время вращения: длительность в мс
  • Направление: forwards или backwards
Прекратить вращение Нет

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

Подробнее о том, как настраивать события

Предпросмотр

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

Эта информация оказалась полезной?

Как можно улучшить эту статью?
Поиск
Очистить поле поиска
Закрыть поиск
Главное меню
2613193139786423288
true
Поиск по Справочному центру
true
true
true
true
true
5050422
false
false