{"id":19368,"date":"2015-05-02T20:44:12","date_gmt":"2015-05-02T15:14:12","guid":{"rendered":"https:\/\/tothenewco.pro\/blog\/?p=19368"},"modified":"2015-05-02T20:44:12","modified_gmt":"2015-05-02T15:14:12","slug":"fix-vertical-position-issue-of-custom-ios-fonts","status":"publish","type":"post","link":"https:\/\/tothenewco.pro\/blog\/fix-vertical-position-issue-of-custom-ios-fonts\/","title":{"rendered":"Fix Vertical Position Issue of Custom iOS Fonts"},"content":{"rendered":"

Custom fonts can make all the difference in the world when you\u2019re trying to convey a specific user experience. Luckily, it\u2019s pretty easy to add your own fonts in your iOS app but most of the custom fonts usually have some issue with their vertical alignment. Either they sit too low or too high when compared to the default fonts. This poses a lot of problems and makes it quite difficult to get things aligned properly. The cause of this is that your custom font has an ascender<\/strong> and descender<\/strong> settings which are not being rendered properly by iOS.
\n\"iOS
\nLet me explain quickly what these two are before going any further. The ascender<\/strong> is essentially the whitespace at the top of a font and the descender<\/strong> is the whitespace at the bottom of a font, the two combined space the font out correctly in relation to screen elements and other fonts.
\nTo edit these in the font you will need to download the Apple Font Tool Suite<\/a>. Once you\u2019ve installed this you need to open Terminal and navigate to the directory that contains your font. After that enter the following command:<\/p>\n

ftxdumperfuser -t hhea -A d font.ttf <\/code><\/p>\n

This will create a file called font.hhea.xml, open this new file into a xcode and adjust the values for ascender and descender. Generally \t<\/p>\n

  • \n