2026-03-03 09:15:39 +00:00
---
title: Composants
description: Composants réutilisables, instances, surcharges et synchronisation live dans OpenPencil.
---
# Composants
## Créer un composant
Remove implementation details from user guide
Replace internal references (Yoga, CanvasKit, Paragraph API, style runs,
characterStyleIDs, vectorNetworkBlob, Kiwi binary, scene graph, font-kit,
Local Font Access API, COMPONENT type, override key format, hex codes, px
specs) with user-facing language across all 7 locales.
2026-03-08 09:55:25 +00:00
< kbd > ⌥< / kbd > < kbd > ⌘< / kbd > < kbd > K< / kbd > (< kbd > Ctrl< / kbd > + < kbd > Alt< / kbd > + < kbd > K< / kbd > ) — convertit un cadre ou un groupe en composant réutilisable. Une étiquette violette avec un losange apparaît au-dessus.
2026-03-03 09:15:39 +00:00
## Jeux de composants
Remove implementation details from user guide
Replace internal references (Yoga, CanvasKit, Paragraph API, style runs,
characterStyleIDs, vectorNetworkBlob, Kiwi binary, scene graph, font-kit,
Local Font Access API, COMPONENT type, override key format, hex codes, px
specs) with user-facing language across all 7 locales.
2026-03-08 09:55:25 +00:00
< kbd > ⇧< / kbd > < kbd > ⌘< / kbd > < kbd > K< / kbd > — combine deux composants ou plus dans un conteneur avec une bordure violette en pointillés.
2026-03-03 09:15:39 +00:00
## Créer des instances
Remove implementation details from user guide
Replace internal references (Yoga, CanvasKit, Paragraph API, style runs,
characterStyleIDs, vectorNetworkBlob, Kiwi binary, scene graph, font-kit,
Local Font Access API, COMPONENT type, override key format, hex codes, px
specs) with user-facing language across all 7 locales.
2026-03-08 09:55:25 +00:00
Clic droit → **Créer une instance** . L'instance apparaît à droite du composant source.
2026-03-03 09:15:39 +00:00
## Détacher une instance
Use <kbd> for keyboard shortcuts across all docs
Wrap all keyboard shortcut references in <kbd> tags in user guide,
reference, and development docs across all 7 locales (en, de, es,
fr, it, pl, ru). Tables, inline prose, and parenthetical hints.
2026-03-08 09:48:02 +00:00
< kbd > ⌥< / kbd > < kbd > ⌘< / kbd > < kbd > B< / kbd > — devient un cadre sans lien.
2026-03-03 09:15:39 +00:00
## Synchronisation live
Remove implementation details from user guide
Replace internal references (Yoga, CanvasKit, Paragraph API, style runs,
characterStyleIDs, vectorNetworkBlob, Kiwi binary, scene graph, font-kit,
Local Font Access API, COMPONENT type, override key format, hex codes, px
specs) with user-facing language across all 7 locales.
2026-03-08 09:55:25 +00:00
Modifier un composant met à jour automatiquement toutes ses instances. Les propriétés synchronisées incluent les dimensions, les couleurs, les contours, les effets, l'opacité, les coins arrondis et la mise en page.
2026-03-03 09:15:39 +00:00
## Surcharges
Les instances peuvent surcharger des propriétés sans rompre le lien.
## Hit testing
Clic sélectionne le composant. **Double-clic** pour entrer et sélectionner les enfants.
| Action | Mac | Windows / Linux |
|--------|-----|-----------------|
Use <kbd> for keyboard shortcuts across all docs
Wrap all keyboard shortcut references in <kbd> tags in user guide,
reference, and development docs across all 7 locales (en, de, es,
fr, it, pl, ru). Tables, inline prose, and parenthetical hints.
2026-03-08 09:48:02 +00:00
| Créer composant | < kbd > ⌥< / kbd > < kbd > ⌘< / kbd > < kbd > K< / kbd > | < kbd > Ctrl< / kbd > + < kbd > Alt< / kbd > + < kbd > K< / kbd > |
| Créer jeu | < kbd > ⇧< / kbd > < kbd > ⌘< / kbd > < kbd > K< / kbd > | < kbd > Shift< / kbd > + < kbd > Ctrl< / kbd > + < kbd > K< / kbd > |
| Détacher instance | < kbd > ⌥< / kbd > < kbd > ⌘< / kbd > < kbd > B< / kbd > | < kbd > Ctrl< / kbd > + < kbd > Alt< / kbd > + < kbd > B< / kbd > |