I know this is a known and acknowledged issue by both app builders and Adalo staff, but I want to ensure the conversation continues and this bug isn’t one that gets overlooked and lowered within the priority list. So far, I’ve enjoyed my Adalo experience. I think it’s a great platform for no-coders, with a simple yet robust design structure. After building an app using a free account, I finally got to my 49th row of data. Feeling good about what I was building so far, I didn’t hesitate to upgrade to a Pro account to continuing building my app. But once I uploaded a test version to Google Console and downloaded to my phone, I noticed my bottom tab bar was about half and inch higher on the screen than it should have been…but it wasn’t just the bottom tab bar. All pages and content essentially shifted up, and even the top bars and icons were spilling into the phone’s status bar. I searched to see if anyone else experienced the same thing and if a solution was found. To my amazement, I saw that this page shift bug is something that’s been an issue for more than a year now.
From what I can tell, there has been no solution, besides choosing the hide the status bar within EDIT STYLES. Unfortunately, that goes against Apple’s compliance. Other people have suggested to purposely design top and bottom bars lower to compensate. That too is not a good solution, since the bug doesn’t seem to affect ALL phones. Phones that would have otherwise been showing the bars properly would then be showing them lower than expected. There have also been advice to simple stick to side menus or floating menus that trigger when pressing an action button…again, those solutions aren’t acceptable either. I shouldn’t have to sacrifice critical, desired design elements because of a bug. And as a paying customer, I shouldn’t have to be tied down by what I consider to be a dealbreaker. Had I been privy to this bug before committing to a Pro account, I don’t think I would have gone through with paying for a subscription. Now I’m faced with three decisions:
Continue designing my app as I initially desired, knowing I can’t publish it in this current state until a proper solution is implemented
Change features/key functions within my app and go strictly with a side menu, though I’d still have to deal with top content shifting into a phone’s status bar or
Just stop everything for the time being and hope that this issue is a main concern of the team and will be addressed soon.
I’m honestly not sure what I will do now. I’ve been happily designing my app every day for a while now. Today was the first time I just didn’t work on anything within the app and that’s truly disheartening. With all that said, I trust the Adalo team. I have no idea how difficult it is the build platforms like this, and I’m sure it’s not an easy task to debug all issues, especially if a root cause isn’t identified. On top of that, I know the team has a strategic priority list of things they want to implement and accomplish…I just hope that this issue is high up on that list.
I guess it depends on the phone. From reading through a few other threads that talk about the issue, the bug is only present in newer phones. Below are a few links to other threads that had some back and forth on it. I only brought it back up, because the issue has seemed to he around for a while and nothing officially has been done.
I’m using an Oppo Find x2 Pro and it seems my phone has this issue too. When I view one of my favourite developed Adalo apps (NekoBox), it seems the tab bar has extra space under it too.
Sure is annoying for those who take design seriously but I guess it’s not the end of the world. Hopefully it gets fixed soon!
I downloaded NekoBox and yes, the extra space/page shift appears on my phone too. If you notice, when you press the “More” button on NekoBox, which opens a modal page, the background/previous screen temporarily shifts correctly in place. Then when you exit the modal page, it shifts back up again. True, it’s not the end of the world, but when you are a perfectionist, take design seriously and just expect for things to work at intended when you’re a paying customer, it’s extremely annoying. One thing I may try is to make the extra space seem intentional. The idea is to design a custom bottom tab bar with my logo below the icons. If I purposely place the bar beyond my pages’ bottom with just he logo showing below the border, the logo would show on phones that the bug affects. On phones that the bug doesn’t affect, then the logo should be hidden. I would still have to be mindful of my top content, search bars, etc. and design them lower than normal to compensate for the page shift…sigh
Ah yes, I see how it jumps. To be honest when I first joined Adalo and looked at the tabbar, I thought it was too default and looked terrible so I just made my own. Not sure what iOS guidelines are on custom tabbars but I suggest you just make your own.
So before I realized it was an entire page shift, I had already designed a floating tab bar similar to what you’ve done. I placed it a few spaces from the very bottom and fixed it to the bottom, so it’d stay in place. The page shift still affected the floating bar as well. Once that happened, I was like “Ok, it’s not just a bottom tab bar thing.”
Oh right, so it is a page shifting issue, nothing to actually do with the tabbar. I getcha now. Damn, hopefully someone out there has a solution if there is one!
Edit: @Stutter_j44 Have you tested out all of the different screen transitions? Maybe it’s something to do with that? It seems to only be happening with the Modal transition in this persons NekoBox app.
I haven’t tried every page transition, but I do have a few varying transitions. I basically either use no transition, modal or float left/right. NekoBox seems to have no transition between each normal page and only has a modal transition for the More button.
Ok, so I did a little experimenting with my custom bottom bar and added my logo and name where the extra space would show due to the page shifts. Below are some screenshots of what I found.
Interestingly, when I had the bar fixed to Bottom as I assume it should be set, the name image file didn’t show. I double checked to ensure it wasn’t set behind the rectangle…and it was the top-most element in the bar’s group. But when I switched it to fixed to Top, the name showed. I’m not sure if there will be any unintended consequences due to having a bottom item fixed to the top, but for right now, this solution makes me feel better about furthering development of my app. At the very least, it now seems like the extra space is a purposeful design element. And for phones where there is no bug that shifts pages up, the company name won’t show.
@anon78309838 I’m tagging you, since this may be some valuable info for the development team to consider.
Just add that while Android isn’t the dominant OS in the US, it’s the dominant OS in Europe and the rest of the world so this is a significant problem.
It’s a shame. It’s not just the bottom menu, it’s the entire page that shifts up, so you have to be mindful of that when designing EVERY page on the app. Because of this issue, I’ve pretty much halted development of my app. I just can’t publish something with a design flaw that bad.
I purchased my subscription last September (not knowing of this issue). If it isn’t resolved come time for my subscription to re-up, I’ll have to change my plan back to the free version. For some users of Adalo, this seems to not be a big deal, but I see it differently…this is right up there with speed/optimization in my book.
