Модальные Rich Media для Android

Функция модальных Rich Media для Android позволяет разработчикам отображать HTML-контент во всплывающем модальном окне в своем приложении. Это окно не блокирует другие элементы пользовательского интерфейса и может быть легко закрыто с помощью жестов свайпа. Модальное окно предлагает множество опций для настройки внешнего вида, поведения, анимации и многого другого, обеспечивая очень гибкий пользовательский опыт.

Ключевые особенности

Неблокирующий UI: Модальное окно не блокирует взаимодействие с другими элементами UI.
Настраиваемые жесты свайпа: Настройте жесты свайпа для закрытия модального окна в различных направлениях.
Гибкое позиционирование: Выберите, где на экране будет появляться модальное окно (вверху, по центру или внизу).
Пользовательские анимации: Управляйте тем, как модальное окно появляется и исчезает, с помощью различных типов анимации.
Закрытие свайпом: Пользователи могут смахнуть, чтобы закрыть модальное окно в любом направлении.
Регулируемая длительность анимации: Точно настройте скорость анимации модального окна.
Обработка строки состояния: Возможность отображать модальное окно под или над строкой состояния.
Регулируемая ширина окна: Возможность установить ширину модального окна на весь экран или по содержимому.

Использование

Включение модальных Rich Media

Чтобы включить функцию модальных Rich Media, вам необходимо настроить ее в файле AndroidManifest.xml вашего приложения, добавив следующую запись метаданных:

<meta-data
    android:name="com.pushwoosh.rich_media_type"
    android:value="Modal" />

Конфигурация по умолчанию

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

Параметры кастомизации

Позиция модального окна

Вы можете установить положение модального окна на экране с помощью setViewPosition(). Доступные значения для этого параметра:

TOP
CENTER (по умолчанию)
BOTTOM

Типы анимации закрытия

Настройте, как модальное окно закрывается, с помощью setDismissAnimationType(). Доступные опции:

FADE_OUT (по умолчанию)
SLIDE_UP
SLIDE_DOWN
SLIDE_LEFT
SLIDE_RIGHT
NONE

Типы анимации появления

Определите, как модальное окно появляется, с помощью setPresentAnimationType(). Доступные опции:

FADE_IN
SLIDE_UP
SLIDE_RIGHT
DROP_DOWN
SLIDE_LEFT
NONE (по умолчанию)

Конфигурация жеста свайпа

Модальное окно можно закрыть жестами свайпа в разных направлениях с помощью setSwipeGesture(). Доступные жесты свайпа:

UP
LEFT
RIGHT
DOWN
NONE (по умолчанию)

Длительность анимации

Управляйте скоростью анимации, установив animationDuration() в миллисекундах. Длительность указывается как целое число, представляющее время в миллисекундах.

Ширина модального окна

Ширину модального окна можно установить с помощью setWindowWidth(), который определяет, будет ли модальное окно занимать всю ширину экрана или только ту, что необходима для содержимого. Возможные значения:

FULL_SCREEN (по умолчанию)
WRAP_CONTENT

Обработка строки состояния

По умолчанию модальное окно не будет перекрывать строку состояния. Чтобы разрешить модальному окну появляться под строкой состояния, установите свойство setStatusBarCovered() в true.

Пример конфигурации

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

Пример жеста свайпа

        RichMediaManager.setDefaultRichMediaConfig(new ModalRichmediaConfig()
                .setStatusBarCovered(false)
                .setSwipeGesture(ModalRichMediaSwipeGesture.RIGHT)
                .setViewPosition(ModalRichMediaViewPosition.CENTER)
                .setDismissAnimationType(ModalRichMediaDismissAnimationType.SLIDE_RIGHT)
                .setPresentAnimationType(ModalRichMediaPresentAnimationType.SLIDE_FROM_LEFT)
                .setAnimationDuration(800)
                .setWindowWidth(ModalRichMediaWindowWidth.WRAP_CONTENT));

Пример выпадающей анимации

        RichMediaManager.setDefaultRichMediaConfig(new ModalRichmediaConfig()
                .setSwipeGesture(ModalRichMediaSwipeGesture.UP)
                .setViewPosition(ModalRichMediaViewPosition.TOP)
                .setDismissAnimationType(ModalRichMediaDismissAnimationType.SLIDE_UP)
                .setPresentAnimationType(ModalRichMediaPresentAnimationType.DROP_DOWN)
                .setAnimationDuration(1000));

Пример Rich Media внизу экрана

        RichMediaManager.setDefaultRichMediaConfig(new ModalRichmediaConfig()
                .setSwipeGesture(ModalRichMediaSwipeGesture.DOWN)
                .setViewPosition(ModalRichMediaViewPosition.BOTTOM)
                .setDismissAnimationType(ModalRichMediaDismissAnimationType.FADE_OUT)
                .setPresentAnimationType(ModalRichMediaPresentAnimationType.SLIDE_UP)
                .setAnimationDuration(2000));

Заключение

Функция модальных Rich Media для Android предоставляет простой и гибкий способ представления HTML-контента в вашем приложении, не мешая пользовательскому опыту. Благодаря обширным возможностям настройки, включая жесты свайпа, анимацию, позиционирование и ширину окна, вы можете создать бесшовное и увлекательное взаимодействие для ваших пользователей.