Can I have one element of a group set to "fix position when scrolling" and not the other?

So I want to prototype filters, and to do so I found a way of doing it but the problem is that I would need to use a group of 2 elements inside of a variant and make one of those elements stay in place when I scroll but not the other. I know it’s a little complex, I can share some images if needed so it’s easier to understand :yum:

As far as I know, you can’t do so but maybe there is another way to achieve what you are looking for. Yes please, images definitely would help :slight_smile:

Thanks for writing back so quickly! Okay here we go: I would like to use this chip filters to show different kind of restaurants on the map. There can be multiple filters selected at the same time. Initially there would be no filters selected and the user would see every single option on the map.
image

But then, as I start selecting filters I would like to only see those I selected. So let’s say I first click on “red”, the red chip would be active now and I would only see the red dot on the map. If I then click on black I would see the red and black dot and so on…

To achieve this I thought of making a frame where all the filters are inactive and all the dots are visible at first. And as soon as I click on one filter chip, it takes me to another frame where there are no dots on the map. Like this:
IMAGE 2

This is because now I don’t want ALL the dots to be visible, only the one corresponding to the filter I selected.
IMAGE 3

This is how I made my variants. So the grey chips would be Variant1, and the coloured chips + the dot would be Variant2.

So when I start the process and I’m at FRAME 1, I click on a filter, it takes me to FRAME 2 where there’s no dots, but the Variant of the chip changes and it brings the corresponding dot with it.

On FRAME 1 as the filters and dots are separate elements and not a group I can check “fix position when scrolling” for the filters and not for the dots, as I need it to be. But on FRAME 2 I’m seeing Variant2 of the filter, so the filter and dot are grouped and they would both stay fixed when I scroll the map or not fixed, and that is my problem.

Hope you can understand, sorry for writing sooo much :slightly_smiling_face:

IMAGE 2:
image

IMAGE 3:
image

Can’t upload multiples images on the same message cause I’m new

If you don’t need more functionality than that, you can just duplicate your frame three times and remove the elements you don’t want.

Demo:

The problem is that what I’m trying to design needs around 8 filters. And multiple filters can be active at the same time. So I would need to create lots and lots of frames to get every single possibility on the prototype. I think that I should do it using interactive components

You want to be able to activate every single combination of filters? You can make one component with two variants for every color, and then overlay them all on the base frame.

Demo:

Okay yes, I want to activate every single combination of filters and your file achieves that perfectly. But I also want to be able to scroll (cause in my case i’m designing over a map) having the filter rectangles stay in the same place of the screen, while the dots don’t. Cause the dots represent places on the map and it would make no sense for them to be moving around. I think this might be a little too complex to prototype on figma, or even impossible :upside_down_face:

Some Figma wizard can probably do it, but it’s a bit out of the scope of the software. It’s made for prototyping, not building complete applications. I would do only a few filters and make the variants for it, so that it demonstrates the functionality. Then just have placeholder buttons for the rest of the filters, showing that there can be many more.

Demo:

Okay thank you for helping me! I’ll design it like the last demo you sent, maybe prototype 3 or 4 filters at most. This was really helpful.
Thanks :grin:

Happy to help! You may check the checkmark under my previous comment to mark the thread as solved.