Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
フォントの基本とUIFont/UIFontDescriptor
satoshin21
January 14, 2017
Programming
12
2.9k
フォントの基本とUIFont/UIFontDescriptor
デザイナーとのコミュニケーションに必須なフォントの基本と
iOSの開発に用いられるUIFontと更に柔軟にフォントを扱えるUIFontDescriptorについて #potatotips36
satoshin21
January 14, 2017
Tweet
Share
More Decks by satoshin21
See All by satoshin21
少数精鋭で戦うための技術的改善について
satoshin21
3
680
GTXiLibで小さく始めるAccessibility Testing
satoshin21
0
4.3k
iPhoneのカメラで写真撮影から現像までの技術を紐解く
satoshin21
5
2.2k
try! swift-sh
satoshin21
2
610
Reduxを取り入れて開発はpairs開発はどう変わったか
satoshin21
0
300
レガシーなアプリケーションの 60fps化を目指す為にやっていること
satoshin21
13
3.2k
Introducing CodeLayout with Tips
satoshin21
6
1.3k
World of No Interface Builder
satoshin21
0
1.4k
What I've done to attend WWDC
satoshin21
0
64
Other Decks in Programming
See All in Programming
レガシーフレームワークからの移行
ug
0
120
AWSにおける標的型Bot対策
hacomono
0
410
2023年にクル(かもしれない)通信ミドルウェア技術(仮)
s_hosoai
0
200
Cloudflare WorkersでGoを動かすライブラリを作っている話
syumai
1
320
Enumを自動で網羅的にテストしてみた
estie
0
1.3k
フロントエンドで 良いコードを書くために
t_keshi
3
1.6k
量子コンピュータ時代のプログラミングセミナー / 20221222_Amplify_seminar _route_optimization
fixstars
0
250
ECS Service Connectでマイクロサービスを繋いでみた
xblood
0
540
OSSから学んだPR Descriptionの書き方
fugakkbn
4
130
Swift Observation
shiz
3
290
データドリブンな組織の不正検知
fkubota
0
210
CDKでValidationする本当の方法 / cdk-validation
gotok365
1
200
Featured
See All Featured
GraphQLの誤解/rethinking-graphql
sonatard
39
7.8k
Building an army of robots
kneath
301
40k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
31
20k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
217
21k
Imperfection Machines: The Place of Print at Facebook
scottboms
254
12k
Fontdeck: Realign not Redesign
paulrobertlloyd
74
4.3k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
6
840
Designing with Data
zakiwarfel
91
4.2k
Become a Pro
speakerdeck
PRO
6
3.2k
Into the Great Unknown - MozCon
thekraken
2
290
Music & Morning Musume
bryan
37
4.6k
Visualization
eitanlees
128
12k
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 IUUQTXXXOBTBHPW
[email protected]
/11OFXTFBSUIBUOJHIUIUNM