# Slices

Marque des régions nommées d'un sprite pour l'export, les moteurs de jeu et la mise à l'échelle 9-slice, avec un pivot et des changements image par image.

_Les raccourcis sont écrits pour Windows et Linux. Sur Mac, utilise ⌘ Cmd là où il est écrit Ctrl, et ⌥ Option pour Alt._

Un **slice** est un rectangle nommé sur le sprite : la zone d'un bouton, la hitbox d'un personnage, la partie d'une
feuille qu'un jeu doit découper. Les slices ne contiennent aucun pixel, donc dessiner ne les modifie jamais. Ils sont enregistrés
avec le sprite, écrits dans les fichiers Aseprite et dans les données de feuille de sprites, et un moteur de jeu peut les y
lire.

Un slice peut aussi porter un **centre 9-slice**, pour une illustration qui s'étire sans déformer ses
coins, et un **pivot**, un point que le jeu traite comme l'origine du slice.

![Un bouton de jeu vert sur le canevas avec deux slices : Button, sélectionné, avec huit poignées, des lignes 9-slice en pointillés et un réticule de pivot sur son bord inférieur, et un slice Icon en tirets autour de l'étoile au milieu](https://pxstud.io/manual/images/guides/slices-canvas.light.webp)

_Un 9-slice sélectionné avec un pivot, et un deuxième slice à l'intérieur_

## Créer un slice

Choisis le Slice (`Shift+C`) et fais glisser sur un endroit vide du canevas, d'un coin
au coin opposé ; un contour en tirets l'affiche pendant que tu fais glisser. Maintiens `Shift` pour le rendre carré.
Le nouveau slice s'appelle « Slice 1 », « Slice 2 » et ainsi de suite, et il est sélectionné, prêt à être ajusté.

Chaque slice est dessiné sur le canevas sous la forme d'un contour en tirets avec son nom, quel que soit l'outil que tu utilises.
Un slice qui a une couleur dans ses données utilisateur (ci-dessous) est entouré de cette couleur ; les autres reçoivent chacun
leur couleur à tour de rôle, pour que les voisins se distinguent facilement.

Avec **Aimanter à la grille** (`Shift+S`) activé, les bords des slices s'aimantent à la grille du document, aussi bien
quand tu crées un slice que quand tu le fais glisser. Avec **Aimanter aux repères** (`Ctrl+Shift+;`) activé,
créer, déplacer et redimensionner des slices, et déplacer leurs lignes 9-slice et leurs pivots, s'aimante aussi sur les
[repères](https://pxstud.io/fr/docs/manual/guides/selection.md#rulers-and-guides) proches (un slice déplacé se pose sur celui des deux bords qui est le plus proche).

## Auto-slice

Pour découper une feuille de sprites ou un jeu d'icônes en slices d'un seul coup, choisis Sprite > Auto-slice.... Il ajoute
un slice autour de chaque région peinte distincte, trouvée dans les calques visibles de l'image ou seulement dans le
cel actif. Les pixels qui se touchent par un coin comptent comme une seule région. Règle :

- **Écart de fusion :** les régions dont les cadres sont éloignés de ce nombre de pixels ou moins (ou se chevauchent)
  forment un seul slice. 0 garde chaque région distincte.
- **Largeur min.** et **Hauteur min.** : les régions plus petites sont ignorées.

La boîte de dialogue indique combien de slices elle va ajouter. Ils sont nommés « Slice 1 », « Slice 2 » et ainsi de suite,
de haut en bas puis de gauche à droite, après les slices que tu as déjà, et toute l'opération forme une seule
étape d'annulation. Chacun s'exporte comme n'importe quel autre slice.

## Sélectionner, déplacer et redimensionner

Avec l'outil Slice :

| Pour | Fais |
| - | - |
| Sélectionner un slice | Clique dessus. Un slice sélectionné a un contour plein et huit poignées carrées. |
| En sélectionner plusieurs | `Shift`+clic ou `Ctrl`+clic pour ajouter un slice à la sélection ou l'en retirer. |
| Désélectionner | Clique sur un endroit vide, ou appuie sur `Esc`. |
| Déplacer | Fais glisser à l'intérieur d'un slice. Tous les slices sélectionnés se déplacent ensemble. |
| Redimensionner | Fais glisser l'une des poignées. |
| Ouvrir ses propriétés | Double-clique dessus. |

Là où des slices se chevauchent, un clic choisit celui qui a été créé en dernier.

Chaque glissement est une seule étape d'annulation, quel que soit le nombre de slices déplacés.

## Centre 9-slice

Un slice **9-slice** est découpé en une grille de neuf parties par son rectangle **centre**. Quand l'illustration est
étirée (un bouton ou un cadre de dialogue dans un jeu), les coins restent tels qu'ils sont dessinés, les bords s'étirent
dans une seule direction, et le centre remplit le reste.

- **L'activer :** fais un clic droit sur le slice et choisis **Définir le 9-slice**. Le tiers central du slice
  devient le centre, affiché sous la forme de quatre lignes en pointillés qui traversent le slice.
- **L'ajuster :** sélectionne le slice et fais glisser l'une des quatre lignes en pointillés.
- **Le définir précisément :** utilise **9-slice (centre)** dans la boîte de dialogue Propriétés du slice.
- **Le désactiver :** fais un clic droit et choisis **Retirer le 9-slice**.

Le centre doit se trouver à l'intérieur du slice.

## Pivot

Le **pivot** est un point que ton jeu peut utiliser comme ancre du slice : les pieds d'un personnage, l'endroit autour duquel
un sprite pivote. Il s'affiche sous la forme d'un petit réticule.

- **Le définir :** fais un clic droit sur le slice à l'endroit où tu veux le pivot et choisis **Définir le pivot**. Le pivot
  se place sur le pixel sur lequel tu as cliqué.
- **Le déplacer :** sélectionne le slice et fais glisser le réticule.
- **Le retirer :** fais un clic droit et choisis **Retirer le pivot**.

Le pivot peut se trouver à l'extérieur du slice.

## Des slices qui changent au fil de l'animation

La position, la taille, le centre et le pivot d'un slice peuvent changer d'une image à l'autre, tandis que son nom reste
le même. Va sur l'image où il doit changer et modifie le slice à cet endroit (fais-le glisser, ou change-le
dans Propriétés du slice). Cette image reçoit sa propre **clé** : la nouvelle géométrie tient à partir de cette image,
jusqu'à la prochaine image qui a sa propre clé. Modifier sur la première image change la géométrie propre du slice.

Pour annuler un changement à partir d'une image, va sur cette image, fais un clic droit sur le slice et choisis
**Retirer la clé du slice** (affiché seulement sur les images qui ont leur propre clé), ou supprime la clé dans la
boîte de dialogue Propriétés du slice. La géométrie précédente reprend alors.

## Propriétés du slice

Double-clique sur un slice avec l'outil Slice, choisis **Propriétés du slice...** dans son menu
du clic droit, ou choisis Sprite > Propriétés du slice... (qui ouvre le dernier slice créé ; la boîte de dialogue peut
passer à n'importe quel autre). Elle contient :

- **Slice :** le slice que tu modifies, quand le sprite en a plus d'un.
- **Nom**, et les limites : **X**, **Y**, **Largeur** et **Hauteur**, en pixels du sprite.
- **9-slice (centre)**, avec **Centre X**, **Centre Y**, **Centre L.** et **Centre H.**.
- **Pivot**, avec **Pivot X** et **Pivot Y**.
- **Clés**, quand le slice change au fil du temps : chaque image avec sa propre géométrie, avec **Aller à** et
  **Supprimer la clé**.
- **Données utilisateur :** une couleur et une note, écrites avec le slice dans les données de la feuille de sprites.
- **Supprimer le slice**.

Le centre et le pivot sont mesurés à partir du coin supérieur gauche du slice, comme dans Aseprite. La boîte de
dialogue modifie le slice tel qu'il est sur l'image courante ; enregistrer un changement sur une image ultérieure donne à cette
image une clé.

## Le menu du clic droit

Fais un clic droit sur un slice avec l'outil Slice pour obtenir :

| Élément | Action |
| - | - |
| **Propriétés du slice...** | Ouvre la boîte de dialogue ci-dessus. |
| **Dupliquer le slice** | Ajoute une copie nommée « _nom_ copy », avec toutes ses clés, et la sélectionne. |
| **Supprimer** | Supprime le slice. |
| **Définir le 9-slice** / **Retirer le 9-slice** | Ajoute un centre ou le retire. |
| **Définir le pivot** / **Retirer le pivot** | Place le pivot à l'endroit où tu as cliqué, ou le retire. |
| **Retirer la clé du slice** | Retire la clé de cette image (seulement sur les images qui en ont une). |

Chacune de ces actions est une seule étape d'annulation.

## Supprimer des slices

Sélectionne des slices avec l'outil Slice et appuie sur `Del` ou `Backspace`, utilise **Supprimer** dans le menu
du clic droit, ou **Supprimer le slice** dans Propriétés du slice. Avec l'outil Slice actif et des slices sélectionnés,
Édition > Supprimer supprime les slices au lieu des pixels.

## Les slices quand le canevas change

Redimensionner, rogner, détourer, faire pivoter et retourner le sprite déplace et redimensionne ses slices en même temps
que l'illustration ([Redimensionner, rogner et effets](https://pxstud.io/fr/docs/manual/guides/document.md)).

## Où vont les slices

- **L'export** peut enregistrer un seul slice, ou chaque slice dans son propre fichier : choisis-le sous **Zone** dans
  Fichier > Exporter... ([Ouvrir, importer et exporter](https://pxstud.io/fr/docs/manual/guides/import-export.md#export)).
- **Les fichiers Aseprite** conservent chaque slice, avec ses clés, son centre, son pivot et ses données utilisateur, dans les deux sens
  ([Ouvrir, importer et exporter](https://pxstud.io/fr/docs/manual/guides/import-export.md)).
- **Les feuilles de sprites :** les données JSON listent chaque slice au format d'Aseprite : son nom, la couleur et la note de ses
  données utilisateur, et une clé par image où il change, avec les limites, le centre et le pivot,
  mis à l'échelle avec la feuille.
- **Les scripts** peuvent ajouter, lire, modifier et retirer des slices ([Slices dans la référence
  de script](https://pxstud.io/fr/docs/scripting/slices.md)).
