Handling rich text in Swift

Transcript

1. Handling rich text in Swift iOSDC Japan 2016 Katsumi Kishikawa

   kk@realm.io

2. Katsumi Kishikawa Realm Inc. kk@realm.io

3. kk@realm.io

4. kk@realm.io

5. kk@realm.io

6. kk@realm.io

7. Agenda ˖ J04ךذؗأزٖ؎،ؐزחאְג
   ˖ ة؎هؚٓؿ؍ך㛇燉
   ˖ 5FYU,JUך㛇燉ה䘔欽 kk@realm.io

8. iOS 7Ҏ߱ͷςΩετϨΠΞ΢τ kk@realm.io

9. TextKit kk@realm.io

10. TextKitͱ͸ ˖ 넝鸞זٌتٝذؗأزٖ؎،ؐز٥ٖٝت ؚٔٝؒٝآٝ
    ˖ $PSF5FYUד⡲׵׸גְ׷
    ˖ 6*,JUהך窟さ kk@realm.io https://developer.apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/CustomTextProcessing/CustomTextProcessing.html

11. UILabel kk@realm.io

12. kk@realm.io UILabelΛී௨ʹ࢖͏

13. kk@realm.io ώϥΪϊͱγεςϜϑΥϯτ UIFont(name: "HiraginoSans-W3", size: 32) UIFont.systemFontOfSize(32)

14. kk@realm.io ώϥΪϊͱγεςϜϑΥϯτ

15. kk@realm.io ώϥΪϊͱγεςϜϑΥϯτ

16. kk@realm.io General Header

17. kk@realm.io ΞϧϑΝϕοτΛؚ·ͳ͍৔߹

18. ߦͷߴ͞͸ԿͰܾ·Δ͔ kk@realm.io

19. kk@realm.io Font metrics https://developer.apple.com/library/mac/documentation/TextFonts/Conceptual/CocoaTextArchitecture/FontHandling/FontHandling.html

20. kk@realm.io Font metrics https://developer.apple.com/library/mac/documentation/TextFonts/Conceptual/CocoaTextArchitecture/FontHandling/FontHandling.html

21. kk@realm.io Font metrics

22. kk@realm.io Font metrics Baseline X-Height Cap height Ascent Descent

23. kk@realm.io ώϥΪϊ͸ಛघͳϝτϦΫεΛ࣋ͭ

24. kk@realm.io ʢࢀߟʣNoto Sans CJK JP

25. let label = UILabel(frame: view.bounds) label.backgroundColor = ... label.textColor =

    ... label.font = ... label.text = text ... label.sizeToFit() label.frame.size.height += ceil(abs(label.font.descender * 2)) kk@realm.io ্ԼʹDescentΛิ͏

26. kk@realm.io ্ԼʹDescentΛิ͏

27. kk@realm.io ্ԼʹDescentΛิ͏

28. kk@realm.io ΦϦδφϧͱൺֱ

29. • ώϥΪϊΛ໌ࣔతʹࢦఆ͠ͳ͍ • γεςϜϑΥϯτΛ࢖͏ • σβΠϯࢦࣔॻͳͲͰɺώϥΪϊ͸͍͍ͨͯγε ςϜϑΥϯτΛҙਤ͍ͯ͠Δ͸ͣ • தࠃޠ༻ϑΥϯτʹϑΥʔϧόοΫͨ͘͠ͳ͍Մ ೳੑ

    • ώϥΪϊΛࢦఆ͢Δ৔߹ɺΞϧϑΝϕοτʹؾΛ ͚ͭΔ kk@realm.io ώϥΪϊͷϝτϦΫεʹ஫ҙ

30. kk@realm.io Tips: ೔ຊޠϑΥϯτʹϑΥʔϧόοΫͤ͞Δ let attributes = [ NSFontAttributeName: font, kCTLanguageAttributeName

    as String: "ja", ... ]

31. αΠζͷܭࢉ kk@realm.io

32. let size = CGSize(width: label.bounds.width, height: CGFloat.max) let boundingRect =

    NSString(string: text).boundingRectWithSize(size, options: [.UsesLineFragmentOrigin], attributes: [NSFontAttributeName: font], context: nil) kk@realm.io ඳըαΠζΛಘΔ

33. kk@realm.io ඳըαΠζΛಘΔ

34. UITextView kk@realm.io

35. kk@realm.io UITextViewΛී௨ʹ࢖͏

36. kk@realm.io UITextViewΛී௨ʹ࢖͏ UIFont(name: "HiraginoSans-W3", size: 32) UIFont.systemFontOfSize(32)

37. kk@realm.io ඳըαΠζ

38. kk@realm.io ඳըαΠζ

39. kk@realm.io σϑΥϧτͷϚʔδϯ

40. σϑΥϧτͷϚʔδϯ textView.textContainer.lineFragmentPadding textView.textContainerInset UIEdgeInsets(top: 8.0, left: 0.0, bottom: 8.0, right:

    0.0) 5.0 kk@realm.io

41. kk@realm.io ώϥΪϊΛࢦఆͨ͠৔߹ font.leading

42. σϑΥϧτͷελΠϧΛϦηοτ͢Δ kk@realm.io

43. let textView = UITextView(frame: view.bounds) ... textView.textContainerInset = UIEdgeInsetsZero textView.sizeToFit()

    kk@realm.io textContainerInsetΛऔΓআ͘

44. let textView = UITextView(frame: view.bounds) ... textView.textContainerInset = UIEdgeInsetsZero textView.sizeToFit()

    kk@realm.io textContainerInsetΛऔΓআ͘

45. kk@realm.io textContainerInsetΛऔΓআ͘

46. let textView = UITextView(frame: view.bounds) ... textView.textContainer.lineFragmentPadding = 0 textView.sizeToFit()

    kk@realm.io lineFragmentPaddingΛऔΓআ͘

47. let textView = UITextView(frame: view.bounds) ... textView.textContainer.lineFragmentPadding = 0 textView.sizeToFit()

    kk@realm.io lineFragmentPaddingΛऔΓআ͘

48. kk@realm.io lineFragmentPaddingΛऔΓআ͘

49. let size = CGSize(width: textView.bounds.width, height: CGFloat.max) let boundingRect =

    NSString(string: text).boundingRectWithSize(size, options: [.UsesLineFragmentOrigin], attributes: [NSFontAttributeName: font], context: nil) kk@realm.io ඳըαΠζΛಘΔ

50. kk@realm.io ඳըαΠζΛಘΔ

51. let textView = UITextView(frame: view.bounds) ... textView.layoutManager.usesFontLeading = false textView.sizeToFit()

    kk@realm.io font.leadingΛऔΓআ͘

52. let textView = UITextView(frame: view.bounds) ... textView.layoutManager.usesFontLeading = false textView.sizeToFit()

    kk@realm.io font.leadingΛऔΓআ͘

53. kk@realm.io font.leadingΛऔΓআ͘

54. let size = CGSize(width: textView.bounds.width, height: CGFloat.max) let boundingRect =

    NSString(string: text).boundingRectWithSize(size, options: [.UsesLineFragmentOrigin, .UsesFontLeading], attributes: [NSFontAttributeName: font], context: nil) kk@realm.io ʢผղʣfont.leadingΛؚΊͯܭࢉ͢Δ

55. kk@realm.io ʢผղʣfont.leadingΛؚΊͯܭࢉ͢Δ

56. kk@realm.io ʢผղʣfont.leadingΛؚΊͯܭࢉ͢Δ

57. kk@realm.io textView.textContainerInset = UIEdgeInsetsZero textView.textContainer.lineFragmentPadding = 0 textView.layoutManager.usesFontLeading = false

    σϑΥϧτελΠϧͷϦηοτ

58. ͞·͟·ͳελΠϧʹରԠ͢Δ kk@realm.io

59. kk@realm.io ߦؒͷมߋ

60. NSAttributedString kk@realm.io

61. NSParagraphStyle kk@realm.io

62. let paragraphStyle = NSMutableParagraphStyle() paragraphStyle.minimumLineHeight = ceil(font.lineHeight) paragraphStyle.maximumLineHeight = ceil(font.lineHeight)

    paragraphStyle.lineSpacing = 8 let attributes = [ NSFontAttributeName: font, NSForegroundColorAttributeName: UIColor(...), NSParagraphStyleAttributeName: paragraphStyle, ] let attributedText = NSAttributedString(string: text, attributes: attributes) textView.attributedText = attributedText kk@realm.io NSAttributedString

63. let paragraphStyle = NSMutableParagraphStyle() paragraphStyle.minimumLineHeight = ceil(font.lineHeight) paragraphStyle.maximumLineHeight = ceil(font.lineHeight)

    paragraphStyle.lineSpacing = 8 let attributes = [ NSFontAttributeName: font, NSForegroundColorAttributeName: UIColor(...), NSParagraphStyleAttributeName: paragraphStyle, ] let attributedText = NSAttributedString(string: text, attributes: attributes) textView.attributedText = attributedText kk@realm.io NSAttributedString

64. kk@realm.io ߦؒͷมߋ

65. kk@realm.io ߦؒͷมߋ

66. let paragraphStyle = NSMutableParagraphStyle() paragraphStyle.minimumLineHeight = ceil(font.lineHeight) paragraphStyle.maximumLineHeight = ceil(font.lineHeight)

    paragraphStyle.lineSpacing = 8 kk@realm.io min/maxLineHeight

67. kk@realm.io min/maxLineHeight

68. kk@realm.io minimumLineHeight

69. kk@realm.io maximumLineHeight

70. NSAttributedStringΛ׆༻͢Δ kk@realm.io

71. kk@realm.io ͞ΒʹߦؒΛ޿͘

72. kk@realm.io ͞ΒʹߦؒΛ޿͘

73. kk@realm.io Օ৚ॻ͖

74. ·ͱΊ • iOS 7Ҏ߱ͷςΩετϨΠΞ΢τ͸ɺ͍͔ʹ ΩϨΠͳNSAttributedStringΛ࡞Δ͔ • λΠϙάϥϑΟͷجૅΛ஌Ζ͏ • ϑΥϯτʹώϥΪϊΛࢦఆ͢Δͱ͖͸஫ҙ •

    Ͱ͖Δ͚ͩγεςϜϑΥϯτΛ࢖͓͏ kk@realm.io

75. Questions? Katsuma Kishikawa kk@realm.io www.realm.io/jp @k_katsumi