How to make scroll area in a element for a native app?

Now this:


スクリーンショット 2020-10-11 22.40.40

And I want to make this:

I researched some related topics on here but I don’t understand why it doesn’t work.
I think it would be solved super quickly by using CSS but does it work on a native app?
Or maybe I miss something important?

set the RG to full list or extended vertical scrolling

But I don’t think you want to do that :thinking:

What comes to mind creating really tall RG cell and checking the “shrink the element height…”

What you need here is to set the overflow-y value of an element. Searching the forum on “overflow-y” will throw up a few results for you.

In a nutshell, what you’d probably do in your example is wrap that text element into a group, then change the height of the group manually so it’s shorter than the text element. For example, you might want to set it to 350px. Give your group an element id, say “scroll” and then have a small HTML element sitting in your RG cell which looks like the below.

<style>
    #scroll {
        overflow-y: auto;
        min-height: 350px;
    }
</style>

I’ve not done this for an element inside a cell before, so you might need to make the elementId dynamic by adding the cell number to the end of it (and then the same inside the HTML)

Should get you started though :slight_smile:

1 Like

Thank you for your response !!

I tried both but nothing came out on screen… even RG.
I can’t find the “shrink the element height…” on RG setting window so set it on text (in RG) but this text disappeared :disappointed_relieved:

have a look at this

Yes exactly.
I have no idea except for that solution for now, but it works on a native app???

Try this

Oh I see, I misunderstood the question. Sorry about that

The workaround in Bubble would be to put the RG into RG

(update: nope it would have to be a list then)

(update 2: well if you use converted to a list, it works

1 Like

Wow amazing! This is it!!!

I feel a little bit weird to put the RG into RG but I’ll try like this!

SUCCESS !!

and, to show just one RG area, changed the Layout style to “Fixed number of cells” instead of “Full list”:
スクリーンショット 2020-10-12 1.08.17

Thank you soooo much @bartek.dev !!! :heart_eyes:

1 Like