Skip to content

FontAwesome In TabrisJS

Joko Rivai edited this page Mar 15, 2019 · 1 revision

Requirements

  • TabrisJS (tested on 2.7.0)
  • FontAwesome TTF File

Directory Structure

Please place FontAwesome TTF File (file name may differ) in res\font. This folder structure is not mandatory, but helps much on file and resource management.

Utility

Use this utility file (TabrisFontAwesome.js) as text parser:

module.exports = new (function(){
  this.font = 'FontAwesome';
  tabris.app.registerFont('FontAwesome', './res/font/fontawesome-webfont.ttf#'+this.font);
  this.fa = function(txt){
    let _t = this;
    if (txt == ''){
      return '';
    }
    let ret = txt;
    _t.glyphTable.forEach(glyph => {
      ret = ret.split('{'+glyph.n+'}').join(glyph.c);
    });
    return ret;
  },
  this.glyphTable = [
    {n: "fa-glass",	c: "\uf000"},
    {n: "fa-music",	c: "\uf001"},
    {n: "fa-search",	c: "\uf002"},
    {n: "fa-envelope-o",	c: "\uf003"},
    {n: "fa-heart",	c: "\uf004"},
    {n: "fa-star",	c: "\uf005"},
    {n: "fa-star-o",	c: "\uf006"},
    {n: "fa-user",	c: "\uf007"},
    {n: "fa-film",	c: "\uf008"},
    {n: "fa-th-large",	c: "\uf009"},
    {n: "fa-th",	c: "\uf00a"},
    {n: "fa-th-list",	c: "\uf00b"},
    {n: "fa-check",	c: "\uf00c"},
    {n: "fa-times",	c: "\uf00d"},
    {n: "fa-search-plus",	c: "\uf00e"},
    {n: "fa-search-minus",	c: "\uf010"},
    {n: "fa-power-off",	c: "\uf011"},
    {n: "fa-signal",	c: "\uf012"},
    {n: "fa-cog",	c: "\uf013"},
    {n: "fa-trash-o",	c: "\uf014"},
    {n: "fa-home",	c: "\uf015"},
    {n: "fa-file-o",	c: "\uf016"},
    {n: "fa-clock-o",	c: "\uf017"},
    {n: "fa-road",	c: "\uf018"},
    {n: "fa-download",	c: "\uf019"},
    {n: "fa-arrow-circle-o-down",	c: "\uf01a"},
    {n: "fa-arrow-circle-o-up",	c: "\uf01b"},
    {n: "fa-inbox",	c: "\uf01c"},
    {n: "fa-play-circle-o",	c: "\uf01d"},
    {n: "fa-repeat",	c: "\uf01e"},
    {n: "fa-refresh",	c: "\uf021"},
    {n: "fa-list-alt",	c: "\uf022"},
    {n: "fa-lock",	c: "\uf023"},
    {n: "fa-flag",	c: "\uf024"},
    {n: "fa-headphones",	c: "\uf025"},
    {n: "fa-volume-off",	c: "\uf026"},
    {n: "fa-volume-down",	c: "\uf027"},
    {n: "fa-volume-up",	c: "\uf028"},
    {n: "fa-qrcode",	c: "\uf029"},
    {n: "fa-barcode",	c: "\uf02a"},
    {n: "fa-tag",	c: "\uf02b"},
    {n: "fa-tags",	c: "\uf02c"},
    {n: "fa-book",	c: "\uf02d"},
    {n: "fa-bookmark",	c: "\uf02e"},
    {n: "fa-print",	c: "\uf02f"},
    {n: "fa-camera",	c: "\uf030"},
    {n: "fa-font",	c: "\uf031"},
    {n: "fa-bold",	c: "\uf032"},
    {n: "fa-italic",	c: "\uf033"},
    {n: "fa-text-height",	c: "\uf034"},
    {n: "fa-text-width",	c: "\uf035"},
    {n: "fa-align-left",	c: "\uf036"},
    {n: "fa-align-center",	c: "\uf037"},
    {n: "fa-align-right",	c: "\uf038"},
    {n: "fa-align-justify",	c: "\uf039"},
    {n: "fa-list",	c: "\uf03a"},
    {n: "fa-outdent",	c: "\uf03b"},
    {n: "fa-indent",	c: "\uf03c"},
    {n: "fa-video-camera",	c: "\uf03d"},
    {n: "fa-picture-o",	c: "\uf03e"},
    {n: "fa-pencil",	c: "\uf040"},
    {n: "fa-map-marker",	c: "\uf041"},
    {n: "fa-adjust",	c: "\uf042"},
    {n: "fa-tint",	c: "\uf043"},
    {n: "fa-pencil-square-o",	c: "\uf044"},
    {n: "fa-share-square-o",	c: "\uf045"},
    {n: "fa-check-square-o",	c: "\uf046"},
    {n: "fa-arrows",	c: "\uf047"},
    {n: "fa-step-backward",	c: "\uf048"},
    {n: "fa-fast-backward",	c: "\uf049"},
    {n: "fa-backward",	c: "\uf04a"},
    {n: "fa-play",	c: "\uf04b"},
    {n: "fa-pause",	c: "\uf04c"},
    {n: "fa-stop",	c: "\uf04d"},
    {n: "fa-forward",	c: "\uf04e"},
    {n: "fa-fast-forward",	c: "\uf050"},
    {n: "fa-step-forward",	c: "\uf051"},
    {n: "fa-eject",	c: "\uf052"},
    {n: "fa-chevron-left",	c: "\uf053"},
    {n: "fa-chevron-right",	c: "\uf054"},
    {n: "fa-plus-circle",	c: "\uf055"},
    {n: "fa-minus-circle",	c: "\uf056"},
    {n: "fa-times-circle",	c: "\uf057"},
    {n: "fa-check-circle",	c: "\uf058"},
    {n: "fa-question-circle",	c: "\uf059"},
    {n: "fa-info-circle",	c: "\uf05a"},
    {n: "fa-crosshairs",	c: "\uf05b"},
    {n: "fa-times-circle-o",	c: "\uf05c"},
    {n: "fa-check-circle-o",	c: "\uf05d"},
    {n: "fa-ban",	c: "\uf05e"},
    {n: "fa-arrow-left",	c: "\uf060"},
    {n: "fa-arrow-right",	c: "\uf061"},
    {n: "fa-arrow-up",	c: "\uf062"},
    {n: "fa-arrow-down",	c: "\uf063"},
    {n: "fa-share",	c: "\uf064"},
    {n: "fa-expand",	c: "\uf065"},
    {n: "fa-compress",	c: "\uf066"},
    {n: "fa-plus",	c: "\uf067"},
    {n: "fa-minus",	c: "\uf068"},
    {n: "fa-asterisk",	c: "\uf069"},
    {n: "fa-exclamation-circle",	c: "\uf06a"},
    {n: "fa-gift",	c: "\uf06b"},
    {n: "fa-leaf",	c: "\uf06c"},
    {n: "fa-fire",	c: "\uf06d"},
    {n: "fa-eye",	c: "\uf06e"},
    {n: "fa-eye-slash",	c: "\uf070"},
    {n: "fa-exclamation-triangle",	c: "\uf071"},
    {n: "fa-plane",	c: "\uf072"},
    {n: "fa-calendar",	c: "\uf073"},
    {n: "fa-random",	c: "\uf074"},
    {n: "fa-comment",	c: "\uf075"},
    {n: "fa-magnet",	c: "\uf076"},
    {n: "fa-chevron-up",	c: "\uf077"},
    {n: "fa-chevron-down",	c: "\uf078"},
    {n: "fa-retweet",	c: "\uf079"},
    {n: "fa-shopping-cart",	c: "\uf07a"},
    {n: "fa-folder",	c: "\uf07b"},
    {n: "fa-folder-open",	c: "\uf07c"},
    {n: "fa-arrows-v",	c: "\uf07d"},
    {n: "fa-arrows-h",	c: "\uf07e"},
    {n: "fa-bar-chart",	c: "\uf080"},
    {n: "fa-twitter-square",	c: "\uf081"},
    {n: "fa-facebook-square",	c: "\uf082"},
    {n: "fa-camera-retro",	c: "\uf083"},
    {n: "fa-key",	c: "\uf084"},
    {n: "fa-cogs",	c: "\uf085"},
    {n: "fa-comments",	c: "\uf086"},
    {n: "fa-thumbs-o-up",	c: "\uf087"},
    {n: "fa-thumbs-o-down",	c: "\uf088"},
    {n: "fa-star-half",	c: "\uf089"},
    {n: "fa-heart-o",	c: "\uf08a"},
    {n: "fa-sign-out",	c: "\uf08b"},
    {n: "fa-linkedin-square",	c: "\uf08c"},
    {n: "fa-thumb-tack",	c: "\uf08d"},
    {n: "fa-external-link",	c: "\uf08e"},
    {n: "fa-sign-in",	c: "\uf090"},
    {n: "fa-trophy",	c: "\uf091"},
    {n: "fa-github-square",	c: "\uf092"},
    {n: "fa-upload",	c: "\uf093"},
    {n: "fa-lemon-o",	c: "\uf094"},
    {n: "fa-phone",	c: "\uf095"},
    {n: "fa-square-o",	c: "\uf096"},
    {n: "fa-bookmark-o",	c: "\uf097"},
    {n: "fa-phone-square",	c: "\uf098"},
    {n: "fa-twitter",	c: "\uf099"},
    {n: "fa-facebook",	c: "\uf09a"},
    {n: "fa-github",	c: "\uf09b"},
    {n: "fa-unlock",	c: "\uf09c"},
    {n: "fa-credit-card",	c: "\uf09d"},
    {n: "fa-rss",	c: "\uf09e"},
    {n: "fa-hdd-o",	c: "\uf0a0"},
    {n: "fa-bullhorn",	c: "\uf0a1"},
    {n: "fa-bell",	c: "\uf0f3"},
    {n: "fa-certificate",	c: "\uf0a3"},
    {n: "fa-hand-o-right",	c: "\uf0a4"},
    {n: "fa-hand-o-left",	c: "\uf0a5"},
    {n: "fa-hand-o-up",	c: "\uf0a6"},
    {n: "fa-hand-o-down",	c: "\uf0a7"},
    {n: "fa-arrow-circle-left",	c: "\uf0a8"},
    {n: "fa-arrow-circle-right",	c: "\uf0a9"},
    {n: "fa-arrow-circle-up",	c: "\uf0aa"},
    {n: "fa-arrow-circle-down",	c: "\uf0ab"},
    {n: "fa-globe",	c: "\uf0ac"},
    {n: "fa-wrench",	c: "\uf0ad"},
    {n: "fa-tasks",	c: "\uf0ae"},
    {n: "fa-filter",	c: "\uf0b0"},
    {n: "fa-briefcase",	c: "\uf0b1"},
    {n: "fa-arrows-alt",	c: "\uf0b2"},
    {n: "fa-users",	c: "\uf0c0"},
    {n: "fa-link",	c: "\uf0c1"},
    {n: "fa-cloud",	c: "\uf0c2"},
    {n: "fa-flask",	c: "\uf0c3"},
    {n: "fa-scissors",	c: "\uf0c4"},
    {n: "fa-files-o",	c: "\uf0c5"},
    {n: "fa-paperclip",	c: "\uf0c6"},
    {n: "fa-floppy-o",	c: "\uf0c7"},
    {n: "fa-square",	c: "\uf0c8"},
    {n: "fa-bars",	c: "\uf0c9"},
    {n: "fa-list-ul",	c: "\uf0ca"},
    {n: "fa-list-ol",	c: "\uf0cb"},
    {n: "fa-strikethrough",	c: "\uf0cc"},
    {n: "fa-underline",	c: "\uf0cd"},
    {n: "fa-table",	c: "\uf0ce"},
    {n: "fa-magic",	c: "\uf0d0"},
    {n: "fa-truck",	c: "\uf0d1"},
    {n: "fa-pinterest",	c: "\uf0d2"},
    {n: "fa-pinterest-square",	c: "\uf0d3"},
    {n: "fa-google-plus-square",	c: "\uf0d4"},
    {n: "fa-google-plus",	c: "\uf0d5"},
    {n: "fa-money",	c: "\uf0d6"},
    {n: "fa-caret-down",	c: "\uf0d7"},
    {n: "fa-caret-up",	c: "\uf0d8"},
    {n: "fa-caret-left",	c: "\uf0d9"},
    {n: "fa-caret-right",	c: "\uf0da"},
    {n: "fa-columns",	c: "\uf0db"},
    {n: "fa-sort",	c: "\uf0dc"},
    {n: "fa-sort-desc",	c: "\uf0dd"},
    {n: "fa-sort-asc",	c: "\uf0de"},
    {n: "fa-envelope",	c: "\uf0e0"},
    {n: "fa-linkedin",	c: "\uf0e1"},
    {n: "fa-undo",	c: "\uf0e2"},
    {n: "fa-gavel",	c: "\uf0e3"},
    {n: "fa-tachometer",	c: "\uf0e4"},
    {n: "fa-comment-o",	c: "\uf0e5"},
    {n: "fa-comments-o",	c: "\uf0e6"},
    {n: "fa-bolt",	c: "\uf0e7"},
    {n: "fa-sitemap",	c: "\uf0e8"},
    {n: "fa-umbrella",	c: "\uf0e9"},
    {n: "fa-clipboard",	c: "\uf0ea"},
    {n: "fa-lightbulb-o",	c: "\uf0eb"},
    {n: "fa-exchange",	c: "\uf0ec"},
    {n: "fa-cloud-download",	c: "\uf0ed"},
    {n: "fa-cloud-upload",	c: "\uf0ee"},
    {n: "fa-user-md",	c: "\uf0f0"},
    {n: "fa-stethoscope",	c: "\uf0f1"},
    {n: "fa-suitcase",	c: "\uf0f2"},
    {n: "fa-bell-o",	c: "\uf0a2"},
    {n: "fa-coffee",	c: "\uf0f4"},
    {n: "fa-cutlery",	c: "\uf0f5"},
    {n: "fa-file-text-o",	c: "\uf0f6"},
    {n: "fa-building-o",	c: "\uf0f7"},
    {n: "fa-hospital-o",	c: "\uf0f8"},
    {n: "fa-ambulance",	c: "\uf0f9"},
    {n: "fa-medkit",	c: "\uf0fa"},
    {n: "fa-fighter-jet",	c: "\uf0fb"},
    {n: "fa-beer",	c: "\uf0fc"},
    {n: "fa-h-square",	c: "\uf0fd"},
    {n: "fa-plus-square",	c: "\uf0fe"},
    {n: "fa-angle-double-left",	c: "\uf100"},
    {n: "fa-angle-double-right",	c: "\uf101"},
    {n: "fa-angle-double-up",	c: "\uf102"},
    {n: "fa-angle-double-down",	c: "\uf103"},
    {n: "fa-angle-left",	c: "\uf104"},
    {n: "fa-angle-right",	c: "\uf105"},
    {n: "fa-angle-up",	c: "\uf106"},
    {n: "fa-angle-down",	c: "\uf107"},
    {n: "fa-desktop",	c: "\uf108"},
    {n: "fa-laptop",	c: "\uf109"},
    {n: "fa-tablet",	c: "\uf10a"},
    {n: "fa-mobile",	c: "\uf10b"},
    {n: "fa-circle-o",	c: "\uf10c"},
    {n: "fa-quote-left",	c: "\uf10d"},
    {n: "fa-quote-right",	c: "\uf10e"},
    {n: "fa-spinner",	c: "\uf110"},
    {n: "fa-circle",	c: "\uf111"},
    {n: "fa-reply",	c: "\uf112"},
    {n: "fa-github-alt",	c: "\uf113"},
    {n: "fa-folder-o",	c: "\uf114"},
    {n: "fa-folder-open-o",	c: "\uf115"},
    {n: "fa-smile-o",	c: "\uf118"},
    {n: "fa-frown-o",	c: "\uf119"},
    {n: "fa-meh-o",	c: "\uf11a"},
    {n: "fa-gamepad",	c: "\uf11b"},
    {n: "fa-keyboard-o",	c: "\uf11c"},
    {n: "fa-flag-o",	c: "\uf11d"},
    {n: "fa-flag-checkered",	c: "\uf11e"},
    {n: "fa-terminal",	c: "\uf120"},
    {n: "fa-code",	c: "\uf121"},
    {n: "fa-reply-all",	c: "\uf122"},
    {n: "fa-star-half-o",	c: "\uf123"},
    {n: "fa-location-arrow",	c: "\uf124"},
    {n: "fa-crop",	c: "\uf125"},
    {n: "fa-code-fork",	c: "\uf126"},
    {n: "fa-chain-broken",	c: "\uf127"},
    {n: "fa-question",	c: "\uf128"},
    {n: "fa-info",	c: "\uf129"},
    {n: "fa-exclamation",	c: "\uf12a"},
    {n: "fa-superscript",	c: "\uf12b"},
    {n: "fa-subscript",	c: "\uf12c"},
    {n: "fa-eraser",	c: "\uf12d"},
    {n: "fa-puzzle-piece",	c: "\uf12e"},
    {n: "fa-microphone",	c: "\uf130"},
    {n: "fa-microphone-slash",	c: "\uf131"},
    {n: "fa-shield",	c: "\uf132"},
    {n: "fa-calendar-o",	c: "\uf133"},
    {n: "fa-fire-extinguisher",	c: "\uf134"},
    {n: "fa-rocket",	c: "\uf135"},
    {n: "fa-maxcdn",	c: "\uf136"},
    {n: "fa-chevron-circle-left",	c: "\uf137"},
    {n: "fa-chevron-circle-right",	c: "\uf138"},
    {n: "fa-chevron-circle-up",	c: "\uf139"},
    {n: "fa-chevron-circle-down",	c: "\uf13a"},
    {n: "fa-html5",	c: "\uf13b"},
    {n: "fa-css3",	c: "\uf13c"},
    {n: "fa-anchor",	c: "\uf13d"},
    {n: "fa-unlock-alt",	c: "\uf13e"},
    {n: "fa-bullseye",	c: "\uf140"},
    {n: "fa-ellipsis-h",	c: "\uf141"},
    {n: "fa-ellipsis-v",	c: "\uf142"},
    {n: "fa-rss-square",	c: "\uf143"},
    {n: "fa-play-circle",	c: "\uf144"},
    {n: "fa-ticket",	c: "\uf145"},
    {n: "fa-minus-square",	c: "\uf146"},
    {n: "fa-minus-square-o",	c: "\uf147"},
    {n: "fa-level-up",	c: "\uf148"},
    {n: "fa-level-down",	c: "\uf149"},
    {n: "fa-check-square",	c: "\uf14a"},
    {n: "fa-pencil-square",	c: "\uf14b"},
    {n: "fa-external-link-square",	c: "\uf14c"},
    {n: "fa-share-square",	c: "\uf14d"},
    {n: "fa-compass",	c: "\uf14e"},
    {n: "fa-caret-square-o-down",	c: "\uf150"},
    {n: "fa-caret-square-o-up",	c: "\uf151"},
    {n: "fa-caret-square-o-right",	c: "\uf152"},
    {n: "fa-eur",	c: "\uf153"},
    {n: "fa-gbp",	c: "\uf154"},
    {n: "fa-usd",	c: "\uf155"},
    {n: "fa-inr",	c: "\uf156"},
    {n: "fa-jpy",	c: "\uf157"},
    {n: "fa-rub",	c: "\uf158"},
    {n: "fa-krw",	c: "\uf159"},
    {n: "fa-btc",	c: "\uf15a"},
    {n: "fa-file",	c: "\uf15b"},
    {n: "fa-file-text",	c: "\uf15c"},
    {n: "fa-sort-alpha-asc",	c: "\uf15d"},
    {n: "fa-sort-alpha-desc",	c: "\uf15e"},
    {n: "fa-sort-amount-asc",	c: "\uf160"},
    {n: "fa-sort-amount-desc",	c: "\uf161"},
    {n: "fa-sort-numeric-asc",	c: "\uf162"},
    {n: "fa-sort-numeric-desc",	c: "\uf163"},
    {n: "fa-thumbs-up",	c: "\uf164"},
    {n: "fa-thumbs-down",	c: "\uf165"},
    {n: "fa-youtube-square",	c: "\uf166"},
    {n: "fa-youtube",	c: "\uf167"},
    {n: "fa-xing",	c: "\uf168"},
    {n: "fa-xing-square",	c: "\uf169"},
    {n: "fa-youtube-play",	c: "\uf16a"},
    {n: "fa-dropbox",	c: "\uf16b"},
    {n: "fa-stack-overflow",	c: "\uf16c"},
    {n: "fa-instagram",	c: "\uf16d"},
    {n: "fa-flickr",	c: "\uf16e"},
    {n: "fa-adn",	c: "\uf170"},
    {n: "fa-bitbucket",	c: "\uf171"},
    {n: "fa-bitbucket-square",	c: "\uf172"},
    {n: "fa-tumblr",	c: "\uf173"},
    {n: "fa-tumblr-square",	c: "\uf174"},
    {n: "fa-long-arrow-down",	c: "\uf175"},
    {n: "fa-long-arrow-up",	c: "\uf176"},
    {n: "fa-long-arrow-left",	c: "\uf177"},
    {n: "fa-long-arrow-right",	c: "\uf178"},
    {n: "fa-apple",	c: "\uf179"},
    {n: "fa-windows",	c: "\uf17a"},
    {n: "fa-android",	c: "\uf17b"},
    {n: "fa-linux",	c: "\uf17c"},
    {n: "fa-dribbble",	c: "\uf17d"},
    {n: "fa-skype",	c: "\uf17e"},
    {n: "fa-foursquare",	c: "\uf180"},
    {n: "fa-trello",	c: "\uf181"},
    {n: "fa-female",	c: "\uf182"},
    {n: "fa-male",	c: "\uf183"},
    {n: "fa-gratipay",	c: "\uf184"},
    {n: "fa-sun-o",	c: "\uf185"},
    {n: "fa-moon-o",	c: "\uf186"},
    {n: "fa-archive",	c: "\uf187"},
    {n: "fa-bug",	c: "\uf188"},
    {n: "fa-vk",	c: "\uf189"},
    {n: "fa-weibo",	c: "\uf18a"},
    {n: "fa-renren",	c: "\uf18b"},
    {n: "fa-pagelines",	c: "\uf18c"},
    {n: "fa-stack-exchange",	c: "\uf18d"},
    {n: "fa-arrow-circle-o-right",	c: "\uf18e"},
    {n: "fa-arrow-circle-o-left",	c: "\uf190"},
    {n: "fa-caret-square-o-left",	c: "\uf191"},
    {n: "fa-dot-circle-o",	c: "\uf192"},
    {n: "fa-wheelchair",	c: "\uf193"},
    {n: "fa-vimeo-square",	c: "\uf194"},
    {n: "fa-try",	c: "\uf195"},
    {n: "fa-plus-square-o",	c: "\uf196"},
    {n: "fa-space-shuttle",	c: "\uf197"},
    {n: "fa-slack",	c: "\uf198"},
    {n: "fa-envelope-square",	c: "\uf199"},
    {n: "fa-wordpress",	c: "\uf19a"},
    {n: "fa-openid",	c: "\uf19b"},
    {n: "fa-university",	c: "\uf19c"},
    {n: "fa-graduation-cap",	c: "\uf19d"},
    {n: "fa-yahoo",	c: "\uf19e"},
    {n: "fa-google",	c: "\uf1a0"},
    {n: "fa-reddit",	c: "\uf1a1"},
    {n: "fa-reddit-square",	c: "\uf1a2"},
    {n: "fa-stumbleupon-circle",	c: "\uf1a3"},
    {n: "fa-stumbleupon",	c: "\uf1a4"},
    {n: "fa-delicious",	c: "\uf1a5"},
    {n: "fa-digg",	c: "\uf1a6"},
    {n: "fa-pied-piper",	c: "\uf1a7"},
    {n: "fa-pied-piper-alt",	c: "\uf1a8"},
    {n: "fa-drupal",	c: "\uf1a9"},
    {n: "fa-joomla",	c: "\uf1aa"},
    {n: "fa-language",	c: "\uf1ab"},
    {n: "fa-fax",	c: "\uf1ac"},
    {n: "fa-building",	c: "\uf1ad"},
    {n: "fa-child",	c: "\uf1ae"},
    {n: "fa-paw",	c: "\uf1b0"},
    {n: "fa-spoon",	c: "\uf1b1"},
    {n: "fa-cube",	c: "\uf1b2"},
    {n: "fa-cubes",	c: "\uf1b3"},
    {n: "fa-behance",	c: "\uf1b4"},
    {n: "fa-behance-square",	c: "\uf1b5"},
    {n: "fa-steam",	c: "\uf1b6"},
    {n: "fa-steam-square",	c: "\uf1b7"},
    {n: "fa-recycle",	c: "\uf1b8"},
    {n: "fa-car",	c: "\uf1b9"},
    {n: "fa-taxi",	c: "\uf1ba"},
    {n: "fa-tree",	c: "\uf1bb"},
    {n: "fa-spotify",	c: "\uf1bc"},
    {n: "fa-deviantart",	c: "\uf1bd"},
    {n: "fa-soundcloud",	c: "\uf1be"},
    {n: "fa-database",	c: "\uf1c0"},
    {n: "fa-file-pdf-o",	c: "\uf1c1"},
    {n: "fa-file-word-o",	c: "\uf1c2"},
    {n: "fa-file-excel-o",	c: "\uf1c3"},
    {n: "fa-file-powerpoint-o",	c: "\uf1c4"},
    {n: "fa-file-image-o",	c: "\uf1c5"},
    {n: "fa-file-archive-o",	c: "\uf1c6"},
    {n: "fa-file-audio-o",	c: "\uf1c7"},
    {n: "fa-file-video-o",	c: "\uf1c8"},
    {n: "fa-file-code-o",	c: "\uf1c9"},
    {n: "fa-vine",	c: "\uf1ca"},
    {n: "fa-codepen",	c: "\uf1cb"},
    {n: "fa-jsfiddle",	c: "\uf1cc"},
    {n: "fa-life-ring",	c: "\uf1cd"},
    {n: "fa-circle-o-notch",	c: "\uf1ce"},
    {n: "fa-rebel",	c: "\uf1d0"},
    {n: "fa-empire",	c: "\uf1d1"},
    {n: "fa-git-square",	c: "\uf1d2"},
    {n: "fa-git",	c: "\uf1d3"},
    {n: "fa-hacker-news",	c: "\uf1d4"},
    {n: "fa-tencent-weibo",	c: "\uf1d5"},
    {n: "fa-qq",	c: "\uf1d6"},
    {n: "fa-weixin",	c: "\uf1d7"},
    {n: "fa-paper-plane",	c: "\uf1d8"},
    {n: "fa-paper-plane-o",	c: "\uf1d9"},
    {n: "fa-history",	c: "\uf1da"},
    {n: "fa-circle-thin",	c: "\uf1db"},
    {n: "fa-header",	c: "\uf1dc"},
    {n: "fa-paragraph",	c: "\uf1dd"},
    {n: "fa-sliders",	c: "\uf1de"},
    {n: "fa-share-alt",	c: "\uf1e0"},
    {n: "fa-share-alt-square",	c: "\uf1e1"},
    {n: "fa-bomb",	c: "\uf1e2"},
    {n: "fa-futbol-o",	c: "\uf1e3"},
    {n: "fa-tty",	c: "\uf1e4"},
    {n: "fa-binoculars",	c: "\uf1e5"},
    {n: "fa-plug",	c: "\uf1e6"},
    {n: "fa-slideshare",	c: "\uf1e7"},
    {n: "fa-twitch",	c: "\uf1e8"},
    {n: "fa-yelp",	c: "\uf1e9"},
    {n: "fa-newspaper-o",	c: "\uf1ea"},
    {n: "fa-wifi",	c: "\uf1eb"},
    {n: "fa-calculator",	c: "\uf1ec"},
    {n: "fa-paypal",	c: "\uf1ed"},
    {n: "fa-google-wallet",	c: "\uf1ee"},
    {n: "fa-cc-visa",	c: "\uf1f0"},
    {n: "fa-cc-mastercard",	c: "\uf1f1"},
    {n: "fa-cc-discover",	c: "\uf1f2"},
    {n: "fa-cc-amex",	c: "\uf1f3"},
    {n: "fa-cc-paypal",	c: "\uf1f4"},
    {n: "fa-cc-stripe",	c: "\uf1f5"},
    {n: "fa-bell-slash",	c: "\uf1f6"},
    {n: "fa-bell-slash-o",	c: "\uf1f7"},
    {n: "fa-trash",	c: "\uf1f8"},
    {n: "fa-copyright",	c: "\uf1f9"},
    {n: "fa-at",	c: "\uf1fa"},
    {n: "fa-eyedropper",	c: "\uf1fb"},
    {n: "fa-paint-brush",	c: "\uf1fc"},
    {n: "fa-birthday-cake",	c: "\uf1fd"},
    {n: "fa-area-chart",	c: "\uf1fe"},
    {n: "fa-pie-chart",	c: "\uf200"},
    {n: "fa-line-chart",	c: "\uf201"},
    {n: "fa-lastfm",	c: "\uf202"},
    {n: "fa-lastfm-square",	c: "\uf203"},
    {n: "fa-toggle-off",	c: "\uf204"},
    {n: "fa-toggle-on",	c: "\uf205"},
    {n: "fa-bicycle",	c: "\uf206"},
    {n: "fa-bus",	c: "\uf207"},
    {n: "fa-ioxhost",	c: "\uf208"},
    {n: "fa-angellist",	c: "\uf209"},
    {n: "fa-cc",	c: "\uf20a"},
    {n: "fa-ils",	c: "\uf20b"},
    {n: "fa-meanpath",	c: "\uf20c"},
    {n: "fa-buysellads",	c: "\uf20d"},
    {n: "fa-connectdevelop",	c: "\uf20e"},
    {n: "fa-dashcube",	c: "\uf210"},
    {n: "fa-forumbee",	c: "\uf211"},
    {n: "fa-leanpub",	c: "\uf212"},
    {n: "fa-sellsy",	c: "\uf213"},
    {n: "fa-shirtsinbulk",	c: "\uf214"},
    {n: "fa-simplybuilt",	c: "\uf215"},
    {n: "fa-skyatlas",	c: "\uf216"},
    {n: "fa-cart-plus",	c: "\uf217"},
    {n: "fa-cart-arrow-down",	c: "\uf218"},
    {n: "fa-diamond",	c: "\uf219"},
    {n: "fa-ship",	c: "\uf21a"},
    {n: "fa-user-secret",	c: "\uf21b"},
    {n: "fa-motorcycle",	c: "\uf21c"},
    {n: "fa-street-view",	c: "\uf21d"},
    {n: "fa-heartbeat",	c: "\uf21e"},
    {n: "fa-venus",	c: "\uf221"},
    {n: "fa-mars",	c: "\uf222"},
    {n: "fa-mercury",	c: "\uf223"},
    {n: "fa-transgender",	c: "\uf224"},
    {n: "fa-transgender-alt",	c: "\uf225"},
    {n: "fa-venus-double",	c: "\uf226"},
    {n: "fa-mars-double",	c: "\uf227"},
    {n: "fa-venus-mars",	c: "\uf228"},
    {n: "fa-mars-stroke",	c: "\uf229"},
    {n: "fa-mars-stroke-v",	c: "\uf22a"},
    {n: "fa-mars-stroke-h",	c: "\uf22b"},
    {n: "fa-neuter",	c: "\uf22c"},
    {n: "fa-genderless",	c: "\uf22d"},
    {n: "fa-facebook-official",	c: "\uf230"},
    {n: "fa-pinterest-p",	c: "\uf231"},
    {n: "fa-whatsapp",	c: "\uf232"},
    {n: "fa-server",	c: "\uf233"},
    {n: "fa-user-plus",	c: "\uf234"},
    {n: "fa-user-times",	c: "\uf235"},
    {n: "fa-bed",	c: "\uf236"},
    {n: "fa-viacoin",	c: "\uf237"},
    {n: "fa-train",	c: "\uf238"},
    {n: "fa-subway",	c: "\uf239"},
    {n: "fa-medium",	c: "\uf23a"},
    {n: "fa-y-combinator",	c: "\uf23b"},
    {n: "fa-optin-monster",	c: "\uf23c"},
    {n: "fa-opencart",	c: "\uf23d"},
    {n: "fa-expeditedssl",	c: "\uf23e"},
    {n: "fa-battery-full",	c: "\uf240"},
    {n: "fa-battery-three-quarters",	c: "\uf241"},
    {n: "fa-battery-half",	c: "\uf242"},
    {n: "fa-battery-quarter",	c: "\uf243"},
    {n: "fa-battery-empty",	c: "\uf244"},
    {n: "fa-mouse-pointer",	c: "\uf245"},
    {n: "fa-i-cursor",	c: "\uf246"},
    {n: "fa-object-group",	c: "\uf247"},
    {n: "fa-object-ungroup",	c: "\uf248"},
    {n: "fa-sticky-note",	c: "\uf249"},
    {n: "fa-sticky-note-o",	c: "\uf24a"},
    {n: "fa-cc-jcb",	c: "\uf24b"},
    {n: "fa-cc-diners-club",	c: "\uf24c"},
    {n: "fa-clone",	c: "\uf24d"},
    {n: "fa-balance-scale",	c: "\uf24e"},
    {n: "fa-hourglass-o",	c: "\uf250"},
    {n: "fa-hourglass-start",	c: "\uf251"},
    {n: "fa-hourglass-half",	c: "\uf252"},
    {n: "fa-hourglass-end",	c: "\uf253"},
    {n: "fa-hourglass",	c: "\uf254"},
    {n: "fa-hand-rock-o",	c: "\uf255"},
    {n: "fa-hand-paper-o",	c: "\uf256"},
    {n: "fa-hand-scissors-o",	c: "\uf257"},
    {n: "fa-hand-lizard-o",	c: "\uf258"},
    {n: "fa-hand-spock-o",	c: "\uf259"},
    {n: "fa-hand-pointer-o",	c: "\uf25a"},
    {n: "fa-hand-peace-o",	c: "\uf25b"},
    {n: "fa-trademark",	c: "\uf25c"},
    {n: "fa-registered",	c: "\uf25d"},
    {n: "fa-creative-commons",	c: "\uf25e"},
    {n: "fa-gg",	c: "\uf260"},
    {n: "fa-gg-circle",	c: "\uf261"},
    {n: "fa-tripadvisor",	c: "\uf262"},
    {n: "fa-odnoklassniki",	c: "\uf263"},
    {n: "fa-odnoklassniki-square",	c: "\uf264"},
    {n: "fa-get-pocket",	c: "\uf265"},
    {n: "fa-wikipedia-w",	c: "\uf266"},
    {n: "fa-safari",	c: "\uf267"},
    {n: "fa-chrome",	c: "\uf268"},
    {n: "fa-firefox",	c: "\uf269"},
    {n: "fa-opera",	c: "\uf26a"},
    {n: "fa-internet-explorer",	c: "\uf26b"},
    {n: "fa-television",	c: "\uf26c"},
    {n: "fa-contao",	c: "\uf26d"},
    {n: "fa-500px",	c: "\uf26e"},
    {n: "fa-amazon",	c: "\uf270"},
    {n: "fa-calendar-plus-o",	c: "\uf271"},
    {n: "fa-calendar-minus-o",	c: "\uf272"},
    {n: "fa-calendar-times-o",	c: "\uf273"},
    {n: "fa-calendar-check-o",	c: "\uf274"},
    {n: "fa-industry",	c: "\uf275"},
    {n: "fa-map-pin",	c: "\uf276"},
    {n: "fa-map-signs",	c: "\uf277"},
    {n: "fa-map-o",	c: "\uf278"},
    {n: "fa-map",	c: "\uf279"},
    {n: "fa-commenting",	c: "\uf27a"},
    {n: "fa-commenting-o",	c: "\uf27b"},
    {n: "fa-houzz",	c: "\uf27c"},
    {n: "fa-vimeo",	c: "\uf27d"},
    {n: "fa-black-tie",	c: "\uf27e"},
    {n: "fa-fonticons",	c: "\uf280"}
  ];
})();

Usage

  • Widgets have to use FontAwesome as font name.
  • To display glyph, use curly brackets around glyph class name, e.g.: {text: 'fa-class displays {fa-class}'}

Below is a sample file using the utility above to display FontAwesome glyphs on ListView widget:

const {NavigationView, Page, CollectionView, Composite, TextView, ui} = require('tabris');
const TabrisFontAwesome = require('./TabrisFontAwesome');


let navigationView = new NavigationView({
  left: 0, top: 0, right: 0, bottom: 0
}).appendTo(ui.contentView);

let page = new Page({title: 'FontAwesome Icons'}).appendTo(navigationView);
let glyphs = TabrisFontAwesome.glyphTable;
new CollectionView({
  left:0, top:0, bottom:0, right:0,
  cellHeight: 48,
  itemCount:glyphs.length,
  createCell: function(){
    let cell = new Composite();
    let f = '14px '+TabrisFontAwesome.font
    new Composite({
      id: 'garis',
      left: 0, right: 0, bottom: 0, height: 1,
      background: '#e7e7e7'
    }).appendTo(cell);
    new TextView({
      id: 'glyph',
      alignment: 'right',
      right: 10, centerY: 0, width: 140,
      font: f,
      textColor: '#212121'
    }).appendTo(cell);
    new TextView({
      id: 'name',
      left: 10, right: ['prev()', 10], centerY: 0,
      font: f,
      textColor: '#212121'
    }).appendTo(cell);
    return cell;
  },
  updateCell: function(cell, index){
    let glyph = glyphs[index];  
    cell.apply({
      '#name': {text: glyph.n},
      '#glyph': {text: TabrisFontAwesome.fa('{'+glyph.n+'}')}
    });   
  },
}).appendTo(page);

Expected result:

Clone this wiki locally