I want to create a button that changes to a different state when clicked without changing artboards

[elizabeth5FE2]

Hi! I want to create a button on my XD site that changes from a red + to a pink check mark when clicked without switching the artboard. Ive tried a hover state that changes the button, but right after clicking it changes right back to its default state a second later. Is it possible to make this work without switching artboards?

[Myra Ferguson]

It looks like you have your button set up with two states so go to the Prototype mode and set up the interaction for the button to go to the active state. To set that up--select the button, and in the Property Inspector in the Interaction section, click the "+" button to add a trigger. Set the Trigger to Tap (I'm assuming that's the interaction you want). Then, down in the Destination section, select the name of your active state. When you preview it and click on the button, it should go from your plus to your checkmark.

[elizabeth5FE2]

I have tried this, my issue is that when I go to select a destination, it will not let me choose a destination on the same artboard, it will only let me select another artboard. Is there a way to fix that or maybe there is a setting that I am missing? I am pretty new to XD.

[Myra Ferguson]

It sounds like the button hasn't been made into a component yet. To turn it into a component, go back to the Design mode, select the artwork for the Default state and go to Object > Make Component. In the Properties panel, click on the "+" to the right of Default State to add a state. Select New State. Select the content and modify it for this state.

Then you should be able to go to the Prototype mode, add a Trigger, and set the Destination to either an artboard or a state.