Scale all component states when scaling the instance
I have animated icons with auto animate and wish to use them in two sizes: Small size in the menu and big size in the features page.
When I scale up or down the component it only scale that one specific state. We need it a way to scale all states so we can have a few less components. and a fast workflow.
Agreed, this is so close to. The default state auto resizes great, but then having to go through and rechange the size on the hover state background for EACH layer in a chart is painful.
Gavin Stokes commented
There is a lot of small stuff in XD that really stacks up the more you use it...and this one just kills me, I've an input box with 4 states, not including the default...I have to scale each state, that's just nuts. Can we get this fixed, simple check box or something
Ephie Risho commented
I have run into this issue dozens of time on every project. Components and states are nice, but not anywhere near as robust as they could be with this simple change. Examples would be form fields with hover and active states.
Which brings me to a tertiary request: text changes. How nice it would be if XD had an option on components to allow changing all text within that instance. I can't tell you how many times I copy/paste a button, toggle, menu, nav or really any item, and have to go in and individually change the text of every state as well. What a silly waste of time. Please, Adobe, give us these two features soon.
This behaviour absolutely needs to change, right now components are pretty useless as a result.
If you resize the DEFAULT state, those changes should propagate to the child states.
If you resize the child states, they should be unique. I cannot believe it was designed this way.
Sometimes a component containing various states is pre-made.
However, when the size needs to be changed, only the current state will change, and other states will not change at all.
The application of component functions is restricted.
After all, in the drawing board, it is unlikely that the same component requires only one size.
Jonathon Barth commented
Some components may be too complex to just include scaling functionality by default across all states but I agree that having a checkbox to toggle "scale all component states" would be extremely handy with simpler components like custom icons, buttons, and input fields (this last item especially).
Concrete use case where it would be needed : simple and basic contextual menu. If I resize the main component (contener), I have to resize every components cell insides...
The worst thing is it will resize the current child component state, but not the others...
In addition, not every users are designers. The way it works make things way too hard to maintain.Our design system is shared with Project Managers, Product owner, Developers... This kind a detail is a real pain point for adoption in our company.
WTF XD – how do you not include scale!!!!! SMERIOUSLY????
Wanting to move over from Sketch to XD.. but their control over components is not as good as Sketch's Symbols - I want to be able to edit the sizing of the master component and it affect all instances - not have to edit each one separately as overrides!
Anyone know if they will be improving this?
Josh Laeupple commented
Definitely a big need!....It would save a lot of time.
Damn yes. I'm losing so much time not having this feature. The more I use XD, the more I'm wondering what Adobe's waiting for implementing basic features. (hello drop shadows on element groups, and hi static scroll !).
I am again surprised that this feature isn't there. There should be a way to select the whole button and resize all states, rather than just the default one.
Roel Berends commented
I could really use this feature.
Piotr Braszak commented
Yes, please, so very much! I got a project that spans across over 250+ artboards. All of them use some master components, and if a feedback comes to change a certain component, it'd save me unbelievably large amounts of time. Not to mention all buttons that come inside that component too.
I am also looking forward to seeing this update made. The states almost aren't usable otherwise.
Luis Rodrigues commented
The components really need more features of overriding and instance like in Sketch, I am working on a huge DS and I have been importing components from Sketch when I want to use a symbol and replace for another icon inside we should have an easy way of replacing this, it happens that when I drag the icon from the components because it has a different size, overrides the size assuming the size of this icon it's completely insane
This basically renders this software unusable seeing as if I don't get the size EXACT or God forbid I need a different size I have to resize all the states... terrible.
John Vanore commented
It is not true that if you resize the default state of the component, the other states will also resize. This only works on a master component. Any other instances of components require resizing every single state individually, even if you resized the default state first. The other states do not resize, not even when responsive resize is set up identically across all states. Incredibly frustrating and making me rethink using XD as my prototyping tool altogether.
Come on adobe. You could just add an "apply latest transform to all states" button. This is annoying as all get out.
Christoph Leitner commented
The current behavior is annoying in most instances. A desirable behavior would be that if states have matching horizontal and/or vertical dimensions in the master component they should also have matching dimensions in instances which have been scaled - no matter what state was active when the scaling happened.
Example: I uses several instances of my table column header component for my table header. They are scaled to have different widths. There is a component state including a sorting arrow for the column which is used for table sorting. Changing the first column to the state without arrow and the third column to the state with arrow should not require scaling of the components – their width should just match.