Conditionals with External Components and variables

[Jonathan_Arnold2]

I want to build a simple flow with two screens showing questionnaire that are mandatory two answer.

How can I use my external components (buttons, option button cells) to update the buttons based on when an option button has been tapped?

The “Continue” button state should change to Selected when an option above is selected and allows to move on to the next screen when tapping “continue”.

I get it working with local components but I won’t with more complex external components that have more than 2 states (default, selected, disabled,…)
The “Continue” button should change color on tap, allowing to go

[Haroll]

Hi @Jonathan_Arnold2

Here are two solutions depending on how the button component was built.

Boolean variable

This solution required the button to have a boolean property in order to toggle its selected state.

1. Create a boolean variable (e.g: question-1-answered set to false by default),
2. Add a interaction “on click/on tap” to the options (“For Me”/“For Michael”) and set question-1-answered at true
3. Bind the boolean variable described below to the “selected” property of your button

---

Additional view

1. Duplicate the view “Survey first question”
2. Add to the interaction of the options (“For Me”/“For Michael”) a “Navigate to” and link it to the duplicate view
3. On the duplicated view, change the state of the button to the desired one

Let me know if it helped!

[Avokadomos]

Here’s an example showcasing a conditional button with some checkboxes. You can use the same setup, add a connection from the continue button to the next frame, and add a conditional that checks if the state variable is correct before transitioning to the frame.

You can open up and inspect this file:

[Brian_K]

Trying to replicate this on my own and having some trouble. So in my example I have a navigation menu and I want to have one button be the active state, and all other buttons be inactive. And then if you click an inactive button, that one becomes active and the currently Active button becomes inactive. Is this possible?

[Avokadomos]

Sounds like you’re talking about radio buttons:

Or something like this, but changing it to on click instead of mouse enter:

[Brian_K]

I guess I should have looked at the rest of your file first Thanks for the reply, let me dig back in.

Okay back, not quite what I was thinking. I was thinking driven by variables, not just creating every variation of something and swapping it out. The variables and conditionals are supposed to do the hard work so I don’t have to!