Кнопки онбординга

Узнайте, как добавлять и настраивать обычные, анимированные, глянцевые и кнопки с обратным отсчётом в конструкторе онбординга Adapty без написания кода. Направляйте пользователей, повышайте конверсию и завершайте флоу — всё без единой строки кода.

Добавление кнопок

Используйте Pulse Button, чтобы привлечь внимание и увеличить кликабельность. Или добавьте Countdown Button на слайды с истекающим пробным периодом, чтобы создать срочность и повысить количество обновлений.

Чтобы добавить кнопку:

  1. Нажмите Add в верхнем левом углу.
  2. Выберите Buttons и укажите тип:
    • Button
    • Pulse Button
    • Glossy Button
    • Pulse Glossy Button
    • Countdown Button
  3. Выберите действие кнопки в выпадающем списке On Press справа:
    • Navigate: Переводит пользователя на указанный экран онбординга.
    • Show/Hide element: Показывает или скрывает целевой элемент.
    • Open paywall: Открывает экран пейвола для совершения покупок. Узнайте, как обрабатывать открытие пейвола на iOS, Android, React Native и Flutter.
    • Scroll to: Прокручивает страницу до указанного элемента.
    • Custom: Выполняет пользовательскую логику события. Например, может использоваться для открытия окна входа или запроса разрешений приложения. Узнайте, как обрабатывать пользовательское действие на iOS, Android, React Native и Flutter.
    • Close onboarding: Закрывает флоу онбординга. Узнайте, как обрабатывать закрытие онбординга на iOS, Android, React Native и Flutter.

Чтобы изменить текст кнопки, кликните по её превью и внесите правки в режиме WYSIWYG.

Вложите попап с Pulse Glossy Button, чтобы предлагать премиум-функции прямо в середине флоу.

popup.webp
add-button.png

Настройка кнопок

Помимо базовой компоновки элементов, вы можете настроить внешний вид кнопки:

  1. Выберите элемент кнопки слева.
  2. Перейдите в раздел Styles в правом меню.
  3. В зависимости от типа кнопки доступны следующие параметры:
    • Все кнопки: ширина, отступы, фон, скругление углов, рамка, цвет рамки, тени, стрелка «вперёд» и её размер, правое смещение, цвет текста или обратного отсчёта, шрифт и межстрочный интервал.
    • Pulse Button: длительность и easing анимации, цвет и размер тени, увеличение кнопки.
    • Glossy Button: цвет глянцевой полосы, её ширина, угол и длительность анимации.
    • Pulse Glossy Button: длительность и easing анимации, цвет и размер тени, увеличение кнопки, цвет глянцевой полосы, её ширина, угол и длительность анимации.
button-customize.png