{"id":36,"date":"2020-03-01T14:10:51","date_gmt":"2020-03-01T13:10:51","guid":{"rendered":"https:\/\/mic.st\/blog\/?p=36"},"modified":"2020-03-01T16:20:46","modified_gmt":"2020-03-01T15:20:46","slug":"how-to-use-new-ios-13-system-fonts-like-new-york","status":"publish","type":"post","link":"https:\/\/mic.st\/blog\/how-to-use-new-ios-13-system-fonts-like-new-york\/","title":{"rendered":"How to use new iOS 13 system fonts like New York"},"content":{"rendered":"\n<p>At the WWDC19 there was introduced a lot of font related cool stuff for iOS13. One great thing is the new serif system font <em>NewYork<\/em> which can be used in your apps.<\/p>\n\n\n\n<p>To initialize a <code>UIFont<\/code> with this or any other of the new font styles, we have to use <code>UIFontDescriptors<\/code>. I did not know about these before but they basically allow you to initialise a font by describing its characteristics, e.g. the style of the font or its family name.<\/p>\n\n\n\n<p>So here we go:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript\"><span class=\"hljs-comment\">\/\/\/ We use a computed property so that we can use this font easily wherever we want to.<\/span>\n<span class=\"hljs-keyword\">var<\/span> newYorkFont: UIFont {\n<span class=\"hljs-comment\">\/\/\/ 1. Initialize a system font with the preferred size and weight and access its `fontDescriptor` property.<\/span>\n      <span class=\"hljs-keyword\">let<\/span> descriptor = UIFont.systemFont(ofSize: <span class=\"hljs-number\">24<\/span>,\n                                         <span class=\"hljs-attr\">weight<\/span>: .semibold).fontDescriptor\n\n<span class=\"hljs-comment\">\/\/\/ 2. Use the new iOS13 `withDesign` to get the `UIFontDescriptor` for a serif version of your system font. The size is derived from your initial `UIFont` so set it to `0.0`<\/span>\n      <span class=\"hljs-keyword\">if<\/span> <span class=\"hljs-keyword\">let<\/span> serif = descriptor.withDesign(.serif) {\n        <span class=\"hljs-keyword\">return<\/span> UIFont(descriptor: serif, <span class=\"hljs-attr\">size<\/span>: <span class=\"hljs-number\">0.0<\/span>)\n      }\n\n<span class=\"hljs-comment\">\/\/\/ 3. Initialize a font with the serif descriptor of your system font. Again: use `0.0` as `size` parameter to prevent overriding the initial size we did set above.<\/span>\n      <span class=\"hljs-keyword\">return<\/span> UIFont(descriptor: descriptor, <span class=\"hljs-attr\">size<\/span>: <span class=\"hljs-number\">0.0<\/span>)\n    }<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>It&#8217;s always nice to use system fonts because they are already installed on your iOS device which means you do not have to load them manually into your bundle. With iOS 13 there were a lot of great looking fonts introduced (see: <a href=\"https:\/\/developer.apple.com\/fonts\/system-fonts\/\" target=\"_blank\" rel=\"noopener\">https:\/\/developer.apple.com\/fonts\/system-fonts\/<\/a> and link below).<\/p>\n\n\n\n<hr class=\"wp-block-separator is-style-default\"\/>\n\n\n\n<p>Sources:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><a href=\"https:\/\/developer.apple.com\/videos\/play\/wwdc2019\/227\/\" target=\"_blank\" rel=\"noopener\">https:\/\/developer.apple.com\/videos\/play\/wwdc2019\/227\/<\/a><\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>At the WWDC19 there was introduced a lot of font related cool stuff for iOS13. One great thing is the new serif system font NewYork which can be used in your apps. To initialize a UIFont with this or any other of the new font styles, we have to use UIFontDescriptors. I did not know&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[3],"tags":[4,6,7,5],"class_list":["post-36","post","type-post","status-publish","format-standard","hentry","category-ios-development","tag-ios","tag-new-york","tag-systemfont","tag-uifont"],"_links":{"self":[{"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/posts\/36","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/comments?post=36"}],"version-history":[{"count":0,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/posts\/36\/revisions"}],"wp:attachment":[{"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/media?parent=36"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/categories?post=36"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/tags?post=36"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}