So I have a symbol with an ON/OFF state, and I have that nested in another nested symbol with three other symbols with similar ON/OFF states. They are all connected and prototyped correctly.
I have noticed in Preview mode that when I toggle one of the symbols, the whole nested symbol layer freezes and I can’t toggle anything other than the last clicked symbol. This seems to only happen with Nested symbols that have more than one symbol in it. Others that have only one symbol with an ON/OFF state works fine. I’m not sure if this is a complexity issue.
Does anyone have any ideas or can tell me what I may be doing wrong?
Hey there. I’d love to take a look at this and resolve it for you. Could you copy just the relevant assets into a new Sketch document and upload it here? Thanks.
Hey Brett, thanks for your prompt response.
To reproduce-
Run the Preview of the Main Panel.
Toggle the circular switches ON/OFF
Then Toggle the measurement area ON/OFF (any of the two buttons)
You’ll find that you can’t go back to toggling the circular buttons on the left any more, and if you click a blank area to show the hotspots, it appears the hotspots vanish.
Hope I’ve explained that well.
Thanks a ton
Hi again.
The reason you are not able to toggle some buttons on some Overlays is because you have set the Outside Interaction to “None". If you change this to “Allow All” then you should find that you can access any interaction without restrictions.
One other thing though – I notice you are using Overlays for each of these different toggles, with a very quick 0.3-second dissolve transition. Do you definitely want to keep it that way?
I ask because it would be a lot easier to set these up as actual self-contained instant toggle switches, which just alternate between On (visible) and Off (hidden) on each click.
If you are OK with that, let me know, and I can help you in setting that up.
Thanks a million for that. I’ve set my Outside Interaction to “Allow all” and can now toggle all switches infinitely. I assumed that since all the Overlays were covering the entirety of the artboards they were aligned on, Outside Interaction wouldn’t really apply, so thanks for pointing that out.
Regarding the transitions, I had originally set all of them to instant, but then changed some to dissolve as I was in the process of trying all options to troubleshoot the toggle issue above because the ones that were working on other overlays, had dissolve, and I hadn’t worked out that it was to do with the Outside Interaction option. My preference is that they should be instant and all the other buttons in my document are instant.
What do you mean by actual self-contained instant toggle switches? Do you mean all symbols in one artboard and just toggle the visibility of the icons using the instant transition? If it is that, I’m in the initial phases of the design and deliberately have separate artboards for ON and OFF. I may change that later. If you’re referring to something else, I’m keen to know what. Thanks!
Hi there.
Regarding the self-contained instant toggle switches I mentioned earlier, you can set up each switch as a standalone Symbol, no Overlays needed. Then in each Symbol have two groups, one for On and one for Off. On one of those groups, set up a layer(group) visibility toggle in the Prototype tab. Then you can drag in as many Instances of these Symbols as you wish.
I have made the edits to the two left buttons, and attached the edited document here, so you can see how it’s put together.
Let me know if it’s not clear. Thanks.
Thanks a lot for that. I remember our chat from last time, and appreciate this is a lot cleaner. But because I’m in the initial design phase I have naturally created artboards with separate ON/OFF symbols, and at the moment prefer it that way.
Thanks a lot for your continued assistance to my queries, it’s much appreciated.
