View on PC screen

One situation that I have not been able to understand is how to improve the user experience regarding the interface when accessed through the PC browser.

is it possible to have one user experience on PC screen and one on mobile?

I really want to invest in knowledge in this beautiful tool that is AppGyver, but I’m having a hard time finding material and or information to know if it’s really possible to make UI / UX on the PC better, or be able to adapt in a more responsive format and not just auto expandable, could anyone let me know?

Hi, yes it’s totally possible!

If you want to have completely separate layouts for web and mobile, I would recommend you check out the Conditional Renderer component from the marketplace.

You can use system variables to first detect what device the user is using at app launch event on the Global canvas, and then render different layouts based on that with the Conditional Renderer.

For example, you could have an app variable layout that you set to mobile if the form factor is mobile or tablet, and otherwise desktop.

Then on any page you can have the Conditional renderer, and two containers within the renderer with render IDs mobile and desktop and the active render ID bound to appVars.layout.

This way one layout will get rendered on desktop and another on mobile :slight_smile:

If there are some pages where just some elements should be rendered differently, you can use the conditional renderer for just those, and not the whole page.

3 Likes

Yep, did something similar without a conditioner renderer, too, for our web app. Just two separate layouts in scrollviews – one for desktop, one for mobile – with their visibility controlled by a formula that determines the width of the screen. I forget the exact number but something like, if wider than 800 pixels, show desktop layout, if less than, mobile.

Same thing with a specialized floating custom header for desktop and “footer” for mobile.

(We could actually simulate/trigger this in realtime by adjusting the page width in the Inspect panel in Chrome. Both pictures are from an older profile interface, so some things still look a bit rough.)

Desktop:

Mobile:

2 Likes

@Mari
Thank you very much for the answer, it was precisely this question I needed to understand better, I simply want to adopt AppGyver as my web and mobile development platform.

Another fantastic innovation is being able to work with formulas, I would venture to say that this is an innovation without expiration date, as formulas do not become obsolete like syntaxes.

Thank you.

@Dominik_Greene
Fantastic :heart_eyes:

Hi, I’m trying to connect to the forum, but something is wrong.

1st trying to log in normally

I’m automatically taken to the development environment

trying to access through the development environment

I’m not logged in yet

By clicking on connect, I return to the initial screen of the development environment

I ask for your help because I need to ask questions on the forum.

Thank you very much

1 Like