Hi there, I've attempted to use this solution. I have a component inside a component. The child component has two states (Default, Tapped). The parent has several, but the two that are relevant are "Default" and "Default Multi." The child component exists on Default Multi. Ideally, I would like to have the child component change to tapped, pause briefly and THEN have the state of the parent model change to Default. But I can't even get two different interactions to work (Hover on the component, Tap on the group), and you can't reach the child component states from the group.
Hi Julie! Are we talking about a mobile app or a desktop prototype? The 'hover' state won't work on a phone. If that's the case, you can do the following:
1. Add another state on the parent component, which will handle the transition phase. Let's call it "Default Transition".
2. On your Default Multi state, where the child component is, wrap the child component in a group as the example above, and then add a tap interaction to the group pointing to the "Default Transition" state of the parent.
3. On the "Default Transition" state, change the child component to it's active / tapped state. Then you need to use a little hack, to transition to the Default state after a delay, using an empty lottie file as a time-trigger. I've described how to do it in this thread.
Now when you tap on the child component's group, you will change the parent's state to Default Transition, which should look the same, but the child component here is in "active" state, and after a second or whatever you set as the delay, the lottie End of playback trigger will switch the parent to the Default state.
Sorry there's no simple solution, but there are no time triggers for components, and since we can't control one component with another, we're stuck to such hacks and workarounds 🙂
AdChoices