SmartGWT on mobile enhancement suggestion: Swipe left / right to navigate

[Blama]

Hi Isomorphic,

it would be great if you added a control like which behaves like the main layout in e.g. the app "Forza", see screenshot:


Swiping (touch, move, release) here from left to right does switch Tabs - as you start the move, the component is generated (=new ListGrid that shows the loading-wheel) and slowly moves the old one out of view.
Here you can see a swipe in transition (contents loaded already).


I'm talking mainly about the Main Layout, not the way the TabSet is also transitioning - of course, this would be nice in the calendar control as well.
Perhaps the content below a NavigationBar could change in the same way?
ListGrids already support "useless scrolls", where you can scroll/push the grid content out of view, so the "move whole content" is already working. Missing is "define what the new content is and show it instead".

Best regards
Blama

[Isomorphic]

This is a possible enhancement we've been tracking, and would be a valid Feature Sponsorship. However, we see relatively low value here for a few reasons:

1. enterprise apps are very functionally dense, so there are almost always interactive elements at the edges where swiping would be used. The ambiguity between starting a swipe and just a sloppy touch (finger moves slightly) makes elements on the edges harder to operate. This is a common experience in Google Maps, for example.

2. the big win would be to be able to remove a navigation element in favor of the swipe gesture and hence free up some screen space, but this is an iffy approach in a mixed mobile/desktop apps

3. in web apps, the sideways swipe gesture already means history navigation, so taking that gesture over may confuse or annoy users

Note also, if you have a situation where swiping is a big win in a particular application, it could be implemented as a custom drag interaction using existing drag APIs.

[Blama]

Hi Isomorphic,

thanks for the fast answer.
Regarding the sloppy touch: It is impressive how this is working in existing apps. Even though the Widget ("Grid"-like thing) below reacts on clicks as well, there are no erroneous inputs IMHO.
This is also the same in other apps (I can give examples if needed). I know what you mean with the google maps example, though.

Regarding the web apps issue:
I agree that this *might* be an issue on web pages that one calls with the browser. HTML5-Apps obtained via an App Store are just apps (no distinction between native or HTML5) to the end user. Here the swipe-to-navigate-back is not expected IMHO. Actually I never used the function also in normal Safari pages.

Great that it is tracked as possible enhancement, I'll see if I'm going to need it.

Best regards
Blama

[Isomorphic]

Yes, this would be a more valuable enhancement to someone with a mobile-only, App Store only deployment (with no corresponding web interface at all). That's an unusual use of our technology. Perhaps there will be a sponsor amongst that relatively narrow group.

[Blama]

Hi Isomorphic,

that touches a point I wanted to ask about anyway:
Your showcase is working fine on desktop and on mobile - on mobile even with landscape/portrait detection.
For now my idea was to start easy with a new mobile-only layout with a switch depending on called URL (x.jsp, xMobile.jsp). The xMobile URL is called in the app.

As everything is still one GWT project, I will be able to reuse my Widget subclasses (SelectItems, ListGrids, ListGridFields, ...) (I don't care for the slightly larger *.cache.js files here)
But I'll have some code only used once - the Layout code. Is there some Best Practice that will make my application "just work" with mobile as well? Because of the very different screen-real-estates I don't know how this could work.
For example a wide ListGrid with many columns should IMHO be a 1-column ListGrid with DynamicForm on recordClick. How to do this in an approach that fits for mobile and desktop?

Any pointers are very welcome! If there is already an chapter in docs about this, I missed it.

Thank you & Best regards
Blama

[Isomorphic]

Read the Mobile Development overview.

We definitely would not recommend separate URLs. If you decide that a form+grid arrangement works better, we would suggest using isHandset / isTablet switches in your code in the few places where you think a revised layout is necessary.