Color Blending on Android(JP)

Sometimes you would like to blend two colors into one, dynamically; for example as ViewPager gets scrolled, you want one color to dynamically change to the other color smoothly.

In this case, ColorUtils would be helpful.

In this talk I talked about how I used ColorUtis to achieve the desired UI by giving example of the implementation detail for Torte application.

See also:
ColorUtils | Android Developers
https://developer.android.com/reference/android/support/v4/graphics/ColorUtils.html

shaunkawano/android-color-blending-sample: Sample Android application demonstrating how color blending can be achieved on Android
https://github.com/shaunkawano/android-color-blending-sample

Transcript

1. Color Blending on Android shaunkawano
3. w ϓϩϑΟʔϧը૾ʴ࠷େຕΞϧόϜը૾
   w 7JFX1BHFSͰදࣔ͠ɺԣϑϦοΫͰ͘͘͞͞ݟ ΕΔ
   w ̍ຕ໨͔Β̎ຕ໨ʹભҠ͢ΔࡍʹϢʔβʔΞΠίϯ ΛҾ͖৳͹͠ϒϥʔΛ͔͚ͯഎܠͱͯ͠දࣔ ͜Μͳ6*࡞Γ͍ͨʂ
7. ςΩετʴϒϥʔ໰୊ ৭͕ॏͳͬͯ͠·͏໰୊ʹจࣈ͕ಡΈʹ͍͘
   ղܾࡦ
   w ࠇςΩετͷԼʹനγϟυʔΛৗઃ
   w നςΩετͷԼʹࠇγϟυʔΛஔ͘ʢ"DUJWJUZࣗ ମ͸നഎܠͳͷͰςΩετΧϥʔಈతʹม͍͑ͨ
   w ϒϥʔ΍ΊΔʂʂ
8. ςΩετʴϒϥʔ໰୊ ৭͕ॏͳͬͯ͠·͏໰୊ʹจࣈ͕ಡΈʹ͍͘
   ղܾࡦ
   w ࠇςΩετͷԼʹനγϟυʔΛৗઃ
   w നςΩετͷԼʹࠇγϟυʔΛஔ͘ʢ"DUJWJUZࣗ ମ͸നഎܠͳͷͰςΩετΧϥʔಈతʹม͍͑ͨ
   w ϒϥʔ΍ΊΔʂʂ
11. ColorUtils
    IUUQTEFWFMPQFSBOESPJEDPNSFGFSFODFBOESPJETVQQPSUWHSBQIJDT $PMPS6UJMTIUNM
12. support.v4.graphics ColorUtils.blendARGB
13. 
    
    WBM
    CMFOEFE$PMPS
    
    
    
    
    
    $PMPS6UJMTCMFOE"3(# DPMPS
    DPMPS
    SBUJP
    
14. 
    
    WBM
    CMFOEFE$PMPS
    
    
    
    
    
    $PMPS6UJMTCMFOE"3(# DPMPS
    DPMPS
    SBUJP
    
15. 
    
    WBM
    CMFOEFE$PMPS
    
    
    
    
    
    $PMPS6UJMTCMFOE"3(# DPMPS
    DPMPS
    SBUJP
    
16. 
    
    WBM
    CMFOEFE$PMPS
    
    
    
    
    
    $PMPS6UJMTCMFOE"3(# DPMPS
    DPMPS
    SBUJP
    
17. 
    
    WBM
    CMFOEFE$PMPS
    
    
    
    
    
    $PMPS6UJMTCMFOE"3(# DPMPS
    DPMPS
    SBUJP
    SBUJP SBUJP
18. 
    
    JUBEE0O1BHF$IBOHF-JTUFOFS
    
    
    
    ʜ
    
    
    PWFSSJEF
    GVO
    PO1BHF4DSPMMFE QPTJUJPO
    *OU
    P⒎TFU
    'MPBU
    P⒎TFU1JYFMT
    *OU
    \
    
    
    
    
    ʜ
    
    
    
    
    JG
    QPTJUJPO
    
    
    \
    
    
    
    
    
    
    
    WBM
    SBUJP
    
    QPTJUJPO
    
    QPTJUJPO0⒎TFU
    
    
    
    
    
    
    
    WBM
    CMFOEFE$PMPS
    
    $PMPS6UJMTCMFOE"3(# EFGBVMU$PMPS
    $PMPS8)*5&
    SBUJP
    
    
    
    
    
    
    
    CJOEJOHUJUMF5FYUTFU5FYU$PMPS CMFOEFE$PMPS
    
    
    
    
    
    
    
    CJOEJOHIPNF"T6Q*OEJDBUPS5FYUTFU5FYU$PMPS CMFOEFE$PMPS
    
    
    
    
    
    
    
    CJOEJOHCMVS-BZPVUBMQIB
    
    SBUJP
    
    
    
    
    
    ^
    
    
    
    
    
    ʜ
    
19. 
    
    JUBEE0O1BHF$IBOHF-JTUFOFS
    
    
    
    ʜ
    
    
    PWFSSJEF
    GVO
    PO1BHF4DSPMMFE QPTJUJPO
    *OU
    P⒎TFU
    'MPBU
    P⒎TFU1JYFMT
    *OU
    \
    
    
    
    
    ʜ
    
    
    
    
    JG
    QPTJUJPO
    
    
    \
    
    
    
    
    
    
    
    WBM
    SBUJP
    
    QPTJUJPO
    
    QPTJUJPO0⒎TFU
    
    
    
    
    
    
    
    WBM
    CMFOEFE$PMPS
    
    $PMPS6UJMTCMFOE"3(# EFGBVMU$PMPS
    $PMPS8)*5&
    SBUJP
    
    
    
    
    
    
    
    CJOEJOHUJUMF5FYUTFU5FYU$PMPS CMFOEFE$PMPS
    
    
    
    
    
    
    
    CJOEJOHIPNF"T6Q*OEJDBUPS5FYUTFU5FYU$PMPS CMFOEFE$PMPS
    
    
    
    
    
    
    
    CJOEJOHCMVS-BZPVUBMQIB
    
    SBUJP
    
    
    
    
    
    ^
    
    
    
    
    
    ʜ
    
21. 4BNQMF IUUQTHJUIVCDPNTIBVOLBXBOPBOESPJEDPMPSCMFOEJOHTBNQMF
22. w $PMPS6UJMTΛ࢖ͬͯ̎ͭͷ৭ΛࠞͥΔ͜ͱ͕Ͱ͖ Δ
    w SBUJPҾ਺ʹΑͬͯ৭ͷ഑߹Λௐ੔Ͱ͖Δ
    w 7JFX1BHFSPO1BHF4DSPMMFEͱ૬ੑ͕ྑ͍ ͔΋ ·ͱΊ
23. Thank you! shaunkawano