フォントの基本とUIFont/UIFontDescriptor

Transcript

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

2. satoshin21 SatoshiN21 ௕ࡔ ޛࢤ (Nagasaka Satoshi) - iOS Engineer of

   pairs Div. eureka, Inc. - Swift, Objective-C, Java(Android), Apple Script

3. - pairs - Couples

4. class UIFont

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

6. UIFont ‣ 6*'POU͕͍࣋ͬͯΔ৘ใ
   w /BNF
   GPOU/BNF
   GBNJMZ/BNF
   w QPJOU4J[F
   

   w )FJHIUܥ MJOF)FJHIU
   MFBEJOH
   DBQ)FJHIU
   w CBTFMJOFܥ

7. baseline CBTFMJOF Y
   IFJHIU DBQT
   IFJHIU "TDFOEFS %FTDFOEFS

8. baseline CBTFMJOF Y
   IFJHIU DBQT
   IFJHIU "TDFOEFS %FTDFOEFS ‣ CBTFMJOFΛى఺ʹͯ͠ԤจϑΥϯτ͸ϨΠΞ΢τ͞ΕΔ
   ‣ BTDFOEFS
   

   w CBTFMJOF͔Β্෦ͷڑ཭
   ‣ EFTDFOEFS
   w CBTFMJOF͔ΒԼ෦ͷڑ཭ ෛ਺
   ‣ MFBEJOH
   w GPOUͷ࣋ͭߦؒ஋
   w MFBEJOHͷͳ͍ϑΥϯτ΋ γεςϜϑΥϯτͳͲ

9. // San Francisco(.SFUIText) let font = UIFont.systemFont(ofSize: 12) let height

   = abs(font.descender) + font.ascender + font.leading font.lineHeight == height // true font.lineHeight

10. 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

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

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

13. ϑΥϯτʹҰखؒՃ͍͑ͨɾɾ

14. class UIFontDescriptor

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

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

17. 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)

18. UIFontDescriptorMatrixAttribute ‣ ֤άϦϑ จࣈ ʹରͯ͠ΞϑΟϯม׵ $("⒏OF5SBOTGPSN Λߦ͏
    w ֦େɾॖখ
    w

    ճస
    ͳͲ

19. UIFontDescriptorMatrixAttribute let scale = CGAffineTransform(scaleX: 1.0, y: 2.0) let fontDescriptor

    = UIFontDescriptor(name: ".SFUIDisplay", matrix: scale) label.font = UIFont(descriptor: fontDescriptor, size: 75)

20. 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)

21. ͦͷଞ UIFontDescriptor Attributes ‣ 6*'POU%FTDSJQUPS5SBJUT"UUSJCVUF
    w ΢ΣΠτଐੑ΍ઢͷ෯ɺࣼମͷ֯౓ͳͲͷϑΥϯτಛੑ
    ‣ 6*'POU%FTDSJQUPS'JYFE"EWBODF"UUSJCVUF
    w

    ࣈૹΓ "EWBODF ͷ஋Λࢦఆ
    w ࣈؒ͸/4"UUSJCVUFE4USJOHͷ/4,FSO"UUSJCVUF/BNFͰࢦఆ
    

22. ϑΥϯτΛཧղͯ͠ σβΠφʔͱԁ׈ͳίϛϡχέʔγϣϯΛ

23. Thank you IUUQTXXXOBTBHPWNJTTJPO@QBHFT/11OFXTFBSUIBUOJHIUIUNM