Comment on page
HTML Advanced Topics
Sending messages to and receiving messages from the
htmlcomponent was introduced in version 4.41.0 of the JourneyApps Container.
- Where data from your application should inform the content of your HTML, e.g. displaying your latest data in a chart
- Where user interactions should update the HTML content
- Where users should be able to interact with the HTML content and the app respond accordingly, e.g. a color picker, where the color picked by the user is further used in the app workflow
If you are including images in your HTML, you may notice that the relative size of the image will appear different on different kinds of mobile devices (e.g. tablets versus smartphones, devices with lower resolution versus higher resolution, etc.). In some cases, the image width might be bigger than the device's resolution, and the image will be cut off.
To remedy this, set the
widthCSS property of the images in your HTML file to a percentage. In the example below, we set the width to
100%so that the image is always fitted to the width of the screen:
<img style="width: 100%;" src="..." />
The WebKit engine built into the JourneyApps Runtime is used to render the HTML.
With the current implementation, the HTML cannot reference any offline resources stored on the device filesystem. Online resources may be referenced, but connectivity will be required to render them, and it will most probably not be cached.
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...RU5ErkJggg==" />
When using the same image multiple times, define it in CSS. Example:
The Android container only supports up to ES5.