Did a bunch of searching over the last several weeks and couldn’t find this exact dilemma:
When you set a row/column to Visible: False on a scrollable screen, the element still takes up space on the screen but just isn’t visible i.e. you just see a white space rather than nothing.
EDIT: This may be an iOS only problem
Example here using the Thunkable Scrollable Example:
There is a button at the bottom of the screen that has Visible: False set so you can’t see it but can clearly see on preview on phone that something is taking up space i.e. the container, you just can’t see the element inside the container. When you delete those non-visible buttons, the whitespace is reclaimed so the row is definitely “visible” in a sense
Is there any way around this so that the Visibility functions as if the element is truly “gone” i.e. not taking up space at all (height = 0) and not just replaced by whitespace?
Hi
Try this
Inserted a Row7 to hold the buttons with absolute height 35 so we can see them
Move buttons into Row7
Make buttons visible
Blocks for buttons add Button 2 visible = true
Screen 3 change to scrollable
Column1 change to not scrollable
Thanks very much for your response. Unfortunately, when I do that on my phone in live preview, you’ll find you can’t scroll down to see the fourth beaver. Like there is content down there and you can kind of drag it up but you can’t actually scroll down to it properly.
Annoyingly, on the computer live preview you can scroll down just fine as you’d expect it to behave but when you actually do the preview on mobile it doesn’t work. Like your solution works for the computer live preview mode but not on the actual mobile app unfortunately.
Not sure if this is a bug or not or if there is some sort of other solution?
I had the same issue on an IOS device, could scroll to the buttons at the bottom but the screen kept popping back up.
My fix was to add a row at the bottom of the screen, colored it to suit the App. Made the the row absolute height of 35 px
“I.e. Scrollable Screen not showing all content on iOS devices” but works fine on Android?
Because if I insert the ghost element at the bottom at the page that will help push the content up on iOS but then will just be a blank space on Android when you get to the bottom, a better problem obviously but still a problem.
Also, the difference in height of the element won’t necessarily be consistent, i.e. it’s not always 35px off the screen, sometimes it is much more if there is a greater amount of scrollable content. Effectively, this means you can’t really use a scrollable screen for iOS, especially as you have no way of knowing how much is cut off on different screen sizes (unless you have multiple test units at hand).
