Button tool - style text box with border, background color, padding (auto resized when text changes)
To speed workflow it would be good to have button tool in the sidebar. In the property inspector you'd have the ability to specify the top,bottom, left and right padding. the width of button would dynamically resize as you type the button's label.
Farhan Ahmad commented
Yes there's this feature needed with fixed padding left and right top and bottom and width should be followed with text size width and height.
This is one major thing that's stopping me from using XD over Sketch more. The Anima plugin for Sketch is great at tackling this issue so I'm eagerly awaiting Anima to become compatible with XD, or for Adobe to add a similar feature in an update. Some news would be great!
How is this not a thing yet?
Jonas Hartmann commented
Any news here?
Robin Wolf commented
Please add a solution provide a plugin to auto adjust the width of buttons as text changes:
André Rocha commented
Any updates, guys?
And also include shadow as formatting. I have just used a component for a button for a white label interface and just realised it doesn't work well if I add a shadow to the original component, as it gets cut out.
Azhar Khan commented
This shouldn't be just "button tool". Any rectangle should accept text and that text must have vertival/horizontakl allignment property and separate top/right/bottom/left padding similar to InDesign.
Can we have some news about ths feature please ?
Adobe, I can't believe this is not a thing yet!
+1 The current behaviour is inconsistent with most Adobe applications.
Vlad-Florin Iepure commented
Inset Spacing like in Indesign (custom indentation for text boxes)
This would solve the issue of doubling objects. At the moment, when you create a button, you need a text box and a shape. Inset spacing would solve this and at the same time would offer more control in overall spacing.
Buttons, the most common thing that interface designers need for every app. But a simple function which most of the design tools do not have.
With Sketch and a third-party plugin I worked around and made a dynamic button, with multiple layers:
Perfect, now I only use 1 button symbol, to create all.
* the primary colors
* text + icon - left
* text + icon - right
Matthew Simmonds commented
I am considering switching to another tool like Figma or Sketch because XD doesn't have dynamic buttons. It should have been in the tool right from the start.
Great idea. Let's add this to XD. Buttons are the most common element in UI today. Let's get it right.
Greg Olson-Hyde commented
I agree with the comments below – buttons are ubiquitous in web or app design and a button with padding, background and auto resizing as text increases should be a no-brainer
I really wonder why this has not been a part of the app from the start.
Buttons might be one of the most ubiquitous component in UI Design, and yet no design tool (except production tools such as Webflow or Xcode) offers a "button" natively in the toolbox... Quite puzzling right?
Please, add this feature, every time I draw a button using a rectangle + text and have to manually resize it, it just hurts.