# Avant-plan et arrière-plan

> Découvrez comment créer et attribuer des avant-plans et arrière-plans dans vos écrans pour faciliter la réalisation de menus et fonds animés, avec des conseils utiles et étapes détaillées pour optimiser vos projets.

https://docs.pandasuite.com/fr/essentials/project-properties/foreground-and-background/

**Créez vos avant-plans/arrière-plans et attribuez-les à vos écrans. Ils vous facilitent la vie pour réaliser vos menus, vos fonds animés...**

Vos avant-plans et vos arrière-plans sont communs à l'ensemble de vos écrans. Ils s'appliquent au-dessus et en-dessous de vos écrans.

[Image : Schéma de trois pages côte à côte : derrière la Page 2, un arrière-plan vert ; devant, un avant-plan qui porte une barre de menu]

Ils s’éditent comme des états classiques : vous pouvez ajouter votre contenu, créer de nouveaux états, insérer des composants, des actions interactives…

Au niveau de vos écrans et de vos états courants, vous devez ensuite choisir l’avant-plan et l’arrière-plan que vous souhaitez associer : il est bien sûr possible de ne pas avoir d’avant-plan et d’arrière-plan.

## Créer un avant-plan/arrière-plan

1. Cliquez sur l'icône de maison au-dessus de la zone de travail pour passer au niveau **Projet**, puis sélectionnez **Avant-plans** ou **Arrière-plans**.
2. Insérez votre contenu dans le premier état. En effet, il y a toujours un avant-plan/arrière-plan par défaut. Si vous voulez un avant/arrière-plan vide, cliquez sur le bouton **+** en haut de la liste pour en créer un nouveau.

> **Info**
>
> **A savoir :** Si vous n'avez qu'un seul avant-plan/arrière-plan, celui-ci
> s'appliquera automatiquement à l'intégralité de vos écrans.

Pour mieux visualiser le contenu de votre avant-plan/arrière-plan, dans le panneau **Propriétés**, passez l’option **Cacher les écrans** à **Oui**, et éventuellement **Cacher les avant-plans** (arrière-plans).

[Image : Panneau Propriétés d'un avant-plan : couleur, puis les options Cacher les écrans, les avant-plans et les arrière-plans, réglées sur Oui ou Non]

## Attribuer vos avant/arrière-plans

Une fois créés, n'oubliez pas d'attribuer vos avant/arrière-plans à vos écrans (sauf si vous n'avez qu'un seul avant/arrière-plan).

1. Revenez au niveau **Projet** et sélectionnez **Ecrans**.
2. Sélectionnez votre écran ou votre état : son panneau **Propriétés** affiche une liste **Avant-plan** et une liste **Arrière-plan**.
3. Choisissez l'avant/arrière-plan voulu, ou **Courant** pour conserver l'avant/arrière-plan issu du parcours utilisateur.

> **Info**
>
> **A savoir :** Si vous attribuez un avant/arrière-plan à un écran, celui-ci
> sera automatiquement appliqué à tous les états. Vous pourrez le modifier au
> niveau de chaque état.

[Image : Panneau Propriétés d'un écran : la liste Background est ouverte, avec Current Background et 1. Background]

Comme dans le panneau **Propriétés** de l’avant/arrière-plan, vous pouvez cacher les avant/arrière-plans pour vous concentrer sur votre création.