Android Question Free Icons

Frankie Lagrange

Member
Licensed User
If you’re like me and most developers I know, you’ll never have enough of (free) icons, fonts etc.

Here’s a library of about 7000 icons absolutely free, courtesy of: Syncfusion. Check their 2m video on that page too.

Download their free Icon editor Metro Studio and you can generate, among many other things, a font file from their icons. In the example I’m about to describe, I exported as is all their emoticons (70 or so) into a true font format resource: emoticons.ttf.

You can then add this file to your B4A project and use it as you see fit.

But here’s a couple of techniques that I have used in some other development environments that I wanted to share with B4Xers.

Once you’ve exported emoticons.ttf file to you hard disk, open your browser and navigate to this site: IconFont2Code. Browse to locate emoticons.ttf and open it. The site will display all the icons and generate a list of their codes. For emoticons.ttf it generated this list:

B4X:
static class IconFont
{
    public const string Alien = "\ue700";
    public const string Angel = "\ue701";
    public const string Angel01 = "\ue702";
    public const string Angel02 = "\ue703";
    public const string Angry = "\ue704";
    public const string Annoyed = "\ue705";
    public const string BaringTeeth = "\ue706";
    public const string Bat = "\ue707";
    public const string Brb = "\ue708";
    public const string Cheeky = "\ue709";
    public const string Confused01 = "\ue70a";
    public const string Confused02 = "\ue70b";
    public const string Cool01 = "\ue70c";
    public const string Cool02 = "\ue70d";
    public const string Cry = "\ue70e";
    public const string Devil = "\ue70f";
    public const string Devil01 = "\ue710";
    public const string Devil02 = "\ue711";
    public const string Devil03 = "\ue712";
    public const string Envy = "\ue713";
    public const string EyeRoll = "\ue714";
    public const string Freezing = "\ue715";
    public const string Funny = "\ue716";
    public const string Ghost = "\ue717";
    public const string Glasses = "\ue718";
    public const string Happy03 = "\ue719";
    public const string Happy04 = "\ue71a";
    public const string Happy01 = "\ue71b";
    public const string Happy02 = "\ue71c";
    public const string HeartBroken = "\ue71d";
    public const string Hot = "\ue71e";
    public const string IDon'tKnow = "\ue71f";
    public const string InLove = "\ue720";
    public const string Kiss01 = "\ue721";
    public const string Kiss02 = "\ue722";
    public const string Laugh = "\ue723";
    public const string Like01 = "\ue724";
    public const string Like02 = "\ue725";
    public const string Like03 = "\ue726";
    public const string Like04 = "\ue727";
    public const string Lol = "\ue728";
    public const string Love = "\ue729";
    public const string Love01 = "\ue72a";
    public const string Love02 = "\ue72b";
    public const string Ninja = "\ue72c";
    public const string Pirate = "\ue72d";
    public const string Pirate01 = "\ue72e";
    public const string Rocker = "\ue72f";
    public const string Rofl = "\ue730";
    public const string Sad = "\ue731";
    public const string Sad_1 = "\ue732";
    public const string Sarcastic = "\ue733";
    public const string Secret01 = "\ue734";
    public const string Secret02 = "\ue735";
    public const string Shifty = "\ue736";
    public const string Sick = "\ue737";
    public const string Sleepy01 = "\ue738";
    public const string Sleepy02 = "\ue739";
    public const string Smile = "\ue73a";
    public const string Speechless = "\ue73b";
    public const string Surprise = "\ue73c";
    public const string Surprised = "\ue73d";
    public const string Thinking = "\ue73e";
    public const string ThumbsDown02 = "\ue73f";
    public const string TongueOut = "\ue740";
    public const string Unlike01 = "\ue741";
    public const string Unlike02 = "\ue742";
    public const string Unlike03 = "\ue743";
    public const string WhoMe = "\ue744";
    public const string Wink01 = "\ue745";
    public const string Wink02 = "\ue746";
    public const string Worried = "\ue747";
}


With 4 or 5 global edits you can turn this into a B4A module that you can use in your project and easily refer to the specific item by name. For example:

B4X:
    Button1.Typeface = MetroEmoticons.TF
    Button1.Text =  MetroEmoticons.Alien

    Label1.Typeface = MetroEmoticons.TF
    Label1.Text =  MetroEmoticons.Angel & MetroEmoticons.Angel01

Module Class:

B4X:
'Code module
'Subs in this code module will be accessible from all modules.
Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.
    Public  Alien As String = Chr(0xe700)
    Public  Angel As String = Chr(0xe701)
    Public  Angel01 As String = Chr(0xe702)
    Public  Angel02 As String = Chr(0xe703)
    Public  Angry As String = Chr(0xe704)
    Public  Annoyed As String = Chr(0xe705)
    Public  BaringTeeth As String = Chr(0xe706)
    Public  Bat As String = Chr(0xe707)
    Public  Brb As String = Chr(0xe708)
    Public  Cheeky As String = Chr(0xe709)
    Public  Confused01 As String = Chr(0xe70a)
    Public  Confused02 As String = Chr(0xe70b)
    Public  Cool01 As String = Chr(0xe70c)
    Public  Cool02 As String = Chr(0xe70d)
    Public  Cry As String = Chr(0xe70e)
    Public  Devil As String = Chr(0xe70f)
    Public  Devil01 As String = Chr(0xe710)
    Public  Devil02 As String = Chr(0xe711)
    Public  Devil03 As String = Chr(0xe712)
    Public  Envy As String = Chr(0xe713)
    Public  EyeRoll As String = Chr(0xe714)
    Public  Freezing As String = Chr(0xe715)
    Public  Funny As String = Chr(0xe716)
    Public  Ghost As String = Chr(0xe717)
    Public  Glasses As String = Chr(0xe718)
    Public  Happy03 As String = Chr(0xe719)
    Public  Happy04 As String = Chr(0xe71a)
    Public  Happy01 As String = Chr(0xe71b)
    Public  Happy02 As String = Chr(0xe71c)
    Public  HeartBroken As String = Chr(0xe71d)
    Public  Hot As String = Chr(0xe71e)
    Public  IDontKnow As String = Chr(0xe71f)
    Public  InLove As String = Chr(0xe720)
    Public  Kiss01 As String = Chr(0xe721)
    Public  Kiss02 As String = Chr(0xe722)
    Public  Laugh As String = Chr(0xe723)
    Public  Like01 As String = Chr(0xe724)
    Public  Like02 As String = Chr(0xe725)
    Public  Like03 As String = Chr(0xe726)
    Public  Like04 As String = Chr(0xe727)
    Public  Lol As String = Chr(0xe728)
    Public  Love As String = Chr(0xe729)
    Public  Love01 As String = Chr(0xe72a)
    Public  Love02 As String = Chr(0xe72b)
    Public  Ninja As String = Chr(0xe72c)
    Public  Pirate As String = Chr(0xe72d)
    Public  Pirate01 As String = Chr(0xe72e)
    Public  Rocker As String = Chr(0xe72f)
    Public  Rofl As String = Chr(0xe730)
    Public  Sad As String = Chr(0xe731)
    Public  Sad_1 As String = Chr(0xe732)
    Public  Sarcastic As String = Chr(0xe733)
    Public  Secret01 As String = Chr(0xe734)
    Public  Secret02 As String = Chr(0xe735)
    Public  Shifty As String = Chr(0xe736)
    Public  Sick As String = Chr(0xe737)
    Public  Sleepy01 As String = Chr(0xe738)
    Public  Sleepy02 As String = Chr(0xe739)
    Public  Smile As String = Chr(0xe73a)
    Public  Speechless As String = Chr(0xe73b)
    Public  Surprise As String = Chr(0xe73c)
    Public  Surprised As String = Chr(0xe73d)
    Public  Thinking As String = Chr(0xe73e)
    Public  ThumbsDown02 As String = Chr(0xe73f)
    Public  TongueOut As String = Chr(0xe740)
    Public  Unlike01 As String = Chr(0xe741)
    Public  Unlike02 As String = Chr(0xe742)
    Public  Unlike03 As String = Chr(0xe743)
    Public  WhoMe As String = Chr(0xe744)
    Public  Wink01 As String = Chr(0xe745)
    Public  Wink02 As String = Chr(0xe746)
    Public  Worried As String = Chr(0xe747)
    '
    Public TF As Typeface = Typeface.LoadFromAssets("Emoticons.ttf")
End Sub

Here’s the Activity code:

B4X:
#Region  Project Attributes
    #ApplicationLabel: B4A Example
    #VersionCode: 1
    #VersionName:
    'SupportedOrientations possible values: unspecified, landscape or portrait.
    #SupportedOrientations: unspecified
    #CanInstallToExternalStorage: False
#End Region

#Region  Activity Attributes
    #FullScreen: False
    #IncludeTitle: True
#End Region

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.
End Sub

Sub Globals
    Private Label1 As Label
    Private Button1 As Button
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    'Activity.LoadLayout("main")
  
    Button1.Initialize("")
    Button1.Typeface = MetroEmoticons.TF
    Button1.Text = "I'm an Alien " & MetroEmoticons.Alien
    Button1.TextSize = 35
  
    Label1.Initialize("")
    Label1.Typeface = MetroEmoticons.TF
    Label1.Color = Colors.Blue
    Label1.Text = "We're Angels " & MetroEmoticons.Angel & MetroEmoticons.Angel01
    Label1.TextSize = 40

    Activity.AddView(Button1, 0dip, 50dip, 100%x, 70dip)
    Activity.AddView(Label1, 0dip, 150dip, 100%x, 55dip)
End Sub


Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub


Sub Button1_Click
  
End Sub

Here are some of the Emoticon Font Icons:

1589316479706.png


I attach a very simple project to illustrate the technique.
 

Attachments

  • B4AFontTest.zip
    24.8 KB · Views: 213
Last edited:

TILogistic

Expert
Licensed User
Longtime User
tips: use fonts in B4X

B4X:
  Dim IconsFont As B4XFont 'Local o Global

'b4A
IconsFont =  xui.CreateFont(Typeface.LoadFromAssets("icons.ttf"),64)

'B4J
IconsFont = xui.CreateFont(fx.LoadFont(File.DirAssets,"icons.ttf",64),64)


SetFontToBitmap(Chr(0xf981), IconsFont, 36, xui.Color_White) 'Fonts to Image

Note: Chr(0xf981)

Sorry spanish forum

 
Last edited:
Upvote 0

Frankie Lagrange

Member
Licensed User
Hola oparra,

I like what you did in your post about fonts.

Are you trying to tell me something with [Note: Chr(0xf981) ]? I'm not sure I understand what. You'll notice that in the module I posted, we don't deal with the CHR value of the item, always difficult to remember, but with its name.

B4X:
  Button1.Text =  MetroEmoticons.Alien
 
Upvote 0

TILogistic

Expert
Licensed User
Longtime User
Hola oparra,

I like what you did in your post about fonts.

Are you trying to tell me something with [Note: Chr(0xf981) ]? I'm not sure I understand what. You'll notice that in the module I posted, we don't deal with the CHR value of the item, always difficult to remember, but with its name.

B4X:
  Button1.Text =  MetroEmoticons.Alien

It is similar to what you have done.

Look at the post that publishes fontello or iconmoon.

They generate a sample page, with the name and the code.

They can be translated into constants, like you, to make it readable.



Congratulations

and take care of the COVID-19
Cheers
 
Last edited:
Upvote 0

TILogistic

Expert
Licensed User
Longtime User
tips:

Erel

I publish a tool that we adapt to see the custom fonts that we generate.


Thanks erel.
 
Upvote 0
Top