[@NaukriEngineering] Icon fonts & vector drawable in iOS apps
Icon Fonts & Vector
Drawable in iOS apps
• What are Icon Fonts?
• Benefits of using Icon Fonts
• How to use Icon Fonts?
• Convert SVG Files to TTF Format
• Vector Images
• How to use Vector Images?
What are Icon Fonts?
Icon fonts are just fonts, instead of containing
letters or numbers, they contain symbols and
We can use them in project the same way we use
regular text font.
Why to use Icon Fonts?
S Scalability: Font-based icons are resolution independent
and can be scaled to any desired extent. The icons will look
crisp regardless of retina, HDPI, XHDPI and so on
S Size: Cut into the right proportion, an icon font has an
incredibly smaller file size than a set of pixel images
S Maintainability: Since the icons are going to be packaged
into a single font file, there is only one file to maintain
throughout the project
S Adoption: There are numerous free and professional tools
that help to incorporate them easily
S Flexibility: Any request to change color, size, or appearance
can be made on the fly and tested by changing only a few
lines of code
S Interactivity: Icon fonts allow to show different states,
apply effects and create animations with no effort at all.
How to use icon fonts?
S Add .ttf files to project and add .ttf file name in plist file
under “Fonts provided by application” key.
SVG to TTF files
S FontForge tool can be used to
convert the .svg files into .otf
S otf2ttf can be used to
convert .otf to .ttf files
S Vector images differ from bitmaps that are made of pixels
S Vector images are made up of various “objects”
S Objects mean lines and shapes
S Defined mathematically by a set of algorithms or formulas,
which allow them to be redrawn over and over
S They are crisp images, regardless of resolution or pixel ratio
S They have smaller file size