SF Symbols

SF Symbols

参加してなくてもついていけるもん!WWDCゴリゴリキャッチアップ会 での発表資料です。
https://wwdc-gorilla.connpass.com/event/132144/

一部のスクショは NDA 違反しないように発表時のものから差し替えてますが、内容に影響はしないです。
(Xcode の画面のスクショを公開されているものを引用するように変更してます)

6a55a7fb19c1fa78e86ddca7a69db088?s=128

Yuka Ezura

June 17, 2019
Tweet

Transcript

  1. 4'4ZNCPMT  F[VSB

  2. ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED 4'4ZNCPMT

  3. w 4'4ZNCPMTͷ֓ཁɾίϯηϓτ w 4'4ZNCPMTΛ༻͍࣮ͨ૷ w ࢖͍ํͱ஫ҙࣄ߲ w ͜Ε͔ΒͷσβΠϯࢦఆ w ΧελϜTZNCPM

    ͕࣌ؒ͋Ε͹ 4'4ZNCPMT
  4. w 4ZNCPMͷηοτ w  ݸҎ্"QQMF͕ఏڙ͍ͯ͠Δ w ϑΥʔϚοτ47( w ࣗ࡞΋Մೳ w

    ରԠ04 w J04BOEMBUFS w XBUDI04BOEMBUFS w UW04BOEMBUFS ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED 4'4ZNCPMT QFSTPOpMM TDJTTPST
  5. 4ZNCPMͷҰཡ IUUQTEFWFMPQFSBQQMFDPNEFTJHO ͔͜͜Βμ΢ϯϩʔυ

  6. 4'4ZNCPMTBQQ

  7. w 4ZNCPMͷηοτ w  ݸҎ্"QQMF͕ఏڙ͍ͯ͠Δ w ϑΥʔϚοτ47( w ࣗ࡞΋Մೳ w

    ରԠ04 w J04BOEMBUFS w XBUDI04BOEMBUFS w UW04BOEMBUFS ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED 4'4ZNCPMT QFSTPOpMM TDJTTPST
  8. )PXUPVTF let image = UIImage(systemName: "person.fill") 4ZNCPMͷ໊લ imageView.image = image

  9. )PXUPVTF ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED *#͔Β΋ઃఆͰ͖Δ

  10. ඪ४Ͱఏڙ͞Ε͍ͯΔը૾ͷηοτ͕௥Ճ͞Ε͚ͨͩʁ

  11. w 4''POUͱ਌࿨ੑͷߴ͍ઃܭ w 47( ϕΫλܗࣜ  w දࣔʹؔ܎͢Δύϥϝʔλ w QPJOUT

    w XFJHIU w TDBMF ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED 4'4ZNCPMT UIImageView
 (Symbol) UILabel Baseline
  12. w 4'4ZNCPMT͸CBTFMJOFP⒎TFUΛ࣋ͭ
 5FYUͱฒ΂ͯ΋όϥϯεͷྑ͍Ґஔʹදࣔ͞ΕΔ w औಘ
 JNBHFCBTFMJOF0⒎TFU'SPN#PUUPN w ઃఆ
 JNBHFXJUI#BTFMJOF0⒎TFU'SPN#PUUPN 

      w ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED baselineOffsetFromBottom
  13. w 4'4ZNCPMT͸CBTFMJOFP⒎TFUΛ࣋ͭ
 5FYUͱฒ΂ͯ΋όϥϯεͷྑ͍Ґஔʹදࣔ͞ΕΔ w औಘ
 JNBHFCBTFMJOF0⒎TFU'SPN#PUUPN w ઃఆ
 JNBHFXJUI#BTFMJOF0⒎TFU'SPN#PUUPN 

      w ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED baselineOffsetFromBottom
  14. w 4''POUͱ਌࿨ੑͷߴ͍ઃܭ w 47( ϕΫλܗࣜ  w දࣔʹؔ܎͢Δύϥϝʔλ w QPJOUT

    w XFJHIU w TDBMF ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED 4'4ZNCPMT 17 points 17 points Baseline
  15. w 4''POUͱ਌࿨ੑͷߴ͍ઃܭ w 47( ϕΫλܗࣜ  w දࣔʹؔ܎͢Δύϥϝʔλ w QPJOUT

    w XFJHIU w TDBMF ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED 4'4ZNCPMT
  16. ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED

  17. w 4''POUͱ਌࿨ੑͷߴ͍ઃܭ w 47( ϕΫλܗࣜ  w දࣔʹؔ܎͢Δύϥϝʔλ w QPJOUT

    w XFJHIU w TDBMF ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED 4'4ZNCPMT 4DBMF 4NBMM .FEJVN -BSHF
  18. ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED

  19. w 4''POUͱ਌࿨ੑͷߴ͍ઃܭ w 47( ϕΫλܗࣜ  w දࣔʹؔ܎͢Δύϥϝʔλ w QPJOUT

    w XFJHIU w TDBMF ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED 4'4ZNCPMT 4DBMF 4NBMM .FEJVN -BSHF
  20. DBMFOEBSTWH

  21. 3FDBQ w 4''POUͱ਌࿨ੑͷߴ͍ઃܭ w ࣗ࡞΋Մೳ UFNQMBUFΛฤूͯ͠BTTFUDBUBMPHʹೖΕΔ  w CBTFMJOF0⒎TFU'SPN#PUUPNʹΑΔҐஔௐ੔
 w

    දࣔΛܾఆ͢Δύϥϝʔλ w QPJOUT w େ͖͞ ฒ΂Δ5FYUͷGPOUTJ[Fͱಉ͡஋ʹ͢Δͱͪΐ͏Ͳྑ͍αΠζʹͳΔ  w 5FYUͷGPOUTJ[FʹରԠ w 㱠XJEUI IFJHIU w XFJHIU w ଠ͞ w 4''POUͷXFJHIUʹରԠ w TDBMF w େ͖͞ w දࣔྖҬͷେ͖͞΍4ZNCPMΛͲͷ͘Β͍ڧௐ͍͔ͨ͠Ͱܾఆ
  22. 4'4ZNCPMTΛ༻͍࣮ͨ૷

  23. )PXUPVTF "QQMFͷఏڙ͢Δ4ZNCPMͷ໊લ let image = UIImage(systemName: "person.fill") imageView.image = image

  24. )PXUPVTF $VTUPNTZNCPMͷ໊લ let image = UIImage(named: "person.fill") imageView.image = image

  25. )PXUPVTF let image = UIImage(systemName: "person.fill") 4ZNCPMͷ໊લ imageView.image = image

    let headlineConfig = UIImage.SymbolConfiguration(pointSize: 23.0, weight: .medium) imageView.preferredSymbolConfiguration = headlineConfig
  26. )PXUPVTF let image = UIImage(systemName: "person.fill") 4ZNCPMͷ໊લ imageView.image = image

    let headlineConfig = UIImage.SymbolConfiguration(textStyle: .headline) 
 imageView.preferredSymbolConfiguration = headlineConfig
  27. 1SFTFUDPOpH 4DBMF.FEJVN 4DBMF-BSHF

  28. )PXUPVTF ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED

  29. )PXUPVTF
 /4"UUSJCVUFE4USJOH ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED

  30. )PXUPVTF
 /4"UUSJCVUFE4USJOH let image = UIImage(systemName: "person.fill") let attachment =

    NSTextAttachment(image: image) let imageString = NSAttributedString(attachment: attachment) text.insert(imageString, at: 2) let headlineConfig = UIImage.SymbolConfiguration(pointSize: 23.0, weight: .medium) imageView.preferredSymbolConfiguration = headlineConfig
  31. )PXUPVTF
 /4"UUSJCVUFE4USJOH let image = UIImage(systemName: "person.fill") let attachment =

    NSTextAttachment(image: image) let imageString = NSAttributedString(attachment: attachment) text.insert(imageString, at: 2) let headlineConfig = UIImage.SymbolConfiguration(pointSize: 23.0, weight: .medium) imageView.preferredSymbolConfiguration = headlineConfig पғͷGPOUઃఆ͕ద༻͞ΕΔͨΊෆཁ
  32. )PXUPVTF
 /4"UUSJCVUFE4USJOH ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED

  33. )PXUPVTF
 /4"UUSJCVUFE4USJOH ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED image.withTintColor(.redColor)

  34. ͜Ε͔ΒͷσβΠϯࢦఆ

  35. w XJEUI w IFJHIU w MFBEJOH USBJMJOH w WFSUJDBMDFOUFS ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT


    IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED ैདྷͷσβΠϯΨΠυ
  36. w TZNCPMOBNF w TDBMF XFJHIU w QPJOU w XJEUI w

    IFJHIU w MFBEJOH USBJMJOHPS
 NBSHJOGSPNDFOUFS w CBTFMJOF PSWFSUJDBMDFOUFS ը૾Ҿ༻*OUSPEVDJOH4'4ZNCPMT
 IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED ͜Ε͔ΒͷσβΠϯΨΠυ
 GPS4'4ZNCPMT XJEUI IFJHIUͷࢦఆΛ΍ΊΔ TDBMF QPJOUʹΑͬͯ
 େ͖͞Λܾఆ͢Δ
  37. 3FDBQ • UIImage(systemName: String), UIImage(named: String) Ͱ SF Symbols ͔Β

    Image Λ࡞੒ • UIImage.SymbolConfiguration Ͱ scale ౳ͷઃఆΛ࡞੒ w ৔ॴʹΑͬͯɺQSFTFUͷDPOpHVSBUJPO͕ଘࡏ w σβΠϯΨΠυͰ͸TDBMF QPJOUTͰαΠζΛࢦఆ͢Δ w XJEUI IFJHIUͰࢦఆ͠ͳ͍