フォントの基本とUIFont/UIFontDescriptor

Slide 1

Slide 1 text

ϑΥϯτͷجຊͱ UIFont/UIFontDescriptor @SatoshiN21

Slide 2

Slide 2 text

satoshin21 SatoshiN21 ௕ࡔ ޛࢤ (Nagasaka Satoshi) - iOS Engineer of pairs Div. eureka, Inc. - Swift, Objective-C, Java(Android), Apple Script

Slide 3

Slide 3 text

- pairs - Couples

Slide 4

Slide 4 text

class UIFont

Slide 5

Slide 5 text

ϑΥϯτ/ॻମ ‣ ϑΥϯτ㲈ॻମ w ॻମ͸ʮ͋ΔҰ؏ͨ͠σβΠϯํ਑Ͱ࡞ΒΕͨจࣈͷू·Γʯ w ૊൛ͱ΋ w ϑΥϯτ͸ͦΕΛදݱ͢Δखஈɺ΋͘͠͸Ұଗ͍ͷσʔλ

Slide 6

Slide 6 text

UIFont ‣ 6*'POU͕͍࣋ͬͯΔ৘ใ w /BNF GPOU/BNF GBNJMZ/BNF w QPJOU4J[F w )FJHIUܥ MJOF)FJHIU MFBEJOH DBQ)FJHIU w CBTFMJOFܥ

Slide 7

Slide 7 text

baseline CBTFMJOF YIFJHIU DBQTIFJHIU "TDFOEFS %FTDFOEFS

Slide 8

Slide 8 text

baseline CBTFMJOF YIFJHIU DBQTIFJHIU "TDFOEFS %FTDFOEFS ‣ CBTFMJOFΛى఺ʹͯ͠ԤจϑΥϯτ͸ϨΠΞ΢τ͞ΕΔ ‣ BTDFOEFS w CBTFMJOF͔Β্෦ͷڑ཭ ‣ EFTDFOEFS w CBTFMJOF͔ΒԼ෦ͷڑ཭ ෛ਺ ‣ MFBEJOH w GPOUͷ࣋ͭߦؒ஋ w MFBEJOHͷͳ͍ϑΥϯτ΋ γεςϜϑΥϯτͳͲ

Slide 9

Slide 9 text

// San Francisco(.SFUIText) let font = UIFont.systemFont(ofSize: 12) let height = abs(font.descender) + font.ascender + font.leading font.lineHeight == height // true font.lineHeight

Slide 10

Slide 10 text

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

Slide 11

Slide 11 text

AutoLayout firstBaseline // first baselineを揃える minLabel.firstBaselineAnchor .constraint(equalTo: largeLabel.firstBaselineAnchor).isActive = true

Slide 12

Slide 12 text

AutoLayout lastBaseline // last baselineを揃える minLabel.lastBaselineAnchor.constraint(equalTo : largeLabel.lastBaselineAnchor).isActive = true

Slide 13

Slide 13 text

ϑΥϯτʹҰखؒՃ͍͑ͨɾɾ

Slide 14

Slide 14 text

class UIFontDescriptor

Slide 15

Slide 15 text

UIFontDescriptorͱ͸ ‣ ༷ʑͳϑΥϯτ৘ใΛऔಘ͢Δ͜ͱ͕Մೳ w ΢ΣΠτɺΧεέʔυϑΥϯτɺελΠϧ ࣼମͷ֯౓౳ ‣ ্هͷ஋Λมߋɺ௥Ճ͢Δ͜ͱ͕Մೳ

Slide 16

Slide 16 text

UIFontDescriptorCascadeListAttribute ‣ ΧεέʔυϑΥϯτΛ഑ྻͰࢦఆ ‣ ೔ຊޠͷ৔߹͸͜ͷϑΥϯτͰද͍ࣔͨ͠ͱ͍͏࣌ͳͲʹ׆༻

Slide 17

Slide 17 text

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)

Slide 18

Slide 18 text

UIFontDescriptorMatrixAttribute ‣ ֤άϦϑ จࣈ ʹରͯ͠ΞϑΟϯม׵ $("⒏OF5SBOTGPSN Λߦ͏ w ֦େɾॖখ w ճసͳͲ

Slide 19

Slide 19 text

UIFontDescriptorMatrixAttribute let scale = CGAffineTransform(scaleX: 1.0, y: 2.0) let fontDescriptor = UIFontDescriptor(name: ".SFUIDisplay", matrix: scale) label.font = UIFont(descriptor: fontDescriptor, size: 75)

Slide 20

Slide 20 text

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)

Slide 21

Slide 21 text

ͦͷଞ UIFontDescriptor Attributes ‣ 6*'POU%FTDSJQUPS5SBJUT"UUSJCVUF w ΢ΣΠτଐੑ΍ઢͷ෯ɺࣼମͷ֯౓ͳͲͷϑΥϯτಛੑ ‣ 6*'POU%FTDSJQUPS'JYFE"EWBODF"UUSJCVUF w ࣈૹΓ "EWBODF ͷ஋Λࢦఆ w ࣈؒ͸/4"UUSJCVUFE4USJOHͷ/4,FSO"UUSJCVUF/BNFͰࢦఆ