Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
フォントの基本とUIFont/UIFontDescriptor
Search
satoshin21
January 14, 2017
Programming
12
3.5k
フォントの基本とUIFont/UIFontDescriptor
デザイナーとのコミュニケーションに必須なフォントの基本と
iOSの開発に用いられるUIFontと更に柔軟にフォントを扱えるUIFontDescriptorについて #potatotips36
satoshin21
January 14, 2017
Tweet
Share
More Decks by satoshin21
See All by satoshin21
少数精鋭で戦うための技術的改善について
satoshin21
3
1.1k
GTXiLibで小さく始めるAccessibility Testing
satoshin21
0
4.9k
iPhoneのカメラで写真撮影から現像までの技術を紐解く
satoshin21
4
3.2k
try! swift-sh
satoshin21
2
850
Reduxを取り入れて開発はpairs開発はどう変わったか
satoshin21
0
340
レガシーなアプリケーションの 60fps化を目指す為にやっていること
satoshin21
12
3.8k
Introducing CodeLayout with Tips
satoshin21
6
1.5k
World of No Interface Builder
satoshin21
0
1.8k
What I've done to attend WWDC
satoshin21
0
90
Other Decks in Programming
See All in Programming
GCCのプラグインを作る / I Made a GCC Plugin
shouth
1
150
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
360
約9000個の自動テストの 時間を50分->10分に短縮 Flakyテストを1%以下に抑えた話
hatsu38
23
11k
カスタムしながら理解するGraphQL Connection
yanagii
1
1.2k
飲食業界向けマルチプロダクトを実現させる開発体制とリアルな現状
hiroya0601
1
390
LLM生成文章の精度評価自動化とプロンプトチューニングの効率化について
layerx
PRO
2
140
現場で役立つモデリング 超入門
masuda220
PRO
13
2.9k
Identifying User Idenity
moro
6
7.9k
【Kaigi on Rails 2024】YOUTRUST スポンサーLT
krpk1900
1
250
Vue.js学習の振り返り
hiro_xre
2
130
Outline View in SwiftUI
1024jp
1
120
Nuxtベースの「WXT」でChrome拡張を作成する | Vue Fes 2024 ランチセッション
moshi1121
1
520
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
88
5.7k
A designer walks into a library…
pauljervisheath
202
24k
Fashionably flexible responsive web design (full day workshop)
malarkey
404
65k
Build The Right Thing And Hit Your Dates
maggiecrowley
32
2.4k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.1k
Learning to Love Humans: Emotional Interface Design
aarron
272
40k
The Cost Of JavaScript in 2023
addyosmani
45
6.6k
Designing for humans not robots
tammielis
249
25k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
231
17k
Being A Developer After 40
akosma
86
590k
What's new in Ruby 2.0
geeforr
342
31k
Mobile First: as difficult as doing things right
swwweet
222
8.9k
Transcript
ϑΥϯτͷجຊͱ UIFont/UIFontDescriptor @SatoshiN21
satoshin21 SatoshiN21 ࡔ ޛࢤ (Nagasaka Satoshi) - iOS Engineer of
pairs Div. eureka, Inc. - Swift, Objective-C, Java(Android), Apple Script
- pairs - Couples
class UIFont
ϑΥϯτ/ॻମ ‣ ϑΥϯτ㲈ॻମ w ॻମʮ͋ΔҰ؏ͨ͠σβΠϯํͰ࡞ΒΕͨจࣈͷू·Γʯ w ൛ͱ w ϑΥϯτͦΕΛදݱ͢Δखஈɺ͘͠Ұଗ͍ͷσʔλ
UIFont ‣ 6*'POU͕͍࣋ͬͯΔใ w /BNF GPOU/BNF GBNJMZ/BNF w QPJOU4J[F
w )FJHIUܥ MJOF)FJHIU MFBEJOH DBQ)FJHIU w CBTFMJOFܥ
baseline CBTFMJOF YIFJHIU DBQTIFJHIU "TDFOEFS %FTDFOEFS
baseline CBTFMJOF YIFJHIU DBQTIFJHIU "TDFOEFS %FTDFOEFS ‣ CBTFMJOFΛىʹͯ͠ԤจϑΥϯτϨΠΞτ͞ΕΔ ‣ BTDFOEFS
w CBTFMJOF͔Β্෦ͷڑ ‣ EFTDFOEFS w CBTFMJOF͔ΒԼ෦ͷڑ ෛ ‣ MFBEJOH w GPOUͷ࣋ͭߦؒ w MFBEJOHͷͳ͍ϑΥϯτ γεςϜϑΥϯτͳͲ
// San Francisco(.SFUIText) let font = UIFont.systemFont(ofSize: 12) let height
= abs(font.descender) + font.ascender + font.leading font.lineHeight == height // true font.lineHeight
AutoLayout தԝἧ͑ minLabel.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 10).isActive = true minLabel.rightAnchor.constraint(equalTo: largeLabel.leftAnchor,
constant: -12).isActive = true // Y軸を揃える minLabel.centerYAnchor .constraint(equalTo: largeLabel.centerYAnchor).isActive = true
AutoLayout firstBaseline // first baselineを揃える minLabel.firstBaselineAnchor .constraint(equalTo: largeLabel.firstBaselineAnchor).isActive = true
AutoLayout lastBaseline // last baselineを揃える minLabel.lastBaselineAnchor.constraint(equalTo : largeLabel.lastBaselineAnchor).isActive = true
ϑΥϯτʹҰखؒՃ͍͑ͨɾɾ
class UIFontDescriptor
UIFontDescriptorͱ ‣ ༷ʑͳϑΥϯτใΛऔಘ͢Δ͜ͱ͕Մೳ w ΣΠτɺΧεέʔυϑΥϯτɺελΠϧ ࣼମͷ֯ ‣ ্هͷΛมߋɺՃ͢Δ͜ͱ͕Մೳ
UIFontDescriptorCascadeListAttribute ‣ ΧεέʔυϑΥϯτΛྻͰࢦఆ ‣ ຊޠͷ߹͜ͷϑΥϯτͰද͍ࣔͨ͠ͱ͍͏࣌ͳͲʹ׆༻
UIFontDescriptorCascadeListAttribute let fontDescriptor = UIFontDescriptor(fontAttributes: [UIFontDescriptorNameAttribute: ".SFUIDisplay"]) let japaneseFont =
UIFontDescriptor(fontAttributes: [UIFontDescriptorNameAttribute: "HiraMinProN-W3"]) // カスケードフォントを配列で指定 let mixedFontDescriptor = fontDescriptor.addingAttributes([UIFontDescriptorCascadeListAttribute: [japaneseFont]]) label.font = UIFont(descriptor: mixedFontDescriptor, size: 75)
UIFontDescriptorMatrixAttribute ‣ ֤άϦϑ จࣈ ʹରͯ͠ΞϑΟϯม $("⒏OF5SBOTGPSN Λߦ͏ w ֦େɾॖখ w
ճసͳͲ
UIFontDescriptorMatrixAttribute let scale = CGAffineTransform(scaleX: 1.0, y: 2.0) let fontDescriptor
= UIFontDescriptor(name: ".SFUIDisplay", matrix: scale) label.font = UIFont(descriptor: fontDescriptor, size: 75)
UIFontDescriptorMatrixAttribute let rotate = CGAffineTransform(rotationAngle: CGFloat(M_PI * 15.0 / 180.0))
let fontDescriptor = UIFontDescriptor(name: ".SFUIDisplay", matrix: rotate) label2.font = UIFont(descriptor: fontDescriptor, size: 75)
ͦͷଞ UIFontDescriptor Attributes ‣ 6*'POU%FTDSJQUPS5SBJUT"UUSJCVUF w ΣΠτଐੑઢͷ෯ɺࣼମͷ֯ͳͲͷϑΥϯτಛੑ ‣ 6*'POU%FTDSJQUPS'JYFE"EWBODF"UUSJCVUF w
ࣈૹΓ "EWBODF ͷΛࢦఆ w ࣈؒ/4"UUSJCVUFE4USJOHͷ/4,FSO"UUSJCVUF/BNFͰࢦఆ
ϑΥϯτΛཧղͯ͠ σβΠφʔͱԁͳίϛϡχέʔγϣϯΛ
Thank you IUUQTXXXOBTBHPWNJTTJPO@QBHFT/11OFXTFBSUIBUOJHIUIUNM