search

olliethedev / ui-builder

A React component that provides a no-code, visual way to create UIs, compatible with shadcn/ui and custom components.
https://www.uibuilder.app/
MIT License
211 stars 26 forks source link

Bug in mobile view #2

Open no-1ne opened 1 month ago

no-1ne commented 1 month ago

First of all thank you for sharing your work and congrats on PH coverage..

coming to the issue, open https://www.uibuilder.app/ make the browser smaller to trigger mobile UI or open the page on a mobile..go to center tab, select a element..try to change the text props..the page hangs

Aditionally a thought for mobile view UI

  1. may be the center view/tab is active by default, instead of current left panel
  2. the right side bar for props, shows up in a popover
olliethedev commented 3 weeks ago

Thanks for reporting this issue. I will be addressing this and other mobile issues in the next release.

no-1ne commented 2 weeks ago

looking forward, scrollng is also little hard in mobile view

olliethedev commented 4 days ago

Should be addressed in 0.0.3 If pan/pinch/zoom touch gestures are not working on your mobile browser do let me know.

no-1ne commented 3 days ago

Original bug resolved, 👍 The scroll behaviour is wierd, with scrolling with one finger, it's kind of struck and very hard to scroll down, with two fingers it seems fine..may be due to resize logic 🤔

no-1ne commented 3 days ago

Would be nice to see the right side panel in a popover if mobile, for a first time average user who never used a builder, they may not be able to guess

no-1ne commented 3 days ago

The new options seem to go beneath the floating bottom bar Screenshot_20241119-045134

olliethedev commented 2 days ago

The scroll behaviour is wierd, with scrolling with one finger, it's kind of struck and very hard to scroll down, with two fingers it seems fine..may be due to resize logic 🤔

Ah yes, having touch gestures working on desktop and mobile with the components inside an iFrame was quite tricky, I spent countless hours trying to get them to work, and yet they seem to behave differently depending on the browser and platform. Looks like I will need to spend a bit more time on that. Is that Chrome browser on iOS you are using?

Would be nice to see the right side panel in a popover if mobile, for a first time average user who never used a builder, they may not be able to guess

By popover do you mean a full screen modal/dialog, or a shadcn type of popover where you can still see the elements behind it?

The new options seem to go beneath the floating bottom bar

Can you give me more details about the browser and OS you are using?

Also, can you give me more details about your usecases for using the UI Bilder on mobile vs desktop?

no-1ne commented 21 hours ago

Chrome 131.0.6778.81, Android 14..

May like every other builder only provide small, medium and large screen preview which is already present (and things simple by skipping the gestures), scroll behaviour is being over ridden by gestures and making it hard to use on mobile

Regarding the usecase it's a simple page editor for teachers(not very tech savvy) and most of them use mobile phone as a daily driver..