# Rich media modal para Android

<Aside type="note" title="Importante">
Disponível a partir do SDK 6.7.13
</Aside>

O recurso Rich Media Modal para Android permite que os desenvolvedores exibam conteúdo HTML dentro de uma janela pop-up modal em seu aplicativo. Este pop-up não bloqueia outros elementos da interface do usuário e pode ser facilmente dispensado usando gestos de deslizar. O modal oferece várias opções de personalização para aparência, comportamento, animações e muito mais, proporcionando uma experiência de usuário altamente flexível.

## Principais recursos

- **UI sem bloqueio**: O modal não bloqueia a interação com outros elementos da UI.
- **Gestos de deslizar personalizáveis**: Configure gestos de deslizar para dispensar o modal em várias direções.
- **Posicionamento flexível**: Escolha onde o modal aparece na tela (topo, centro ou parte inferior).
- **Animações personalizadas**: Controle como o modal aparece e desaparece com diferentes tipos de animação.
- **Dispensável via deslize**: Os usuários podem deslizar para dispensar o modal de qualquer direção.
- **Duração da animação ajustável**: Ajuste a velocidade das animações do modal.
- **Manuseio da barra de status**: Opção para mostrar o modal abaixo ou acima da barra de status.
- **Largura da janela ajustável**: Opção para definir a largura do modal para tela cheia ou para envolver o conteúdo.

## Uso

### Habilitando o rich media modal

Para habilitar o recurso **Modal Rich Media**, você precisa configurá-lo no arquivo `AndroidManifest.xml` do seu aplicativo, adicionando a seguinte entrada de metadados:

```xml
<meta-data
    android:name="com.pushwoosh.rich_media_type"
    android:value="Modal" />
```
## Configuração padrão
A aparência e o comportamento do modal podem ser personalizados definindo uma configuração padrão através do `RichMediaManager`. Esta configuração permite que você especifique como o modal se comporta, onde ele aparece, como pode ser dispensado e o tipo de animações usadas.

## Opções de personalização

### Posição da visualização modal

Você pode definir a posição do modal na tela usando `setViewPosition()`. Os valores disponíveis para este parâmetro são:

- `TOP`
- `CENTER` (padrão)
- `BOTTOM`

### Tipos de animação de dispensa

Personalize como o modal é dispensado com `setDismissAnimationType()`. As opções disponíveis incluem:

- `FADE_OUT` (padrão)
- `SLIDE_UP`
- `SLIDE_DOWN`
- `SLIDE_LEFT`
- `SLIDE_RIGHT`
- `NONE`

### Tipos de animação de apresentação

Defina como o modal aparece com `setPresentAnimationType()`. As opções disponíveis são:

- `FADE_IN`
- `SLIDE_UP`
- `SLIDE_RIGHT`
- `DROP_DOWN`
- `SLIDE_LEFT`
- `NONE` (padrão)

### Configuração de gesto de deslizar

O modal pode ser dispensado com gestos de deslizar em diferentes direções usando `setSwipeGesture()`. Os gestos de deslizar disponíveis incluem:

- `UP`
- `LEFT`
- `RIGHT`
- `DOWN`
- `NONE` (padrão)

### Duração da animação

Controle a velocidade da animação definindo a `animationDuration()` em milissegundos. A duração é especificada como um valor inteiro, representando o tempo em milissegundos.

### Largura da janela modal

A largura do modal pode ser definida usando `setWindowWidth()`, que define se o modal ocupará a largura total da tela ou apenas o suficiente para caber o conteúdo. Os valores possíveis são:

- `FULL_SCREEN` (padrão)
- `WRAP_CONTENT`

### Manuseio da barra de status

Por padrão, o modal não cobrirá a barra de status. Para permitir que o modal apareça abaixo da barra de status, defina a propriedade `setStatusBarCovered()` como `true`.


## Exemplo de configuração
Aqui estão alguns exemplos, demonstrando várias animações, incluindo gestos de deslizar, aparições com deslize, dispensas com fade-out, diferentes durações de animação e larguras de tela variadas. Abaixo, você também pode encontrar as configurações usadas para alcançar esses efeitos.

### Exemplo de gesto de deslizar

<video src="/android-push-notifications-android-modal-rich-media-1.webm" title="Modal do Android com gesto de deslizar para a direita para dispensar" autoplay loop muted playsinline />

```
        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));
```
### Exemplo de animação suspensa

<video src="/android-push-notifications-android-modal-rich-media-2.webm" title="Modal do Android aparecendo com animação suspensa e deslize para cima para dispensar" autoplay loop muted playsinline />

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

```

### Exemplo de rich media na parte inferior

<video src="/android-push-notifications-android-modal-rich-media-3.webm" title="Modal do Android exibido na parte inferior com dispensa de fade out e animação de deslize para cima" autoplay loop muted playsinline />

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

## Conclusão
O recurso Rich Media Modal para Android oferece uma maneira fácil e flexível de apresentar conteúdo HTML dentro do seu aplicativo sem obstruir a experiência do usuário. Com suas extensas opções de personalização, incluindo gestos de deslizar, animações, posicionamento e largura da janela, você pode criar uma interação contínua e envolvente para seus usuários.