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

TypeScript

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

TypeScript

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.

How is this guide?