Native Font Awesome

Category: Modules
Subcategory: Messaging

Overview

Use Font Awesome in Mendix Native Mobile apps.

This is a module, not a single widget. It contains two widgets and theme files.

Documentation

Native Font Awesome module

Use Font Awesome in Mendix Native apps. The widget renders as a button.

 

Features

  • All free Font Awesome icons are available
  • The module comes with design properties and classes

Limitations

  • You need to build the library widget yourself to make use of a pro license.

Atlas 3

The module brings in Atlas 3 themesource files so you need Atlas 3 to take advantage of this

Atlas 2

You can use the new widgets when the app is still at Atlas 2. Just delete the module after downloading it. The widgets will remain in your project. 

App reload

During development you may get error messages about icons that could not be found. This happens when the app reloads while on a detail page. The library is not initialized in that case. Just reload the app so it starts at the home page.

Installation

Download the module from Marketplace. It brings in the widgets and theme classes.

Separate library and button widgets

The existing Marketplace widget is now split in a library and button widget. Advantages:

  • Ensures font libraries are included only once
  • No warnings in Studio Pro about missing initialization actions on each button widget
  • The module brings in style classes

Upgrading from the single widget version

The single widget had an action to either initialize the library or show a button. This is now split across two separate widgets. Where you currently have an existing Native Font Awesome Button widget with action initialize, replace that with the Native Font Awesome Library widget and configure your nanoflow again on that widget.

Configuration

The Font Awesome library needs to be initialized to allow icons to be referenced by name. This must be done before showing icons. So if you want to use Font Awesome on the home page you need to make sure that the library is initialized before attempting to show an icon.

This initialization step also ensures that the icons are included in the bundle.

This is recommended to use, even if your home page does not (yet) have Font Awesome icons. It would be very confusing if someone just adds an icon and that would break the app.

Supporting entity

Create a non-persistent entity with a boolean flag. Example here: Entity NativePageContext attribute FontAwesomeInitialized.

Home page

On the home page add a dataview with a datasource nanoflow. In that nanoflow, create a NativePageContext with FontAwesomeInitialized set to false.

In the dataview, create two containers with conditional visibility on FontAwesomeInitialized.

Initialize

In the container with conditional visibility FontAwesomeInitialized=false place the Native Font Awesome Library widget . Configure a nanoflow as library loaded action on the widget. In that nanoflow, set FontAwesomeInitialized to true.

Initialization done

In the container with conditional visibility FontAwesomeInitialized=true, place the normal page content and use Native Font Awesome Button widgets to show icons.

Releases

Version: 2.0.0
Framework Version: 9.12.0
Release Notes: Mendix 9.12, greatly reduce font library widget size
Version: 1.0.0
Framework Version: 9.6.5
Release Notes: Initial release, replaces the existing single Native Font Awesome widget