How to select a specific state of a component after overlay in XD?

Report · May 07, 2020

Hi, I try to simulate a dropdown in Adobe XD. My dropdown component has 2 states, 'standard' & 'selected'. When taping it, an overlay of a different artboard is simulating the dropdown options. When taping again, I want to come back to my original page, but the dropdown component there should switch to its state "selected".
Is there a possibility to connect this state switch with the tap?

THX for support.

Report · May 07, 2020

Hi there,

Thank you for reaching out and using Adobe XD. I assume you are looking for this functionality: https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/13031871-add-multi... If so, please submit your feedback and upvote the request to add your voice.

If this is not what you're looking for, would you mind elaborating the workflow with the help of video for better understanding?

We will try our best to help.

Thanks,

Harshika

Report · May 18, 2020

Hi Harshika Verma,

thanks for your fast answer. This is not exactly what I need.
Please have a look at my XD project:
https://xd.adobe.com/view/42616f2e-8471-45c4-496d-f414120feb12-3450/?fullscreen&hints=off

In the first artboard "closed" there is a component defined called "project sidebar". The component has 2 states, standard and opened. When I click anywhere on the component, is is changing the state. But I only want to have a state change, if I press the red arrow, which is only a part of the component.
If I make only the arrow as a component, then I can achive the behaviour, but I cannot modify other elements outside, e.g. I cannot show the additional text "Show some information".
How can I solve this?

The second issue is with the other 3 artboards in the project. In the first view, I have an empty text field. I open a dropdown an selection an option. In the last view I like to show the selected state; so the text field should be change from hide to shown. I also would like to implement this only with 2 artboards instead of 3. Is there any solution for it? I tried to just change the oppacitity of the text field but this is not working.

Thank you very much for your support.

Report · Jun 04, 2020

I apologize for the delay in response. Is it possible for you to share the file with me over a private message so that I can investigate at my end? If yes, please upload the file to a shared location such as Creative Cloud Desktop app or Dropbox and share the url with me.

Note: Please share the url of this post for reference.

Thanks,

Harshika

Report · Jun 25, 2020

For your first part of the problems, I'd create two artboards: one with closed sidebar, and the other one with opened sidebar. Then you can trigger the auto-animate between the two artboards from the arrow button.

Your second problem requires only two artboards: one with a drop-down menu component, and the other showing the selected state. You can link the first one to the second one via a drop-down menu item.