Vaadin 7 Touchkit Application not rendering properly

I have written a simple Vaadin 7 Touchkit application. I plan to use it with my cell (Nokia 5 Android 7) primarily. In a recent firefox on Ubuntu 18.04 the UI looks just as it should. However, the rendering on the Android device (which is an off-the-shelf Nokia, nothing customized) is completely fucked up. I tried 3 browsers: Chrome mobile, Firefox mobile and duck duck go. Same effect.

  • Here is what it looks like on the desktop (firefox 63.03 on ubuntu 18.04):
  • Here is what it looks like in the mobile browser:

Each line is simply the title of a podcast which I have pixelled.

As you can see, the buttons with the arrow on the right are not rendered and the TabStrip also doesn’t seem to work.
I don’t understand what can go so bloody wrong, I was using Touchkit in the expectation it would just magically handle the different browsers.

Any hint is appreciated.


At quick glance it looks like the theme is not being loaded. Do you have custom theme? Have you checked if it works with default theme @Theme(“touchkit”)

Thanks for your reply.

No custom theme. In SyncRssTouchKitUI there is this:

public class SyncRssTouchKitUI
extends UI {
    private final SyncRssPersistToServerRpc serverRpc;
    private FeedService feeds;
    private NavigationManager navigationManager;

is that what you mean?