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.6k
フォントの基本とUIFont/UIFontDescriptor
デザイナーとのコミュニケーションに必須なフォントの基本と
iOSの開発に用いられるUIFontと更に柔軟にフォントを扱えるUIFontDescriptorについて #potatotips36
satoshin21
January 14, 2017
Tweet
Share
More Decks by satoshin21
See All by satoshin21
少数精鋭で戦うための技術的改善について
satoshin21
3
1.2k
GTXiLibで小さく始めるAccessibility Testing
satoshin21
0
5k
iPhoneのカメラで写真撮影から現像までの技術を紐解く
satoshin21
4
3.3k
try! swift-sh
satoshin21
2
910
Reduxを取り入れて開発はpairs開発はどう変わったか
satoshin21
0
350
レガシーなアプリケーションの 60fps化を目指す為にやっていること
satoshin21
12
3.8k
Introducing CodeLayout with Tips
satoshin21
6
1.6k
World of No Interface Builder
satoshin21
0
1.8k
What I've done to attend WWDC
satoshin21
0
100
Other Decks in Programming
See All in Programming
密集、ドキュメントのコロケーション with AWS Lambda
satoshi256kbyte
0
170
“あなた” の開発を支援する AI エージェント Bedrock Engineer / introducing-bedrock-engineer
gawa
11
1.8k
TokyoR116_BeginnersSession1_環境構築
kotatyamtema
0
110
iOSエンジニアから始める visionOS アプリ開発
nao_randd
3
120
Flutter × Firebase Genkit で加速する生成 AI アプリ開発
coborinai
0
150
AHC041解説
terryu16
0
590
Open source software: how to live long and go far
gaelvaroquaux
0
620
Immutable ActiveRecord
megane42
0
130
テストをしないQAエンジニアは何をしているか?
nealle
0
130
社内フレームワークとその依存性解決 / in-house framework and its dependency management
vvakame
1
550
Introduction to kotlinx.rpc
arawn
0
630
Djangoアプリケーション 運用のリアル 〜問題発生から可視化、最適化への道〜 #pyconshizu
kashewnuts
1
230
Featured
See All Featured
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.2k
BBQ
matthewcrist
86
9.5k
Optimising Largest Contentful Paint
csswizardry
34
3.1k
The Cult of Friendly URLs
andyhume
78
6.2k
Typedesign – Prime Four
hannesfritz
40
2.5k
Become a Pro
speakerdeck
PRO
26
5.1k
A designer walks into a library…
pauljervisheath
205
24k
Side Projects
sachag
452
42k
Into the Great Unknown - MozCon
thekraken
35
1.6k
Code Review Best Practice
trishagee
66
17k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
Building Flexible Design Systems
yeseniaperezcruz
328
38k
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