Этот компонент не поддерживается в объявлениях AMPHTML, видеорекламе и графических объявлениях.
С помощью компонента "Таблица спрайтов" можно создавать анимации спрайтов или показывать спрайты изображений отдельно, используя только один исходный файл.
Как добавить в проект компонент "Таблица спрайтов"
- Откройте панель Компоненты, а затем папку Графика и эффекты.
- Перетащите компонент Таблица спрайтов в рабочую область.
- На панели Свойства в разделе компонента Таблица спрайтов введите URL исходной таблицы спрайтов в поле Источник. Чтобы использовать локальный файл, нажмите в этом поле кнопку Обзор и выберите файл на компьютере.
- Введите параметры Смещение по оси X, Смещение по оси Y, Ширина кадра и Высота кадра для спрайта, который нужно показать. Если вы создаете анимацию, спрайт будет отображаться в первом кадре анимации.
- В зависимости от предполагаемого использования таблицы спрайтов, отобразите другие спрайты или создайте анимацию.
Чтобы показать другие спрайты:
- Добавьте ещё один компонент "Таблица спрайтов".
- Настройте новый компонент, используя тот же источник, но с отступом и параметрами кадра для спрайта, который вы хотите показать в этом компоненте.
Чтобы создать анимацию спрайтов:
- Разверните Дополнительные свойства на панели Свойства для компонента "Таблица спрайтов".
- Введите Количество кадров в анимации. Компонент показывает один спрайт на кадр (все спрайты должны быть одинакового размера).
- Установите флажок Автовоспроизведение, чтобы воспроизводить анимацию автоматически. Кроме того, анимацию можно активировать, настроив событие. Для этого выберите Таблица спрайтов > Воспроизвести или команду Включить/выключить анимацию (как описано ниже).
Свойства
Свойство | Описание |
---|---|
Название | Имя компонента. |
Источник | URL изображения, которое используется в качестве таблицы спрайтов. Можно связать с динамическими данными. |
X Offset (Смещение по оси X) | Смещение в пикселях от левого края таблицы спрайтов до спрайта. |
Y Offset (Смещение по оси Y) | Смещение в пикселях от верхней части таблицы спрайтов до спрайта. |
Ширина кадра | Ширина спрайта в пикселях. |
Высота кадра | Высота спрайта в пикселях. |
Выравнивание |
Положение спрайта в компоненте:
|
Масштаб |
Формат показа спрайтов, которые отличаются размером от компонента:
|
Дополнительные свойства
С помощью дополнительных свойств можно настроить анимацию спрайтов. Нажмите на значок в строке Дополнительные свойства на панели свойств компонента, чтобы изменить следующие параметры.
Свойство | Описание |
---|---|
Number of Frames (Количество кадров) | Количество кадров анимации. Если ввести число, превышающее количество спрайтов в таблице, в конец анимации будут добавлены пустые кадры. |
Duration (Длительность) | Продолжительность показа каждого кадра в миллисекундах. |
Number of Loops (Количество повторов) | Количество повторов анимации. Задайте значение 0, если нужно бесконечно повторять анимацию. |
Автовоспроизведение | Если этот флажок установлен, анимация будет воспроизводиться автоматически. |
End on frame one (Автовоспроизведение) | Если этот флажок установлен, после последнего цикла анимация будет заканчиваться на первом кадре. |
Reverse (Завершение на начальном кадре) | Если этот флажок установлен, анимация будет воспроизводиться в обратном порядке. |
События и действия
События, отправляемые компонентом "Таблица спрайтов"Перечисленные ниже события компонента "Таблица спрайтов" могут инициировать другие действия.
Событие | Описание |
---|---|
Приостановлено | Отправляется, когда анимация приостанавливается. |
Завершено | Отправляется, когда анимация заканчивается. |
Воспроизведение начато | Отправляется, когда начинается воспроизведение анимации. |
Воспроизведено повторно | Отправляется, когда воспроизведение анимации возобновляется после паузы. |
Чтобы выбрать одно из этих событий в диалоговом окне Событие, установите компонент "Таблица спрайтов" как цель.
Другие события могут вызывать следующие действия в компоненте "Таблица спрайтов":
Действие | Параметры настройки |
---|---|
Создать анимацию |
|
Воспроизвести | Запускает анимацию с текущего места. |
Пауза | Приостанавливает анимацию. |
Включить/выключить анимацию | Запускает и приостанавливает воспроизведение анимации. |
Повтор | Запускает анимацию с первого кадра. |
Назад | Показывает предыдущий кадр серии. |
Вперед | Показывает следующий кадр серии. |
Перейти к кадру | Показывает заданный кадр. |
Выбрав одно из этих действий в диалоговом окне Событие, установите компонент "Таблица спрайтов" как получатель.
Подробнее о том, как настраивать события…
Предварительный просмотр
После того как вы укажете источник, отступы и размеры кадра, на странице будет выполнен статический предварительный просмотр компонента "Таблица спрайтов", чтобы вы смогли проверить настройки спрайтов.
В интерфейсе Google Web Designer нельзя посмотреть анимацию спрайтов. Для этого нужно открыть документ в предпочитаемом браузере, нажав кнопку Предпросмотр.