Shapes and Text
Slides uses the shared Shape engine for editable shapes, connectors, and shape text. FSlide.insertShape() returns a shape Facade backed by the Slides command pipeline.
Insert a shape
const slide = univerAPI.getActivePresentation()?.getActiveSlide()if (!slide) { throw new Error('No active slide')}const shape = slide.insertShape({ shapeType: univerAPI.Enum.ShapeTypeEnum.RoundRect, transform: { left: 80, top: 64, width: 320, height: 120 }, visible: true, selectable: true, shapeData: { fill: { fillType: univerAPI.Enum.ShapeFillEnum.SolidFill, color: '#dbeafe', }, },})insertShape() can return null when the Shape host adapter is unavailable or the input cannot be created. Register the Shape dependencies used by the Slides setup before inserting shapes.
Add rich text
if (shape) { const richText = univerAPI.newRichText() .text('Quarterly ') .bold('review') shape.getText() .setRichText(richText) .setHorizontalAlign(univerAPI.Enum.HorizontalAlign.CENTER) .setVerticalAlign(univerAPI.Enum.VerticalAlign.MIDDLE)}Use slide.getShape(id) or slide.getShapes() to retrieve shape Facades. Common element methods update position, size, visibility, name, and description; slide.deleteElement(shape) removes the shape.
Edit shape text
Use the shape returned by insertShape() below or in the preceding example. getText() returns a live FShapeText handle. Read plain text with getPlainText(), replace the entire text with setText(), and format it with font, color and alignment methods.
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() replaces the existing text; use setRichText() when you need multiple styles in one shape. To modify existing rich text, call getRichText()?.copy(), edit the builder, then pass it to setRichText(). Changes to that detached builder are not applied automatically. See text style and text box padding and layout for more options.
const richText = univerAPI.newRichText() .text('Quarterly ') .bold('review')shapeText.setRichText(richText)Shape format painter
Select a shape, activate the format painter, then select the target shape. It copies fill, stroke, effects, and supported text formatting while keeping the target’s identity, geometry, text content, and formula bindings. Clear formatting restores insertion defaults. SmartArt is excluded. The corresponding shape UI plugin registers this behavior automatically.
How is this guide?