Help needed: Adding Text to createShapeWithText 🛠️

[Rob37]

Hello Friends of Figma!

I’m building a Figjam plugin which generates shapes with dynamic text content, and I need your expertise to make it perfect!

I’m using the figma.createShapeWithText() function, which creates a nice shape just as expected. However, when it comes to adding text, I’m a bit stuck. I want to pass the randomText variable into the “characters” property, but no luck so far.

Has anyone here cracked the code for a similar situation? Your valuable insights would mean a lot to me!

Here’s what I’ve done so far:

async function createRandomTextShape() {
  const x = 100;
  const y = 100;
  const randomText = "Aliqua consequat elit ipsum.";

  const shapeWithText = figma.createShapeWithText();
  shapeWithText.shapeType = "ROUNDED_RECTANGLE";
  shapeWithText.x = x;
  shapeWithText.y = y;

  [...]

  shapeWithText.fontSize = 12;
  shapeWithText.textAlignHorizontal = "CENTER";
  **shapeWithText.text.characters = randomText;**

  figma.currentPage.appendChild(shapeWithText);
}

Massive thanks

[tank666]

Before changing text properties, you need to load the font.

loadFontAsync | Plugin API

Working with Text | Plugin API

Also you should change these lines:

shapeWithText.fontSize = 12;
shapeWithText.textAlignHorizontal = "CENTER";

to

shapeWithText.text.fontSize = 12;
shapeWithText.text.textAlignHorizontal = "CENTER";

[Rob37]

Thanks a lot Yury! I managed to do it

As you said I had to load the font before calling figma.createShapeWithText();