[Solved] Navigator in the new UI is swiping in the designer

I encountered some odd behaviors while playing around with the #draganddrop using Chrome on Windows 10.

The GIF below shows 2 issues:

  1. With a project using a top tab navigator (may be present in other projects too), resizing causes the screen to partially swipe.
  2. Resizing components causes the position of the component to change in unexpected ways

Is anyone else noticing these behaviors?

2 Likes

A post was split to a new topic: Where is Airtable in the new UI?

Yes, I have experienced no. 2 in exactly the way you described.

This is a known issue @drted - we’re looking into it, will keep everyone posted here.


I haven’t noticed this before - is it just when adding components to a project with navigators?
cc: @muneer

1 Like

@domhnallohanlon ,

This behavior was specific to my project with a top navigator, altough I didn’t do a full unit test with all possible layouts. For a simple screen without a top navigator, resizing cause the screen to flash and jump, but it did not change the position.

1 Like

After our most recent upgrade to Expo 41 this behaviour should now be fixed - can you take another look and let me know @drted

cc: @muneer

2 Likes

I just make a quick test and the same effect is happening inside the navigator. When out of the navigator then the resizing of the components do not jump to other positions.

You can easily reproduce the condition.

  • Create a new project
  • Add a top tab navigator
  • Choose any screen inside the navigator
  • Add a label to the screen
  • Resize the label by dragging the right or left side to the edge of the screen

You will notice that the navigator slides/swipes partially to the next screen.

I tried using a bottom tab navigator with a label a button and a slider before posting.

I’m pretty sure it was on my non-staff account too, do you mind checking to see if the bottom tab nav works?

1 Like

I did try the Bottom Tab Navigator and surprisingly the effect is not there. It seems this effect is only visible in the Top Tab Navigator.

TopTapNav