Add dark mode to your apps in iOS 13 #wwdc19 #timers_meetup

249b3122eee454c0a818bfe7851418e4?s=47 fromkk
June 18, 2019

Add dark mode to your apps in iOS 13 #wwdc19 #timers_meetup

Timersで開催されたTimers Meetup #2 WWDC After Partyで発表した内容です。
Dark Modeに対応する為に必要な知識を発表しました。

249b3122eee454c0a818bfe7851418e4?s=128

fromkk

June 18, 2019
Tweet

Transcript

  1. "EEEBSLNPEFUPZPVSBQQT
 JOJ04 5JNFST.FFUVQd88%$"GUFS1BSUZd *NQMFNFOUJOH%BSL.PEFPOJ04 

  2. 1SPpMF struct Profile { let name = "Kazuya Ueoka" let

    twitter = "@fromkk" let github = "fromkk" let qiita = "fromkk" let company = "Timers Inc." } • 2
  3. %BSLNPEF ❓

  4. %BSLNPEF

  5. None
  6. )PXUPJNQMFNFOUT

  7. 04͕༻ҙͨ͠৭Λར༻ open class var systemIndigo: UIColor { get }
 open

    class var systemGray2: UIColor { get }
 open class var systemGray3: UIColor { get }
 open class var systemGray4: UIColor { get }
 open class var systemGray5: UIColor { get }
 open class var systemGray6: UIColor { get }
 open class var label: UIColor { get }
 open class var secondaryLabel: UIColor { get }
 open class var tertiaryLabel: UIColor { get }
 open class var quaternaryLabel: UIColor { get }
 open class var link: UIColor { get }
 open class var placeholderText: UIColor { get }
 open class var separator: UIColor { get }
 open class var opaqueSeparator: UIColor { get }
 open class var systemBackground: UIColor { get }
 open class var secondarySystemBackground: UIColor { get }
 open class var tertiarySystemBackground: UIColor { get }
 open class var systemGroupedBackground: UIColor { get }
 open class var secondarySystemGroupedBackground: UIColor { get }
 open class var tertiarySystemGroupedBackground: UIColor { get }
 open class var systemFill: UIColor { get }
 open class var secondarySystemFill: UIColor { get }
 open class var tertiarySystemFill: UIColor { get }
 open class var quaternarySystemFill: UIColor { get } ˞J04Ͱ૿͑ͨ৭ͷҰཡͳͷͰશ͕ͯ%BSLNPEFରԠ͔Ͳ͏͔͸֬ೝ͍ͯ͠·ͤΜ
  8. "TTFUT w $PMPS*NBHFBTTFUTʹ%BSL "QQFBSBODF͕௥Ճ /%"ʹ഑ྀͷҝࣗॗ

  9. *#্Ͱը૾ͷ৭มߋ w *NBHF"TTFUͷ3FOEFS"TΛ5FNQMBUF *NBHFʹઃఆ w *#ଆͰը૾ͷ5JOUDPMPSΛઃఆ 5JQT

  10. *NQMFNFOUTXJUIDPEF w USBJU$PMMFDUJPOͷVTFS*OUFSGBDF4UZMFϓϩύςΟΛར༻ public enum UIUserInterfaceStyle : Int { case

    unspecified case light case dark } w ΧελϜ%ZOBNJD$PMPSΛ࡞੒ let dynamicColor = UIColor { traitCollection -> UIColor in switch traitCollection.userInterfaceStyle { case .dark: return .red default: return .blue } }
 
 etc…
  11. *NQMFNFOUTXJUIDPEF w ໌ࣔతʹϋϯυϦϯά let dynamicColor = UIColor.systemBackground let traitCollection =

    view.traitCollection let resolvedColor = dynamicColor.resolvedColor(with: traitCollection)
 let resolvedImage = image.imageAsset?.image(with: traitCollection) w ΠϕϯτϋϯυϦϯά *NQMFNFOUJOH%BSL.PEFPOJ04  ΑΓҾ༻
  12. %BSLNPEFͷมߋํ๏ var overrideUserInterfaceStyle: UIUserInterfaceStyle ը໘ຖʹઃఆ
 6*7JFX 6*7JFX$POUSPMMFS UIUserInterfaceStyle: Light or

    Dark ΞϓϦશମΛઃఆ
 *OGPQMJTU
  13. ஫ҙࣄ߲ w 6*"DUJWJUZ*OEJDBUPS4UZMFͷHSBZXIJUFXIJUF-BSHF͕EFQSFDBUFE
 NFEJVNͱMBSHF͕৽ઃ ৭͸DPMPSϓϩύςΟʹઃఆग़དྷΔ  w 6*4UBUVT#BS΍εΫϩʔϧόʔͷ৭͕ϞʔυʹΑͬͯมߋ͞ΕΔࣄ͕͋Δ w Ө͕࢖͑ͳ͍

    ͱ͍͏͔ҙຯΛͳ͞ͳ͍ ͷͰ৭ͰϨΠϠʔΛදݱ͢Δඞཁ ͕͋Δ
  14. ஍ࠈ͸͔͜͜Β

  15. ຊ౰ͷ஍ࠈ

  16. ຊ౰ͷ஍ࠈ

  17. ຊ౰ͷ஍ࠈ *#Ͱ৭Λ௚઀ࢦఆ

  18. ຊ౰ͷ஍ࠈ *#Ͱ৭Λ௚઀ࢦఆ view.backgroundColor = .white ίʔυͰ৭Λ௚઀ࢦఆ

  19. ຊ౰ͷ஍ࠈ *#Ͱ৭Λ௚઀ࢦఆ view.backgroundColor = .white ίʔυͰ৭Λ௚઀ࢦఆ എܠ͕നΛલఏͱͨ͠ը૾ୡ

  20. ·ͱΊ w ͳΔ΂͘%BSLNPEFʹ͸ରԠ͍͖͍ͯͨ͠ॴଘ w *#΍ίʔυͰ৭Λ௚઀ࢦఆ͍ͯ͠ΔՕॴ͕͋Ε͹ࠓͷ͏ͪʹ$PMPS"TTFU Խ͓͖͍ͯͨ͠ w ໨΍όοςϦʔʹ༏͘͠ͳΖ͏

  21. 13

  22. • αʔόʔαΠυΤϯδχΞ (PHP, Golang, AWS) • AndroidΤϯδχΞ (Kotlin) • iOSΤϯδχΞ

    (Swift) TimersͰ͸ݱࡏΤϯδχΞશ৬छ࠾༻தʂ
 ৄ͘͠͸”Timers”Ͱݕࡧ
  23. 5IBOLZPV& ϕʔλ൛ͷ಺༰ʹ͸มߋ͕ՃΘΔՄೳੑ͕͋Γ·͢ɻ
 ਖ਼֬ੑͷ୲อ͸ग़དྷͳ͍ࢫΛྃ͝ঝ͍ͩ͘͞ɻ