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

Sansan Androidに おける色の管理 / Color management in Sansan Android

phicdy
March 05, 2019

Sansan Androidに おける色の管理 / Color management in Sansan Android

Sansan Androidに おける色の管理

【増枠】Mobile Engineer Meetup by Sansan https://sansan.connpass.com/event/121319/

phicdy

March 05, 2019
Tweet

More Decks by phicdy

Other Decks in Programming

Transcript

  1. Sansan Androidʹ
    ͓͚Δ৭ͷ؅ཧ
    2019/03/05 (Tue)
    Mobile Engineer Meetup by Sansan
    Keisuke Yamaguchi (@phicdy)

    View full-size slide

  2. ࣗݾ঺հ
    ɾKeisuke Yamaguchi
    ɾ phicdy
    ɾSansan, Inc.
    ɾAndroid application engineer for Sansan
    ɾCoffee / Cat

    View full-size slide

  3. ৭ͷ؅ཧͲ͏ͯ͠·͔͢ʁ

    View full-size slide

  4. AndroidΞϓϦʹ͓͚Δ৭ͷ؅ཧ
    ɾcolors.xml
    ɾstyles.xml
    ɾthemes.xml
    ɾlayout/*.xml
    ɾdrawable/*.xml

    View full-size slide

  5. ҎલͷSansan Androidͷ৭؅ཧ
    colors.xml styles.xml
    themes.xml
    layout/*.xml
    color A
    color B
    color C
    text color A
    component color A
    style A
    theme A
    View A
    color A
    View B
    ɾɾ
    ɾɾ ɾɾ
    ɾɾ ɾɾ ɾɾ

    View full-size slide

  6. ҎલͷSansan Androidͷ৭؅ཧ
    colors.xml styles.xml
    themes.xml
    layout/*.xml
    color A
    color B
    style A
    theme A
    View A
    color A
    View B
    ɾɾ
    ɾɾ ɾɾ
    color C
    text color A
    component color A
    ɾɾ ɾɾ
    ಉ৭ͷఆ͕ٛ͋ΓɺͲΕΛ
    ࢖͑͹͍͍͔ෆ໌
    ఆ͕ٛͳ͍ͱ͖
    Ͳ͏௥Ճ͢Ε͹͍͍͔ෆ໌
    ɾɾ

    View full-size slide

  7. ҎલͷSansan Androidͷ৭؅ཧ
    colors.xml styles.xml
    themes.xml
    layout/*.xml
    color A
    color B
    color C
    text color A
    component color A
    style A
    theme A
    View A
    ɾɾ
    ɾɾ
    ɾɾ ɾɾ ɾɾ
    color A
    View B
    ɾɾ
    ৭Λ௚ࢦఆ͍ͯͯ͠
    มߋ࣌ʹ࿙ΕΔ

    View full-size slide

  8. ҎલͷSansan Androidͷ৭؅ཧ
    colors.xml styles.xml
    themes.xml
    layout/*.xml
    color A
    color B
    color C
    text color A
    component color A
    style A
    theme A
    View A
    color A
    View B
    ɾɾ
    ɾɾ ɾɾ
    ɾɾ ɾɾ ɾɾ
    σβΠφʔͷࢦఆʢΧϥʔίʔυɺঢ়ଶͳͲʣ
    ͔ΒDPMPSTYNMͷOBNFΛ૝૾Ͱ͖ͳ͍

    View full-size slide

  9. ཧ૝
    ɾcolors.xmlʹಉ৭ͷఆ͕ٛͳ͘ɺͲΕΛ࢖͑͹
    ͍͍͔໌֬
    ɾ৽͍͠৭ΛͲ͏௥Ճ͢Δ͔໌֬
    ɾcolors.xmlҎ֎ͷ৭͕ͳ͘มߋ࣌ʹ࿙Ε͕ͳ͍
    ɾσβΠφʔͷࢦఆʢΧϥʔίʔυɺঢ়ଶͳͲʣ
    ͔Βcolors.xmlͷname͕Θ͔Δ

    View full-size slide

  10. ৽ํ਑ΛܾΊΔ
    ɾcolors.xmlΛ୯ͳΔΧϥʔύϨοτͱ͢Δ
    ɾΞϓϦશମʹؔ͢Δ৭ΛthemeͰࢦఆ
    ɾ֤ը໘Ͱ৭Λ࢖͏ͱ͖͸layout͔Βstyleܦ༝Ͱ
    ࢦఆ
    ɾtheme/style/layout͔Βͷ৭ͷ௚ࢦఆΛېࢭ
    ɾ৭Λ௥Ճ͢Δͱ໋໊͖نଇʹै͏

    View full-size slide

  11. ໋໊نଇ
    ෼ྨ ໋໊نଇ ྫ
    ୯৭ <৭> black
    Sansanݻ༗ͷ৭ sansan_<৭>
    sansan_blue
    sansan_passion_red
    ෳ਺ͷೱ͕͋͞Δ৭ <৭>_<Χϥʔίʔυ>
    gray_757575
    gray_bdbdbd
    ಛఆͷঢ়ଶͷΈͰ
    ࢖ΘΕΔ৭
    <৭>_state_<ঢ়ଶ> gray_state_disabled
    ಛఆͷՕॴͷΈͰ
    ࢖ΘΕΔ৭
    <৭>_<࢖༻Օॴ>
    green_company_news
    blue_tag_background

    View full-size slide

  12. վળޙͷSansan Androidͷ৭؅ཧ
    colors.xml styles.xml
    themes.xml
    layout/*.xml
    color A
    color B
    color C
    color Z
    style A
    theme A
    View A
    View B
    ɾɾ
    ɾɾ ɾɾ
    ɾɾ

    View full-size slide

  13. ͦͷଞͷվળ
    ɾΞΠίϯͷvector drawableԽ
    ɾෳ਺ը໘Ͱڞ௨ͷ෦෼ͷstyleԽ
    ɾRipple effectͷڞ௨Խ
    ɾந৅తͳڞ௨ϨΠΞ΢τͷ෼཭
    ɾConstraintLayoutԽ

    View full-size slide

  14. ·ͩ·ͩվળ఺͕͋Δ
    ɾಛఆͷঢ়ଶ/ՕॴͷΈͰ࢖ΘΕΔ৭΋
    <৭>_<Χϥʔίʔυ>Ͱྑ͍ͷͰ͸ʁ
    ɾ1ը໘1ViewͰ͔͠࢖ΘΕͳ͍΋ͷ΋styleʹ
    ੾Γग़͢ʁ
    ɾstyleϑΝΠϧ෼͚Δʁ
    ɾtheme/styleͷ໋໊نଇʁ

    View full-size slide