Over a million developers have joined DZone.

Native Mobile Vaadin

DZone's Guide to

Native Mobile Vaadin

· Java Zone ·
Free Resource

"I love writing authentication and authorization code." ~ No Developer Ever. Try Okta Instead.

With all buzz surrounding native mobile applications, an article was to tackle the subject. Given iOS proprietary nature, this article will show us how to wrap a Android application around a Vaadin one. Be warned, this means there will be more talk about Android than Vaadin. The first step is to create a simple WebView in XML.

<?xml version="1.0" encoding="UTF-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="fill_parent" />

Once created by Android, just get it from the resources and call the loadUrl() method with the Vaadin application URL. 

WebView vaadinView = (WebView) findViewById(R.id.vaadinview);

There are only two requirements:

  1. Enable JavaScript on the Android side like so:
  2. Request Internet access in the Android manifest:
    <uses-permission android:name="android.permission.INTERNET" />
The entire code is available on GitHub. If you use it, however, you'll notice there are a couple of problems:
  • First, pinching the screen to zoom in or out has no effect. Thus, you have to adapt to the initial viewpoint and orientation of the device programmatically in the onStart() method of the activity. It can be achieved by getting a handle on the Display.
  • Then, scrolling the screen is impossible. As soon as the finger is off the screen, the viewpoint scrolls back again to its initial position.
I've yet to diagnose possible causes for these behaviors. In the meantime, I welcome with open arms Android and/or Vaadin experts who could help me on this subject.


"I love writing authentication and authorization code." ~ No Developer Ever. Try Okta Instead.


Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}