Native Font Awesome

Content Type: Service
Categories: User Interface,Mobile

Overview

Use Font Awesome in Mendix Native Mobile apps.

This is a module, not a single widget. It contains a widget 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
  • When no action is configured it will not consume click/tap events, allowing these to bubble up to a container

 

Installation

Mendix project

Download the module from the marketplace. This makes widget and design properties available in your project.

The initialization as required in version 2 is no longer necessary. If upgrading from version 2, remove the native font awesome library widget, itvisors.NativeFontAwesomeLibrary.mpk. The initialization logic in your app can also be removed in that case.

 

Custom build

The widget does not work in the Make It Native app!

You need to include the Font Awesome fonts in your custom build as custom fonts. Note that the regular and solid fonts are variants of the free (or pro) font so expand the group box in the Native Builder UI to see the individual fonts.

The files for the free fonts are supplied in the module under themesource\nativefontawesomebutton\native\FontAwesome fonts\

 

Font Awesome Pro

Using Pro icons is easy. The widget already contains the meta data. (Not the fonts or icons themselves as the Pro icons require a paid license.)

 

Custom build

Instead of using the supplied free font files, use the Pro ttf font files. These are included in the web version that you can download yourself using your Pro license. Include the ttf files for light, regular, solid and brands as custom fonts in your build. (Duotone and thin are not yet supported by the library used in the widget so these will be available in a later version.)

 

Activating the Pro icons

There is no free/pro property on the widget as that would be tedious and involve a lot of rework if you were to buy a Pro license later.

The Pro icons are activated by including a style in your native theme:

export const itvisors_nativefontawesomebutton_NativeFontAwesomeButton = {

configuration: {

useProIcons: true

}

};

 

Releases

Version: 7.0.0
Framework Version: 11.6.0
Release Notes:

Mendix 11.6

Version: 6.0.0
Framework Version: 10.24.0
Release Notes: Mendix 10.24
Version: 3.0.0
Framework Version: 9.12.5
Release Notes: *** BREAKING CHANGES. REQUIRES CUSTOM BUILD. *** As of this release, custom fonts are used. This greatly reduces the widget size. Because custom fonts need to included in the native build, you to create a custom build. So this no longer works in the Make It Native app. You need a custom development app. Some icons are named differently because of this change. An example is exclamation-triangle which is now triangle-exclamation. Unknown icons no longer trigger an error but appear as a question mark icon. Remove the library widget as it is no longer required. Also the logic with the initialization is no longer required so this can be taken out as well.