How to create an Android APK for a Superset dashboard

Is there anyone who has an idea of how we can package a Superset dashboard as an Android application?

I tried to wrap the url with a WebView but packaging it like this doesn’t create an APK that is user friendly. The widgets and filters don’t work as expected as shown below:

I have seen there are online tools to do this but I am concerned about:

  1. the security of having our data wrapped by a 3rd party application into an APK
  2. they require paid licenses in order to remove watermarks and logos

Are there other possible ways to achieve the desired website view as an Android APK?

Any feedback will be highly appreciated.

Hi @Kymoraa

Please correct me if I’m wrong, but it seems your dissatisfaction is coming from the less then ideal responsive design of the Superset UI.
Can you try opening the same page in your desktop browser and resize the window to a mobile-like resolution (or use dev tools to resize the window to the desired target resolution) and check if the layout is the same? Or, better yet, open the same page in browser on the mobile device.

If it is the same, I suspect this is a limitation in the responsive layout of the Superset UI, the solution would be to deploy superset with a different UI (which is probably what the 3rd party apps are doing). If it is different, we can check if there’s some missing parameter that the page is not receiving.

1 Like

I agree with Diana and from discussion online this looks like a known issue with Superset.

I’m not sure how comfortable you are with CSS and making custom changes, but you may be able to add custom code to change the UI on small screens. This article goes over the steps for how to supply custom CSS, and this discussion has an example CSS snippet.

Please read the article carefully as it goes over the downsides of this approach, and also note the CSS will likely need to be modified for your version of Superset and your desired outcome.

1 Like

Another less technical / quick fix might be to have two separate dashboards that use the same widgets. One would be configured to optimize for desktop view and the other would be configured to optimize for mobile (one widget per row, for example).

1 Like

Hello @Diana
When resizing the page on a web browser to a Samsung Galaxy A51 device, we get the desired UI (like that done by the third party app). See the screenshot below of the same view as the screenshot above.

This is the desired layout which is also the same if I opened the url on my mobile browser.

Hello @gareth

Does editing the CSS still apply if I have been able to load the url in a smaller device and view the desired UI? The challenge now is getting that same UI when packaging the website as an APK.

Hi @Kymoraa . Sorry for the late reply, I must’ve missed it somehow. You don’t need to edit the CSS If you’re happy with how that looks.

As for packaging it in an apk, I’m not sure why this would be better than just loading superset in a browser on the phone. If you have any trouble I recommend reaching out to the Superset community for support as someone there may have tried to do this before!

Sure.
I think the field teams field it easier to have all the websites available as Android applications as opposed to loading them on the browser.
Thank you @gareth. I can check in with the Superset community if all our current attempts fail.

1 Like

[Update]

We’ve been able to find alternatives to this issue. Thanks @jkuester for the support.
The fix involved forcing the Android WebView to load a desktop version instead of the mobile version using the userAgent. Ref. android - Setting WebView to view Desktop Site and Not Mobile Site - Stack Overflow

Thank you team for the support.

2 Likes