Auto-Animate between different components

[chriss46940356]

Hi,

I tried looking for a way, but couldn't find any solution or any info in general on this subject, and I couldn't figure out any working solution on my own as well.

If I have 2 states of an element on my page and I create a separate master component for each of these states, because let's say the states are fairly different and I don't want to change the states every single time I use them if I create a single master component for the element.

Then I want to auto-animate them from one artboard to another.

But the problem seems that Adobe XD doesn't know how to animate properties between components even though they have the exact same structure/layers/objects/names and only the positions of the objects are different from one "state" component to another.

It does animate, but only does the fade over effect.

If I don't use separate components it works perfectly, the elements move nicely to their new position.

Is there a way to make this happen at all at the moment? Or is this a feature which is planned?

Does anyone have any more info on this?

Current animation between separate components with auto-animate:

Wanted animation, as possible with same component or using no component at all with auto-animate:

[Atul_Saini]

Hi Chriss,

Hope you are doing good. Thanks for sharing all the details and the video. If I understand this correctly, here is what you are trying to do.

If yes, please try the following interaction settings and share the results.

For more details, please see this link: - Auto-animate in XD​.

Thanks,

Atul_Saini

[chriss46940356]

Hi,

thank you for the fast feedback, but this doesn't really help me sadly.

I can get the animation you described to work just fine, just not with 2 separate components.

I have 2 components, their structure/objects/names are exactly the same, the only difference between component A and B is the position of the Text Object:

Here is a picture of the 2 example artboards with the components:

This is the way the animation is set up:

As you can see, the top animation with only one component is working just fine, but the animation which is supposed to switch between 2 different components (component A and B) is not working, but using the fade in/out transition instead:

[Atul_Saini · Accepted solution]

Hi Chris, thanks for sharing the details. This behavior looks as designed, please check the point 1 under " Before you begin" here: - Auto-animate in XD.​ You can say that it works on instances only, as in test with component A in your last video.

Feel free to submit your feedback here: - Adobe XD Feedback : Feature Requests & Bugs and share the thread so that we may keep track of it.

Thanks,

Atul_Saini