Ext.js - Fonts



Ext.js provides the facility to use different font packages. Font packages are used to add different classes for icons available in the package.

  • Font-Awesome
  • Font-Pictos

Font-Awesome

ExtJS new theme, Triton, has an inbuilt font family font-awesome included in the framework itself, hence we do not need any explicit requirement for the font-awesome stylesheet.

Following is an example of using Font-Awesome classes in the Triton theme.

Font-Awesome with Triton theme

When we are using any other theme apart from Triton, we need or require to add a stylesheet for font-awesome explicitly.

Following is an example of using Font-Awesome classes without the Triton theme.

Font-Awesome with normal theme(Any theme other then Triton theme)

Font-Pictos

Font-pictos is not included in the framework for ExtJS, hence we have to require the same. Only licenced users of Sencha will have the benefit to use font-pictos.

Steps to Add Font-Pictos

Step 1 − Require font-pictos class using the following command.

"requires": ["font-pictos"]

Step 2 − Now add pictos classes as −

iconCls: 'pictos pictos-home'
Advertisements