A native WebView inside your Bubble mobile app, with a live two-way channel to the page it loads. Full Bubble type support in both directions, driven entirely from workflows.

1. Getting started

The plugin ships two elements, one for each end of the bridge:

Element Where it goes Visible
WebView Native on your native mobile page yes
WebView Web on the Bubble web page the WebView loads no
  1. Install the plugin in your native app and in the web app whose page you will load.
  2. Drag WebView Native into a native view. Put the address in url and give it a height.
  3. On the web page being loaded, drag in WebView Web. Anywhere on the page. It is invisible and has no properties.
  4. Preview on a device. The bridge connects on its own.

Give the native element a height. A native element asking for full height inside a container that has no height of its own renders at zero pixels. It looks like a broken plugin and is not one — it is the first thing to check if the element does not appear.

Loading your own HTML instead of a Bubble page? Skip step 3 — see section 12.

The browser preview cannot run this element. A WebView is a native component; it only exists in a compiled app. Test in BubbleGo or a build.

2. Properties

WebView Native

Property Type Default What it does
url text — The page to load. A missing scheme becomes https.
height number 400 Height in pixels.
width number full Width in pixels. Leave blank for full width.
background_color colour #FFFFFF Shown behind the page while it loads.
allow_scroll yes/no yes Let the user scroll inside the WebView.
allow_zoom yes/no no Let the user pinch to zoom.
show_loading yes/no yes Cover the WebView with a spinner while loading.

WebView Web has no properties. Drop it on the page and it works.

3. Sending data

Action Fields Native Web
Send Text value, value_list ✅ ✅
Send Number value, value_list ✅ ✅
Send Boolean value, value_list ✅ ✅
Send Date value, value_list, date_input_format ✅ ✅
Send File value, value_list ✅ ✅
Send Image value, value_list ✅ ✅
Send Thing value ✅ ✅
Send User value ✅ ✅
Send List of Things value ✅ ✅
Send JSON value ✅ ✅
Navigate To URL url ✅ —
Reload — ✅ —
Run JavaScript javascript ✅ —