# Formes

- Human documentation: [https://docs.univer.ai/fr-FR/guides/docs/features/shape](https://docs.univer.ai/fr-FR/guides/docs/features/shape)

- Agent Markdown: [https://docs.univer.ai/fr-FR/guides/docs/features/shape.md](https://docs.univer.ai/fr-FR/guides/docs/features/shape.md)

- Requested language: `fr-FR`

- Content language: `fr-FR`

- Documentation version: `1.2.0`

- Source: [docs/features/shape.fr-FR.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/docs/features/shape.fr-FR.mdx)

---

#### Package metadata

```json
{
  "mobile": true,
  "plugins": [
    {
      "client": "@univerjs-pro/engine-formula"
    },
    {
      "client": "@univerjs-pro/docs-shape"
    },
    {
      "client": "@univerjs-pro/docs-shape-ui",
      "locale": "@univerjs-pro/docs-shape-ui/locale/fr-FR",
      "style": "@univerjs-pro/docs-shape-ui/lib/index.css"
    }
  ],
  "license": true,
  "server": false
}
```

La fonctionnalité de formes permet d’insérer et de modifier des formes et des dessins dans un document, notamment des formes géométriques de base, des flèches et des éléments d’organigramme.

## Introduction

Dans Univer Docs, les formes vous permettent de :

* **Insérer des formes géométriques** : ajoutez des rectangles, des cercles, des flèches, etc.
* **Personnaliser leur apparence** : ajustez les couleurs de remplissage, les bordures et le texte.
* **Les positionner librement** : placez les formes où vous le souhaitez dans le document.

## Mode plugin

### Installation

#### npm

```bash
npm install @univerjs-pro/engine-formula @univerjs-pro/docs-shape @univerjs-pro/docs-shape-ui
```

#### pnpm

```bash
pnpm add @univerjs-pro/engine-formula @univerjs-pro/docs-shape @univerjs-pro/docs-shape-ui
```

#### yarn

```bash
yarn add @univerjs-pro/engine-formula @univerjs-pro/docs-shape @univerjs-pro/docs-shape-ui
```

#### bun

```bash
bun add @univerjs-pro/engine-formula @univerjs-pro/docs-shape @univerjs-pro/docs-shape-ui
```

> [!WARN]
> Les formes nécessitent aussi `UniverProFormulaEnginePlugin` du package `@univerjs-pro/engine-formula`. Dans votre code d’initialisation de base, remplacez l’importation et l’enregistrement de `UniverFormulaEnginePlugin` par ce plugin. N’enregistrez pas les deux moteurs de formules : l’insertion de formes pourrait échouer avec une erreur de dépendance manquante.

### Utilisation

```typescript
import { UniverDocsShapePlugin } from '@univerjs-pro/docs-shape' // [!code ++]
import { UniverDocsShapeUIPlugin } from '@univerjs-pro/docs-shape-ui' // [!code ++]
import DocsShapeUIEnUS from '@univerjs-pro/docs-shape-ui/locale/en-US' // [!code ++]
import { UniverProFormulaEnginePlugin } from '@univerjs-pro/engine-formula' // [!code ++]
import { LocaleType, mergeLocales, Univer } from '@univerjs/core'

import '@univerjs-pro/docs-shape-ui/lib/index.css' // [!code ++]

const univer = new Univer({
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: mergeLocales(
      DocsShapeUIEnUS, // [!code ++]
    ),
  },
})

univer.registerPlugin(UniverProFormulaEnginePlugin) // [!code ++]
univer.registerPlugin(UniverDocsShapePlugin) // [!code ++]
univer.registerPlugin(UniverDocsShapeUIPlugin) // [!code ++]
```

Si vous disposez d’une licence commerciale Univer, consultez la page [Utiliser une licence côté client](https://docs.univer.ai/fr-FR/server/license.md#in-plugin-mode) pour connaître la procédure de configuration.

## Prise en charge mobile

Configurez d’abord l’[éditeur mobile](https://docs.univer.ai/fr-FR/guides/docs/getting-started/installation.md#mobile-support). Dans l’initialisation en mode plugin de cette page, remplacez les inscriptions de bureau ci-dessous par les exports mobiles des mêmes paquets **avant d’ouvrir un document**. Conservez modèles, styles, traductions et imports Facade ; n’enregistrez pas les deux variantes.

| Paquet                        | Inscription de bureau     | Inscription mobile              |
| ----------------------------- | ------------------------- | ------------------------------- |
| `@univerjs-pro/docs-shape-ui` | `UniverDocsShapeUIPlugin` | `UniverDocsShapeMobileUIPlugin` |

## Modifier le texte d’une forme

Utilisez la forme renvoyée par `insertShape()` ci-dessous ou dans l’exemple précédent. `getText()` renvoie un objet [FShapeText](https://docs.univer.ai/fr-FR/reference/facade/shape-text.md) actif. Lisez le texte avec `getPlainText()`, remplacez-le entièrement avec `setText()` et réglez la police, la couleur et l’alignement.

```ts
import '@univerjs-pro/docs-shape/facade'

const document = univerAPI.getActiveDocument()
const paragraph = document?.getParagraphs()[0]
if (!document || !paragraph) throw new Error('No active document paragraph')
const shape = document.insertShape({
  shapeType: univerAPI.Enum.ShapeTypeEnum.Rect,
  placement: {
    wrappingStyle: univerAPI.Enum.TextWrappingStyle.INLINE,
    anchor: { paragraphId: paragraph.getId(), segmentId: paragraph.getSegmentId() },
  },
})
if (!shape) throw new Error('Shape is not available')
const shapeText = shape.getText()
console.log(shapeText.getPlainText())
shapeText
  .setText('Quarterly review')
  .setFontSize(18)
  .setColor('#2563eb')
  .setBold(true)
  .setHorizontalAlign(univerAPI.Enum.HorizontalAlign.CENTER)
  .setVerticalAlign(univerAPI.Enum.VerticalAlign.MIDDLE)
```

`setText()` remplace le texte existant. Utilisez `setRichText()` pour combiner plusieurs styles. Pour modifier le texte enrichi existant, appelez `getRichText()?.copy()`, modifiez le constructeur puis transmettez-le à `setRichText()`. Ses modifications ne sont pas appliquées automatiquement. Voir aussi les [styles de texte](https://docs.univer.ai/fr-FR/reference/facade/shape-text.md#settextstyle) et les [marges et la disposition du bloc de texte](https://docs.univer.ai/fr-FR/reference/facade/shape-text.md#settextboxoptions).

```ts
const richText = univerAPI.newRichText()
  .text('Quarterly ')
  .bold('review')
shapeText.setRichText(richText)
```

## Reproduire la mise en forme des formes

Sélectionnez la forme source, activez le pinceau puis choisissez la cible. Il copie remplissage, contour, effets et styles de texte pris en charge en conservant identité, géométrie, contenu et liaisons de formules de la cible. Effacer la mise en forme restaure les valeurs d’insertion. SmartArt est exclu. Le plugin UI correspondant active ce comportement automatiquement.