Vaadin TouchKit Showcase Webinar coming up this week!

Join us for a webinar on Vaadin TouchKit Showcases, to learn tips and tricks on how to leverage TouchKit in real life and with use-cases from PUMA.

Ask your questions and learn more about how to move your Vaadin app to mobile on October 31st.

Sign up and read more »
Webinar Registration

Vaadin TouchKit Showcase Webinar starting in few hours, at 3PM CET.
You can also post questions to this forum thread - we will answer as many as we possibly can :slight_smile:

The webinar link is: http://www.youtube.com/watch?v=dbIfrk-JHS0

Youtube only says: Video is not available. :frowning:
13281.png

Same Problem here. :-/

There’s still no video at youtube
:frowning:

ah finally…

First set of Q & A’s

QUESTION:
If I’m familiar with Vaadin, how much more work is it to learn TouchKit? How is it similar or different from conventional Vaadin?
ANSWER:
Very much the same; TouchKit basically feels like you’re using some new components with Vaadin. The main difference is that TouchKit provides a toplevel navigation/layout structure that is suitable for mobile, which you’ll probably want to make use of.

QUESTION:
How easy is it to start from an existing Vaadin app and add-on a mobile view? Does this mean a full rewrite of the Vaadin code?
ANSWER:
Usually you can re-use most of your code, just changing the toplevel layouts and navigation. It depends on your application how big this change is. In the end, it’s all about making the UI usable on a small screen; all your backend and business logic stays the same.

QUESTION:

  1. What are TouchKit apps deployment strategies?
  2. Can TouchKit app be deployed using App Store and Play Store?
    ANSWER:
    Usually TouchKit apps are deployed as a webapp, often alongside a desktop application. TouchKit apps can also be packaged as PhoneGap/Cordova apps, in which case they can be submitted to the various stores - refer to PhoneGap/Cordova for more details.

QUESTION:
Will touchkit allow us to build an adaptive web design? Our near term concern is desktop browsers and ipad. Two years from now we want to be able to support smaller devices without building a new site.
ANSWER:
You can present different versions of your user interface on different screen sizes / devices. You can choose whether to present a totally different UI, or just a slightly modified version, or something inbetween.

QUESTION:
Can one have one Vaadin code base, deploying both on tablets and standard devices ?
Are there guidelines to achieve this ?
ANSWER:
Yes, absolutely. This is the most common usecase. Book of Vaadin shows you how to do this.

More Q & A’s

Question:
Does vaadin touchkit support a caching method?
So it’s possible to review products which have been watched by the same device.
Answer:
Yes, TouchKit supports custom cache manifest and HTML5 local storage - you can make your application work in offline mode, demos and book show how. Note that this is not automatic, you need to decide what to make available offline.

Questions:
Is it possible to detect tablet without manually testing screen resolution?
Is it possible to detect ladnscape/portrait mode without manually testing screen width/height?
Touchkit4 will work on firefox (no webkit browser) ?

Answers:
No, but you can write a function to your own app to detect it. The good thing in this approach is, especially at this “phablet era”, that you decide the threshold that is used to detect table.

You can copy paste it from here to you app:
public static boolean isLandscape() {
Page page = UI.getCurrent().getPage();
return page.getBrowserWindowWidth() > page.getBrowserWindowHeight();
}

Don’t know (someone wise man decided this), but currently it seems to work in the development version. Firefox OS 1.0 will not work as it has quite ancient rendering engine, but most likely next major version has a more modern one.

Question:
How does TouchKit handle animations which are typically part of apps on mobile devices?
Is the Vaadin Visual Designer involved in designing TouchKit apps?

Answer:

  1. Built-in animations for e.g view transitions (navigation). Possible to make custom animations in the same manner. 2. VisualDesigner is being worked on, nothing to announce right now.