Which GWT Layout Panel is perfect for building Mobile Friendly Website?

0
votes

Ok, A Mobile Friendly Website should be very short and focus on the task, so it wont need to show the headers as in Desktop Website.

Here is What I want to design.

When user open mydomain.com in Mobile devices like Smartphone or Tablet. They Will see

Email:
Pass:
Login

Registration

Explanation

About

When they CLick Login they will go to a page that lists all the products, the Page Should has "Home" link the Back button

Home  Back

Product 1 , some other info
Product 2 , some other info
Product 3 , some other info
......

When user clicks on a product, it will show the details of the products

Home  Back

This is Product 1 

Detail info of product 1..

If user hits "Back" button then it will go back to the previous page (ie, the list of products page).

Note that: in the home page, we also have "Registration", "Explanation" & "About" Buttons, but we will never show these buttons in any other pages except the home page.

So, my question is:

Is there any Gwt Layout panel that can help me to achieve that Simple Design for Mobile Friendly Website?

The only 1 I can see is the TabLayoutPanel, but the headers are always appear in all pages.

What about "StackLayoutPanel"? How it look like? & is it good for Mobile Website?

2
gwtgwtp

2 Answers

2
votes

It's better not to use any LayoutPanels in mobile apps. Ideally, you should not use any widgets that implement RequiresResize interface.

Such widgets rely on JavaScript to resize them. This is very slow compared to native browser layout mechanism. It also requires much more code. The difference is not significant on desktop, but very important/noticeable on mobile.

A good mobile library should rely entirely on a native browser layout mechanism, like a flexbox model. This is the key reason to consider mgwt for mobile development.

1
votes

None of the widgets included with GWT are primary thought for mobile, so I recommend that you use another library like m-gwt, gwt-mobile, or touchkit.

Anyway there is a very simple mobile web example application in the GWT trunk which you can use as reference. They use DeckLayoutPanel since you can add multiple views and let it to animate between them. You can try this live demo from a mobile device (you can append formfactor=mobile/tablet/desktop to switch view implementations). The demo is very old, without using modern CSS3, but helpful.

So, if your application is very simple use DeckLayoutPanel, but if it's going to getting bigger, it's better to consider a mobile specific library.