How to add Custom Font to your iOS-based App?

How to add Custom Font to
your iOS-based App?

About Neev
Magento
Hybris Commerce
SaaS Applications
Adobe Marketing Cloud
Custom Development
Key Company Highlights
300+ team with experience
in managing offshore,
distributed development.
Neev Technologies
established in Jan ’05
VC Funding in 2009 By
Basil Partners
Part of Publicis Groupe
Hybris and Adobe CQ
centers of Excellence
Offices at Bangalore,
Gurgaon, Pune, Mumbai
Member of NASSCOM
Mobile Cloud
iPhone
Android
PhoneGap
Windows Phone
HTML5 Apps
Web
AWS
Rackspace
Joyent
Heroku
Google Cloud Platform
Digital Marketing, CRM, Analytics (Omni-Channel)
User Interface Design and User Experience Design
Performance Consulting Practices
Quality Assurance & Testing
Outsourced Product Development
Click here to know more about us

Reusability of code – The Need
• Neev follows the best coding practices to provide the highest quality
software.
• Reusability helps easily maintain an application.
• If the application code is maintainable, then it is more flexible for new and
challenging requirements.
• In iOS-based Apps, custom fonts can be used in the many places. So, instead
of copying the code repetitively, a better approach is to reuse.
• iOS, Apple’s mobile operating system, doesn’t support all fonts. Thus, in order
to use a custom font, we would need to include that custom font in the
project we work on.

How to include Custom Font in an iOS App?
1) Add the Custom font required by the application under folder named ‘Fonts’

How to include Custom Font in a Project?
2) Add the name of the custom font in ‘.plist’ file with the key “Fonts provided by
application” as in the below image.

How to include Custom Font in a Project?
3) Check whether the custom font is appearing in the Target -> build phases –> copy
bundle resources.

How can we implement a custom font in an iOS App?
1) Create the class ‘NVLabel’ as a subclass of ‘UILabel’ as shown below.
2) Add the below code in NVLabel.h file
#import <UIKit/UIKit.h>
@interface NVLabel : UILabel
// NV font is used for automatically setting font and other look and feel
// properties of UILabels
// Usage: in XIB add a keyValue with key “NVFont” and value “_tile_headerSub_”
// refer to util class for more details on values.
@property (nonatomic, strong) NSString *NVFont;
@end1

3) Add the below code in the NVLabel.m file
{
self.NVFont = value;
[FontUtil decorate:self];
}
}
// Only override drawRect: if you perform custom
drawing.
// An empty implementation adversely affects
performance during animation.
- (void)drawRect:(CGRect)rect
{
// Drawing code
}
*/
@end
#import “NVLabel.h”
#import “FontUtil.h”
@implementation NVLabel
@synthesize NVFont;
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
}
return self;
}
-(void) setValue:(id)value forKey:(NSString *)key
{
if ([key isEqualToString:@"NVFont"])

4) Create the class FontUtils.h and FontUtils.m
// FontUtil.h
#import <Foundation/Foundation.h>
#import “NVLabel.h”
@interface FontUtil : NSObject
+ (void)decorate:(NVLabel *)label;
+(void)decorateView:(UIView *)view;
+(UIFont*)robotoCondensedWithSize:(int)size;
+(UIFont*)robotoRegularWithSize:(int)size;
@end

5) In the class FontUtils.m, add the following code.
NSString *font = label.NVFont;
if (font == nil) {
return;
}
// more specific conditions must be checked before
generic ones.
// Ex: _af_tile_header_ must be checked before
_tile_header_ which in turn must be checked before
_header_
if ([font hasSuffix:@"_title_Mac_"]){
label.font = [FontUtil robotoItalicWithSize:16];
label.textColor = [UIColor greenColor];
} else if ([font hasSuffix:@"_title_name_2"]){
label.font = [FontUtil robotoCondensedWithSize:18];
label.textColor = [UIColor redColor];
}else if ([font hasSuffix:@"title_sub_3"]){
// FontUtil.m
#import “FontUtil.h”
#include <objc/runtime.h>
#include “NVLabel.h”
@implementation FontUtil
+(UIFont*)robotoCondensedWithSize:(int)size{
UIFont *font = [UIFont fontWithName:@"Roboto-
Condensed" size:size];
return font;
}
+(UIFont*)robotoItalicWithSize:(int)size{
UIFont *font = [UIFont fontWithName:@"Roboto-
Italic" size:size];
return font;
}
+(void)decorate:(NVLabel *)label {
label.textColor = [UIColor brownColor];
}
}
+(void)decorateView:(UIView *)view {
NSArray *subviews = [view subviews];
for (int i = 0; i < subviews.count; ++i) {
UIView *subview = [subviews objectAtIndex:i];
if ([subview isKindOfClass:[NVLabel class]]) {
[FontUtil decorate:(NVLabel *)subview];
} else {
[FontUtil decorateView:subview];
}
}
}
@end

6) After addition of the above code to create the required set of files, go to view controller.xib .
• Go to show identity inspector
• Under Custom class, it should be a subclass of NVLabel
• Below ‘User Defined Run-Time Attributes’, add the keypath as NVFont , font as String , Value of the
string is in the below format _name_subname_

7) After adding the user defined attributes , go to FontUtils.m
8) In the method, add the following code:
label.font = [FontUtil robotoItalicWithSize:16];
label.textColor = [UIColor greenColor];
} else if ([font hasSuffix:@"_title_name_2"]){
label.textColor = [UIColor redColor];
}else if ([font hasSuffix:@"title_sub_3"]){
label.textColor = [UIColor brownColor];
}
}
+(void)decorate:(NVLabel *)label {
NSString *font = label.NVFont;
if (font == nil) {
return;
}
// TODO
// more specific conditions must be checked before
generic ones.
// Ex: _af_tile_header_ must be checked before
_tile_header_ which in turn must be checked before
_header_
if ([font hasSuffix:@"_title_Mac_"]){

9) In the above code, in if ([font hasSuffix:@"_title_Mac_"]), replace “title Mac”
with the value of the string as given in the user defined attributes as in if([font
hasSuffix:@”Value given in the user defined attributes”])
10)Include FontUtil.h in your class. In the ‘viewdidload’ method, call the [FontUtil
decorateView:self.view]

Final Word
• These steps can be used to add any number of custom fonts to an iOS App.
• This method can be used for any iOS-based App that requires a custom font to
be added to it.
• Once the above steps are completed, iOS would allow the App to use the
custom font.
• To know more about our iOS application development capabilities, visit us
here.

The Neev Edge
• End-to-end consultative approach for software solutions through needs assessment,
process consulting and strategic advice.
• Internal QMS are ISO 9001-2008 certified and CMM level 3 compliant.
• Continuous process and service level improvements through deployment of best-of-breed
processes and technologies.
• International Standards and best practices on Project Management including PMI, ISO
and Prince-2.
• Proven EDC Model of delivery to provide predictable results.
• Scrum based Agile development methodology.

Neev Information Technologies Pvt. Ltd. sales@neevtech.com
India - Bangalore
The Estate, # 121,6th Floor,
Dickenson Road
Bangalore-560042
Phone :+91 80 25594416
India - Pune
Office No. 4 & 5, 2nd floor, L-Square,
Plot No. 8, Sanghvi Nagar, Aundh,
Pune - 411007.
Phone :+91 20 64103338
For more info on our offerings, visit www.neevtech.com

How to add Custom Font to your iOS-based App?

Recommended

More Related Content

What's hot (20)

Viewers also liked (7)

Similar to How to add Custom Font to your iOS-based App? (20)

More from Neev Technologies (20)

Recently uploaded (20)

How to add Custom Font to your iOS-based App?