Scrolling issue on PWA version (intermittent)

Hi there,
I notice that the scrolling on my list page does not work smoothly. Most of the times I cannot scroll down (trying multiple times) and then a few secs later it works. Scrolling up shows the same intermittent issue. I’m using the test link on my phone (Safari/iOS). I have a video screen capture (mp4) but not allowed to upload to this forum?

FYI it’s a normal page that contains a list of 10 items incl image and text (with ‘none’ in the edit styles section), which are displayed in 2 columns.

thanks a lot! Janna

Hello, I usually make an invisible rectangle as space, to place under your app bar, then the whole screen will scroll without issues. Make sure to size your list following the top rectangle red lines.
Look this

Thx a lot for your reply @Eugen! Unfortunately I don’t see where I can set the app bar fixed on top and bottom bar fixed to bottom? Although they do behave this way when I scroll, whether successfully or stuck. I’m not 100% sure if I understood your rectangle correctly, I made a screenshot of my implementation, is this correct? It has the same width as the list. Or should the invisible rectangle be the full page in between the both bars?



Let me go back to you this evening when I can work on PC, so I can show you screenshots from adalo editor

That would be great, thanks a lot @Eugen :pray:

Im having this same issue. For me, the problem is caused by the lists wanting to scroll a little “within” their container before the page will start scrolling normally with the list fixed in place.

The behavior is very buggy and inconsistent, but it only happens with some lists. Some of my screens work great, some of them are really hard to scroll through because of this list scroll bug.

I can not figure out what is causing the problem. There’s no apparent rhyme or reason. Im suspicious of actions though - it seems like lists with actions are way more likely to have the problem than lists with no links or actions… But I dunno.

I have been preparing to make a help post on this, will try to get some screen caps of the behavior in action. Has anyone else encountered this problem?

@tbtilton thanks for your reply, that sounds like a good analysis.

Fyi my list consists of several components:

  • an shadow rectangle on the background
  • an image
  • a ‘card’
  • 2 labels below each other

Before I created this post, I’ve searched the forum and found several people with the same issue, but nowhere a solution was proposed. The posts I found were from 2021 though.

Have a nice day,
Janna

@jannava

Here is a video of the behavior on one of the screens in my app.

You can’t see where my cursor is in the video, but you probably can still make out what’s happening. The two lists in the “Material Summary” section at top are misbehaving, and scrolling within their containers, which breaks screen scroll. The list in the “receipts” section below is behaving normally.

This is currently happening in probably around 1/3 of the lists in my app. I have “fixed” a couple of them by just deleting the list then rebuilding it again from scratch. I’ve also “fixed” a couple by just routinely editing them - adding/deleting components, adjusting layouts, colors, links, etc. It’s incredibly random and frustrating. But I really don’t want to have to go through the whole app and fully rebuild the dozen or so lists that are still acting up - way too much work! I kind of hope that once it’s built into native and published the problem will just go away…

@jannava

I’ve been studying this problem in my app a bit harder today. I THINK I’m becoming more certain it has something to do with conditional visibility and/or links/actions being “too close” to the top or bottom edge of the list. I’ve fixed a couple of my lists today by either eliminating the conditional visibility of a component inside the list (so that the list doesn’t “shrink” when that component is “not visible”. I also just fixed a list by moving a component with a link action associated to it about 10 pixels up from the bottom edge.

My suspicion is that the “haze” that surrounds a component with an action applied, which expands the region of touch sensitivity to activate that action outside it’s perimeter, might push beyond the edge of the list container when it’s too close to the edge, causing the weird behavior.

I don’t really know for sure though, because some of my lists have action components right against the edges and work fine.

Another thought is that there might be some “ghost” space left behind when a component is made not visible, and if that space pushes outside the container of the list, then the bad behavior will ensue.

None of my observations or tinkerings today explain the randomness of the issue though. I just created a new list with only 5 components in it, no conditional visibilities, and it acted up. To fix it, I just deleted it and rebuilt it and it worked fine. Very strange.

yeah that’s the weird thing…I’ve rebuilt things as well and now my friend does not experience the issue anymore, but I still do…I created a new app even. Would be great if Adalo support could have a look.

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.