Adobe XD is a great tool. & automation is a great approach to make work more easy.
XD provides some features that you can use to semi-automate things.
Padding in components is one of them.
It’s great to create a button, give it a padding & let it auto-grow while changing its label.
But there’s a catch:
When your button has to have a minimum size & the label-text is not wide enough to grant that minimum. That means a loooooot of fiddling while designing, especially when you have lots of states (default, hover, focus, active, deactivated, you name it …)
But wait: there’s a hack!
- Create the component
- Apply the padding
- Add an invisible shape on top of the background shape
- Give it the dimensions of minimum size + padding & voilà
