Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Handling rich text in Swift

Handling rich text in Swift

Handling rich text
in Swift
iOSDC Japan 2016

Kishikawa Katsumi

August 20, 2016
Tweet

More Decks by Kishikawa Katsumi

Other Decks in Programming

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