Now supporting Dark Mode on LINE messenger

Hitomi Komata (S_Shimotori)
LINE LINE iOS Team Software Engineer
https://linedevday.linecorp.com/jp/2019/sessions/S2-5

Transcript

1. 2019 DevDay
   Now Supporting Dark Mode on
   LINE Messenger
   > Hitomi Komata (S_Shimotori)
   > LINE LINE iOS Team Software Engineer
   

   View Slide

2. Dark Mode feature is coming soon!
   

   View Slide

3. Agenda > What is Dark Mode for “LINE”?
   > Way to support Dark Mode
   > Future tasks
   

   View Slide

4. What is Dark Mode

   for “LINE”?
   

   View Slide

5. > Saving battery on OLED display
   > Less eye strain
   Dark Mode on iOS13
   

   View Slide

6. LINE Theme “ண͔ͤ͑”
   “Black” & “Cony”
   

   View Slide

7. What is Dark Mode for “LINE”?
   > A feature to change light or dark as you like
   > A burden on LINE’s multiple projects and technical debt
   CONFLICT: Merge conflict in Theme system.
   

   View Slide

8. Way to support Dark Mode
   

   View Slide

9. Legacy colors in “LINE”
   

   View Slide

10. LDS semantic colors
    by LINE DESIGN SYSTEM
    primaryText #111111 / #FFFFFF
    secondaryText #555555 / #B7B7B7
    

    View Slide

11. hardcoded

    static UIColor
    dynamic UIColor
    Color flow in “LINE”
    Theme

    setting file
    static UIColor
    LINE

    semantic color
    Force light mode
    temporarily
    

    View Slide

12. iOS view hierarchy
    UINavigationController + modal transition
    UIWindow UITransitionView
    UINavigation

    Controller
    UIView

    Controller
    UITransitionView
    UIView

    Controller
    UINavigation

    Bar
    

    View Slide

13. Fix for new methods in iOS 13
    > There is overlap between withTintColor(_:) and our tint method.
    > and so on.
    > UISearchBar’s specification is modified in iOS 13.
    

    View Slide

14. Done!
    

    View Slide

15. Future tasks
    

    View Slide

16. Future tasks of LINE Theme
    > Update LINE Theme system and assets for LINE DESIGN SYSTEM
    > Remove hardcoded colors and enable LINE Theme
    

    View Slide

17. Summary
    

    View Slide

18. Summary
    > “LINE” supports Dark Mode feature,

    however some views are still forced in light mode in the first release.
    > LINE Theme continues to be updated!
    > Dark Mode feature is a part of Theme system in “LINE”.
    

    View Slide

19. Thank You
    

    View Slide