# Rich media modal pour Android

<Aside type="note" title="Important">
Disponible à partir du SDK 6.7.13
</Aside>

La fonctionnalité Rich Media Modal pour Android permet aux développeurs d'afficher du contenu HTML dans une fenêtre popup modale au sein de leur application. Cette popup ne bloque pas les autres éléments de l'interface utilisateur et peut être facilement fermée par des gestes de balayage. La modale offre de multiples options de personnalisation pour l'apparence, le comportement, les animations, et plus encore, offrant une expérience utilisateur très flexible.

## Fonctionnalités clés

- **Interface utilisateur non bloquante** : La modale ne bloque pas l'interaction avec les autres éléments de l'interface utilisateur.
- **Gestes de balayage personnalisables** : Configurez les gestes de balayage pour fermer la modale dans différentes directions.
- **Positionnement flexible** : Choisissez où la modale apparaît sur l'écran (en haut, au centre ou en bas).
- **Animations personnalisées** : Contrôlez comment la modale apparaît et disparaît avec différents types d'animation.
- **Fermeture par balayage** : Les utilisateurs peuvent balayer pour fermer la modale depuis n'importe quelle direction.
- **Durée d'animation réglable** : Ajustez la vitesse des animations de la modale.
- **Gestion de la barre de statut** : Option pour afficher la modale sous ou au-dessus de la barre de statut.
- **Largeur de la fenêtre réglable** : Option pour définir la largeur de la modale en plein écran ou pour envelopper le contenu.

## Utilisation

### Activation du Rich Media modal

Pour activer la fonctionnalité **Rich Media Modal**, vous devez la configurer dans le fichier `AndroidManifest.xml` de votre application en ajoutant l'entrée de métadonnées suivante :

```xml
<meta-data
    android:name="com.pushwoosh.rich_media_type"
    android:value="Modal" />
```
## Configuration par défaut
L'apparence et le comportement de la modale peuvent être personnalisés en définissant une configuration par défaut via le `RichMediaManager`. Cette configuration vous permet de spécifier comment la modale se comporte, où elle apparaît, comment elle peut être fermée et le type d'animations utilisées.

## Options de personnalisation

### Position de la vue modale

Vous pouvez définir la position de la modale sur l'écran en utilisant `setViewPosition()`. Les valeurs disponibles pour ce paramètre sont :

- `TOP`
- `CENTER` (par défaut)
- `BOTTOM`

### Types d'animation de fermeture

Personnalisez la manière dont la modale se ferme avec `setDismissAnimationType()`. Les options disponibles incluent :

- `FADE_OUT` (par défaut)
- `SLIDE_UP`
- `SLIDE_DOWN`
- `SLIDE_LEFT`
- `SLIDE_RIGHT`
- `NONE`

### Types d'animation d'apparition

Définissez comment la modale apparaît avec `setPresentAnimationType()`. Les options disponibles sont :

- `FADE_IN`
- `SLIDE_UP`
- `SLIDE_RIGHT`
- `DROP_DOWN`
- `SLIDE_LEFT`
- `NONE` (par défaut)

### Configuration du geste de balayage

La modale peut être fermée avec des gestes de balayage dans différentes directions en utilisant `setSwipeGesture()`. Les gestes de balayage disponibles incluent :

- `UP`
- `LEFT`
- `RIGHT`
- `DOWN`
- `NONE` (par défaut)

### Durée de l'animation

Contrôlez la vitesse de l'animation en définissant la `animationDuration()` en millisecondes. La durée est spécifiée comme une valeur entière, représentant le temps en millisecondes.

### Largeur de la fenêtre modale

La largeur de la modale peut être définie en utilisant `setWindowWidth()`, qui définit si la modale prendra toute la largeur de l'écran ou juste assez pour s'adapter au contenu. Les valeurs possibles sont :

- `FULL_SCREEN` (par défaut)
- `WRAP_CONTENT`

### Gestion de la barre de statut

Par défaut, la modale ne couvrira pas la barre de statut. Pour permettre à la modale d'apparaître sous la barre de statut, définissez la propriété `setStatusBarCovered()` sur `true`.


## Exemple de configuration
Voici quelques exemples, démontrant diverses animations, y compris des gestes de balayage, des apparitions par glissement, des fermetures en fondu, différentes durées d'animation et des largeurs d'écran variables. Ci-dessous, vous trouverez également les configurations utilisées pour obtenir ces effets.

### Exemple de geste de balayage

<video src="/android-push-notifications-android-modal-rich-media-1.webm" title="Modale Android avec geste de balayage vers la droite pour fermer" 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));
```
### Exemple d'animation déroulante

<video src="/android-push-notifications-android-modal-rich-media-2.webm" title="Modale Android apparaissant avec une animation déroulante et balayage vers le haut pour fermer" autoplay loop muted playsinline />

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

```

### Exemple de Rich Media en bas de l'écran

<video src="/android-push-notifications-android-modal-rich-media-3.webm" title="Modale Android affichée en bas avec fermeture en fondu et animation de glissement vers le haut" autoplay loop muted playsinline />

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

## Conclusion
La fonctionnalité Rich Media Modal pour Android offre un moyen simple et flexible de présenter du contenu HTML dans votre application sans obstruer l'expérience utilisateur. Avec ses nombreuses options de personnalisation, y compris les gestes de balayage, les animations, le positionnement et la largeur de la fenêtre, vous pouvez créer une interaction fluide et engageante pour vos utilisateurs.