Thing 1 And Thing 2 Font Download
by Chris Ching
Oct fifteen, 2018: Updated by Adrien Villez for the latest version of Swift and Xcode!
Custom fonts can brand all the divergence in the world when you're trying to convey a specific user experience. Luckily, information technology's pretty like shooting fish in a barrel to add together your ain fonts in your iOS app but there are some common pitfalls to watch out for.
Let's walk through how to add custom fonts to your iOS application and I'll highlight the common mistakes as we go.
Article CONTENTS
1. Include your fonts in your XCode project
2. Make sure that they're included in the target
3. Double check that your fonts are included every bit Resource in your parcel
4. Include your iOS custom fonts in your application plist
5. Detect the name of the font
6. Employ UIFont and specify the proper name of the font
Make sure you lot have a proper font license for mobile/app embedding.
The license can usually be constitute with your font download or on the site where you bought/downloaded it. Taking a minute to cheque information technology ensures y'all won't go into legal trouble down the route.
Step 1: Include your fonts in your XCode project
Most usually, you'll take a TTF or OTF font that you'll want to use with all of your UILabels or UITextViews in your app. Well, the first step is to include these fonts into your XCode project.
I commonly continue all of my app resources such as images or fonts in their ain directory called "Resources". I discover that this helps me stay organized as projects become much more than complex and in that location are a lot of files. Whatever your case may be, either elevate and driblet your font file(s) into your XCode file tree or right click and "Add together Files To…" to select your fonts.
Brand sure that the target you want to use your font in is checked!
(Click the GIF to play it)
Footstep 2: Make sure that they're included in the target
The side by side thing to do is to make sure that they're resources and included in your build target that yous want to employ the fonts in.
Make certain that the target you want to employ your font in is checked nether "Target Membership"
Step 3: Double check that your fonts are included equally Resources in your bundle
This should not be a problem but sometimes when you're having trouble getting your font face to show up, this can be a source of headache and then permit'south double check at present to rule information technology out as a potential pitfall.
this tin exist a source of headache
Go to your projection Build Phases pane past highlighting the XCode projection file in your solution explorer and on the correct manus side, select "Build Phases". You'll run across that one of the sections you tin can aggrandize is "Copy Bundle Resources". Open that list and make sure that your fonts are included in that list.
Ensure that your fonts are in the "Copy Bundle Resources" listing
Step four: Include your iOS custom fonts in your application plist
The next thing to do is to modify your app'south plist to include these font faces. By default, your plist will be named as info.plist.
Open up it and add together a new row called "Fonts provided by application" which volition be an array that yous need to add together all the filenames of the fonts you want to use. In my case, it was seven of the Quicksand fonts as you can encounter in the screenshot beneath. Be conscientious to include the extension and make sure that you don't perform whatsoever typos here. That's some other common problem, as uncomplicated as it may seem.
Come across the above screenshot on the cardinal that you need to add, followed by the filenames of the fonts you want to include in your iOS app
…make sure that you don't perform any typos hither. That'due south some other common problem
Step five: Observe the proper name of the font
This is a common pitfall for many people trying to include custom fonts into their iOS app. This was something that eluded me before too and it'southward the fact that when you specify which font you lot want to use, you're non specifying the file proper noun merely rather, the font name. The tricky part is that the font name may not exist what yous wait. It could be very unlike than whatsoever of the visible font names that you tin can see.
So in order to hands find the proper noun of the font that you want to utilise, you can output something to the console window and see for yourself.
The catchy part is that the font proper noun may non exist what you lot expect
Add this snippet of code to log all the fonts bachelor to your app in the console.
override func viewDidLoad() { super.viewDidLoad() // Do whatsoever additional setup after loading the view, typically from a nib. for family: String in UIFont.familyNames { impress(family unit) for names: String in UIFont.fontNames(forFamilyName: family) { print("== \(names)") } } } Once you run your app, you'll get the list of fonts displayed in your console log. Then its just a thing of finding your custom font in the list and getting the font names.
Logging all fonts and finding the font names for your custom font.
In the screenshot in a higher place, as y'all tin see the font proper noun I needed was QuicksandDash-Regular. This font name was no where to be found in the font properties or from the macOS font viewer. Call up to go rid of that code snippet afterwards you notice the font name that you need!
Step vi: Use UIFont and specify the name of the font
And finally, you can simply display your custom font using UIFont and whatever UILabel or text view you desire.
let label: UILabel = UILabel(frame: CGRect(ten: 0, y: 0, width: self.view.frame.size.width, peak: 120)) label.textAlignment = NSTextAlignment.heart label.text = "Using Custom Fonts" label.font = UIFont(proper noun: "QuicksandDash-Regular", size: 35) label.backgroundColor = UIColor.white self.view.addSubview(label) view.backgroundColor = UIColor.gray
Sample of using custom fonts in your iOS App!
I hope that this iOS custom fonts tutorial was helpful to you lot. Let me know in the comments below!
DOWNLOAD HERE
Posted by: vickershistiamseent.blogspot.com
Post a Comment