Padding

The same padding added to all sides of the Text Layer
Open in Framer

This is the space between the text itself and the edge of the layer. Adding more padding will make the Text Layer grow, in whichever direction it can.

So when using padding, you should give the layer the possibility to resize, by enabling autoHeight or autoWidth.

You can set padding globally, for all four sides:

textA = new TextLayer
    text: "Hello World"
    padding: 20

… or for each side individually:

textB = new TextLayer
    text: "Hello World"
    padding:
        top: 40
        left: 20
        bottom: 40
        right: 20

… or use horizontal to set left and right at the same time, and do the same for top and bottom with vertical:

textC = new TextLayer
    text: "Hello World"
    padding: 
        horizontal: 80
        vertical: 40

By using vertical and horizontal padding together with a background color, you can convert the humble Text Layer into a button (see the examples under Background Color).


Leave a Reply