Dynamic Component Resizer
With this plugin, you'll be able to setup components and resize their instances while maintaining the spacings that you've set in the master. This is done to maintain spacing for when the height of an element has changed in the instance, i.e. if you have text change from 1 line to 2. Requirements: Master components are required to have a frame, the plugin looks for this. Within the frame you must have 2 elements; these are the ones that you'll fill up with content and will change from instance to instance. This usually is a "header" and "body copy" (see artwork picture above). The frame must have the following settings: - Either contrained "top and bottom" or "scale" (vertical) The top element must have the following settings: - Constrained to the top - Grow vertically (for text) - Align top (for text) The bottom element must have the following settings: - Contrained to the bottom - Grow vertically (for text) - Align bottom (for text) If you've done this setup, open up the plugin modal, select the element or elements you want to resize and click "run". The plugin will run it's magic. It will maintain the space between the two elements within the frame (in the example in the artwork, 20px). If you want to change the spacing, adjust the master, then select the elements and return the plugin. I will create an automatic resizer when figma allows for long lasting plugins. Any other feedback, feel free to email me at [email protected]
Plugin Preview
About this plugin
With this plugin, you'll be able to setup components and resize their instances while maintaining the spacings that you've set in the master. This is done to maintain spacing for when the height of an element has changed in the instance, i.e. if you have text change from 1 line to 2. Requirements: Master components are required to have a frame, the plugin looks for this. Within the frame you must have 2 elements; these are the ones that you'll fill up with content and will change from instance to instance. This usually is a "header" and "body copy" (see artwork picture above). The frame must have the following settings: - Either contrained "top and bottom" or "scale" (vertical) The top element must have the following settings: - Constrained to the top - Grow vertically (for text) - Align top (for text) The bottom element must have the following settings: - Contrained to the bottom - Grow vertically (for text) - Align bottom (for text) If you've done this setup, open up the plugin modal, select the element or elements you want to resize and click "run". The plugin will run it's magic. It will maintain the space between the two elements within the frame (in the example in the artwork, 20px). If you want to change the spacing, adjust the master, then select the elements and return the plugin. I will create an automatic resizer when figma allows for long lasting plugins. Any other feedback, feel free to email me at [email protected]
Plugin Details
Version | 4 |
---|---|
Created | July 19, 2019 |
Last Updated | August 13, 2019 |
Category | Software development |
Creator | Daniel Maddock |
Stats | 4244 installs, 48 likes |
Pricing | Free |
Technical Details
- API:1.0.0
- UI:ui.html
- main:code-primative.js
More Like This
Discover other plugins in the Software development category.