Hello,
For some reason Bubble is adding weird spacing in live mode on popups that is not present in development mode.
Please see screenshots- there is clearly some big space under the button in the lower right hand corner of the popup. There is no hidden elements or groups that cause this. Top is dev mode, bottom is live mode.
Any ideas why this is happening? @neerja
My results on dev and live (same):
That’s the problem - it’s not consistent, just happens on random popups in the app.
No lineaerity to it, some popups are fine, some are not.
Bubble seems to be having a lot of f*ckups lately. First, it was on-and-off apps, next it was a super slow editor, server log dates not showing the correct data, and now this? I think it’s time Bubble told us what’s going on.
@marcusandrews We are aware of these issues and our first priority is to resolve and prevent it. The timing, though close, doesn’t necessarily indicate they are related but we will keep the community informed as soon as we have a complete picture.
What kind of animation are you using to show the popup? Just show/hide? Or animation?
I noticed some issues depending on what type of animation I was using. Show and hide is the safest way, just no the most visually stunning.
I am using slide down big in, 300ms, which we use for all popups including the ones that are fine.
Agreed though, the animations cause a lot of alignment problems but hide/show doesnt give the premium feel of our app.
@neerja Please can you let the devs know it may be related to animations on popups?
@help Thanks for the additional context. Please submit a bug report if you are consistently able to reproduce the alignment issue with that animation.
I notice when I use animations repeatedly there are normally issues like the popup will move around on the screen or would come back smaller the next time I used the popup. Might be something similar. I know Bubble worked on animations before to try to fix things and almost changed them completely, so there might just still be some bugs with them. I just normally find one that works, like the bounce slides that have worked the best for me. Bugs are less noticeable with those animations.
I have submitted one before but it came back inconclusive for the exact issue
If this is about using animations, what you’re seeing is probably the exact same thing I discuss with @luke2 in the following reply/replies in another thread:
(In short: the animated transition on that thing may not be completing, accounting for seemingly random spacing effect.
It’s worth playing around with animated show/hides to see how it is that you can cause them to misbehave. As an example, make some element like a group with a solid color background and a text element in it.
On some trigger, animate it out with a long transition time like 2000ms (WF Step 1). Put a Pause step right after that with a far too short wait time (like 150ms) as WF Step 2. For WF Step 3 animate that element back in or just show it.
What you’ll find is that your animated in element retains the incomplete transform caused by the interrupted animate out. (As I note in that other thread this is easiest to observe with the “3D” type transforms like spin, but all of the animated transitions save for Fade exhibit this behavior.)
To fix, adjust the following pause to be at least as long as the transition time.
This is not necessarily a bug. It seems to be simply how the animation library implemented in Bubble behaves. You must ensure that animate outs/ins have time to complete fully or the element’s transform will not be correct (default orientation/position/etc) when next shown/hidden.
That this manifests more often in Live mode may be related to certain behaviors inherent in debug_mode. (Note that version-live can also be run with ?debug_mode=true, but many folks don’t realize that.)
Thanks for that, makes sense I shall try to implement!
This topic was automatically closed after 14 days. New replies are no longer allowed.
