Select Page

So, your app is done! Great! At the time of writing, Bubble cannot export your app to Android or iOS. iOS export is being developed and is in beta as we speak, and the team has yet to confirm anything about Android yet. While they haven’t said so specifically, I’m going to make an educated guess that the exported apps will not be native for their respective systems, but rather, relying on a WebView solutions. What this means, is that the app is actually a full screen web browser, with all tools such as URL bar, home/back buttons and settings hidden. It automatically takes the user to the URL that you specify (your Bubble app URL), and the user can never tell the difference.

This solution started out being viewed as a bit home-grown, but has grown steadily in popularity over the last years as technology has improved. What many don’t realize is that many popular apps such as Uber, Spotify and Instagram are all using a WebView solution, that makes it easier and less costly to develop apps for both platforms simultaneously.

WebView alternatives

There are several WebView alternatives to choose from, and I need to add a caveat before you read further: remember that this blog is made from the perspective of a bootstrapped startup, with a limited development team. In other words: other people with a more technical background can give you specific recommendations. I’ll just tell you what worked for us.

 

Our experience with GoNative.io

The first option we tried was Gonative, a popular package because it’s easy to use. You simply paste in your app URL, and the package is created for you. You can tweak all basic settings without touching any code. As long as you are only testing, it’s free with a banner urging you to purchase a license, which is fair. We tested it, and it mostly worked without a hitch, although we did have to adjust some settings. And here’s the reason why we didn’t choose GoNative: it’s expensive as hell, and frankly, having looked at what you get from other alternatives, it’s massively overpriced. The basic package costs $590. Now, we needed to activate the Crosswalk project as well, to render the Bubble app correctly. That’s another $200. So we’re already up in $790, and for everything you want to add, there’s hundreds or even thousands of dollars in added costs. We experienced underwhelming customer support, did’t like the hidden extra costs and in the final solution we went for, the cost was reduced by a whopping 95,4%. So, we concluded that while GoNative has ease of use, the price is, in my honest and humble opinion, ludicrous. The solution we picked below did require us to edit about 4-5 lines of code, and that reduced the cost from $790 to $36 for both platforms.

 

SuperView for Android

By tip from the talented mvandrei from the official Bubble.is forum, we discovered SuperView. Like GoNative, SuperView is a wrapper for your app that will run it as if it was a browser. Out of the box it supports even more features than GoNative, including social media login for both iOS and Android, geolocation and deep linking. The cost is $18 per operating system. Dragan, the developer behind the app was very helpful getting it up and running, and has also confirmed that he will take on freelance work if you need further customizations. This solution requires that you download Android Studio. While that may seem daunting, the whole process is pretty simple, and does not require that you know any coding, even if you have to do some editing. If you’re able to create an app in Bubble, you’ll be fine doing these changes as well.

I will be updating this post once we have tested it for iOS as well.

 

Changin SuperView WebView Permissions and Settings

How to force portrait mode:
Open app/src/main/AndroidManifest.xml
Find android:screenOrientation=”fullSensor” and replace with android:screenOrientation=”portrait”

How to set the color of the Android status bar:
You need to open res/values/colors.xml and change colorPrimaryDark.

How to disable cache:
Open res/values/config.xml
This line <string name=”cache” translatable=”false”>true</string> replace with <string name=”cache” translatable=”false”></string>

How to enable/disable system permissions:
Open the file MainAcitivity.java
Search for the method showContent and remove unnessesary permission by commenting out or deleting. Remember that the app will ask the user for permissions even if you don’t use them, if these settings are not removed, which is bad for the User Interface.

public void showContent() {
if (show_content) {
PermissionUtil.checkPermissions(this, new String[]{
android.Manifest.permission.RECORD_AUDIO,
android.Manifest.permission.CALL_PHONE,
android.Manifest.permission.SEND_SMS,
android.Manifest.permission.ACCESS_NETWORK_STATE,
android.Manifest.permission.WRITE_EXTERNAL_STORAGE,
android.Manifest.permission.BLUETOOTH,
android.Manifest.permission.ACCESS_FINE_LOCATION,
android.Manifest.permission.ACCESS_COARSE_LOCATION,
android.Manifest.permission.INTERNET
});

Publishing your Bubble app to Play Store

I’m not going to go into detail on exactly how to publish it to the Play Store, as there are hundreds of guides already made that describes it in detail. The video below gives you a walkthrough of the process:


Privacy Policy

If you plan to use Geolocation in your app, then Google requires you to have a privacy policy published. The URL to this policy must be included when you prepare the app for release in the Play Store.

Share This