targetAspectRatio
When toggled, causes the layer to keep its proportions when the user resizes it via auto layout, constraints, the properties panel, or on-canvas. If not set, the node does NOT resize toward a specific targetAspectRatio.
Supported on:
Signature
targetAspectRatio: Vector | null [readonly]
Remarks
Use lockAspectRatio
and unlockAspectRatio
to set targetAspectRatio.
const parentFrame = figma.createFrame()
const image = await figma.createNodeFromJSXAsync(
<figma.widget.Image
src="https://picsum.photos/200/300"
width={200}
height={300}
/>
)
parentFrame.appendChild(image)
image.lockAspectRatio() // set to 2:3 ratio, implicit from the size
// Add autolayout to parent, which defaults to Hug x Hug
parentFrame.layoutMode = 'HORIZONTAL'
// Set child to fill-width
image.layoutGrow = 1
// Resize parent to be much larger
parentFrame.resize(500, 1000)
// Since the child is fill-width, it will expand to the available space
image.width == 500
image.height == 750
// Image maintains the 2:3 ratio even as it grew with auto layout!
caution
⚠️ targetAspectRatio
cannot be used with auto-resizing text (TextNodes where textAutoResize !== NONE).