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

CustomView in Kotlin @ potatotips #42

CustomView in Kotlin @ potatotips #42

potatotips #42にて発表したKotlinでCustomViewを作る話のスライドです。

Yoshihiro WADA

July 25, 2017
Tweet

More Decks by Yoshihiro WADA

Other Decks in Programming

Transcript

  1. $VTUPN7JFXJO,PUMJO
    :PTIJIJSP8BEBBLB!FEPLVQ
    QPUBUPUJQT!$PPLQBE *OD

    View Slide

  2. ୭΍ͶΜ͓લ
    :PTIJIJSP8BEB
    Ɠ $ZCFS"HFOU *OD
    "EUFDI4UVEJP"*.FTTFOHFS
    !FEPLVQ
    ȍ FEPLVQ
    FEPLVQ
    ,PUMJO ྺ ϲ݄

    View Slide

  3. ,PUMJO ྺ ϲ݄
    ୭΍ͶΜ͓લ
    :PTIJIJSP8BEB
    Ɠ $ZCFS"HFOU *OD
    "EUFDI4UVEJP"*.FTTFOHFS
    !FEPLVQ
    ȍ FEPLVQ
    FEPLVQ

    View Slide

  4. ࠓճ࿩͢͜ͱ
    ⋆ ,PUMJO Ͱ $VTUPN7JFX Λ࡞੒͢Δ
    ? ίϯετϥΫλ͸Ͳ͏ͳΔʜʁ
    ? +BWB ͔ΒݺͿࡍʹ͸ʜʁ
    ? $BMMCBDL ͸Ͳ͏͢Ε͹ʜʁ

    View Slide

  5. $POTUSVDUPS
    QVCMJDDMBTT$VTUPN7JFXFYUFOET7JFX\
    QVCMJD$VTUPN7JFX $POUFYUDPOUFYU
    \
    TVQFS DPOUFYU

    JOJU

    ^
    QVCMJD$VTUPN7JFX $POUFYUDPOUFYU !/VMMBCMF"UUSJCVUF4FUBUUST
    \
    TVQFS DPOUFYU BUUST

    JOJU

    ^
    QVCMJD$VTUPN7JFX $POUFYUDPOUFYU !/VMMBCMF"UUSJCVUF4FUBUUST
    JOUEFG4UZMF"UUS
    \
    TVQFS DPOUFYU BUUST EFG4UZMF"UUS

    JOJU

    ^
    QSJWBUFWPJEJOJU
    \
    JOJUJBMJ[F
    ^
    NFUIPET
    ^
    ⋆ ී௨ͷ $POTUSVDUPS

    View Slide

  6. $POTUSVDUPS
    DMBTT$VTUPN7JFX7JFX\
    DPOTUSVDUPS DPOUFYU$POUFYU
    TVQFS DPOUFYU

    DPOTUSVDUPS
    DPOUFYU$POUFYU BUUST"UUSJCVUF4FU

    TVQFS DPOUFYU BUUST

    DPOTUSVDUPS
    DPOUFYU$POUFYU
    BUUST"UUSJCVUF4FU
    EFG4UZMF"UUS*OU

    TVQFS DPOUFYU BUUST EFG4UZMF"UUS

    JOJU\
    JOJUJBMJ[F
    ^
    NFUIPET
    ^
    ⋆ ,PUMJO Ͱ JOJU ϒϩοΫΛ࢖ͬͯΈΔ
    TFDPOEFSZ
    DPOTUSVDUPST

    View Slide

  7. $POTUSVDUPS
    DMBTT$VTUPN7JFX!+WN0WFSMPBETDPOTUSVDUPS
    DPOUFYU$POUFYU
    BUUST"UUSJCVUF4FU OVMM
    EFG4UZMF"UUS*OU

    7JFX DPOUFYU BUUST EFG4UZMF"UUS
    \
    JOJU\
    JOJUJBMJ[F
    ^
    NFUIPET
    ^
    ⋆ σϑΥϧτҾ਺Λ࢖ͬͯΈΔ
    QSJNBSZ
    DPOTUSVDUPS

    View Slide

  8. $POTUSVDUPS
    DMBTT$VTUPN7JFX!+WN0WFSMPBETDPOTUSVDUPS
    DPOUFYU$POUFYU
    BUUST"UUSJCVUF4FU OVMM
    EFG4UZMF"UUS*OU

    7JFX DPOUFYU BUUST EFG4UZMF"UUS
    \
    JOJU\
    JOJUJBMJ[F
    ^
    NFUIPET
    ^
    ⋆ σϑΥϧτҾ਺Λ࢖ͬͯΈΔ
    QSJNBSZ
    DPOTUSVDUPS

    View Slide

  9. !+WN0WFSMPBET Ξϊςʔγϣϯ
    ⋆ +BWB ༻ͷ 0WFSMPBENFUIPE Λ࡞ͬͯ͘ΕΔ
    +BWB ͔Β͸σϑΥϧτҾ਺͸ࢀরͰ͖ͳ͍ɻ
    /P4VDI.FUIPE&YDFQUJPO Λు͔ΕΔ
    !+WN0WFSMPBETΞϊςʔγϣϯΛ௥Ճ͢Δͱ
    +BWB ͔Βݟͨͱ͖ʹϝιου͕ଟॏఆٛ͞ΕΔ
    ,PUMJO ͔Β "OESPJE4UVEJP ͷ *OUFOTJPO Ͱ
    !+WN0WFSMPBET ͳίϯετϥΫλΛ
    ࡞ͬͯ͘ΕΔΑ͏ʹ
    "EE"OESPJE7JFXDPOTUSVDUPSTVTJOH!+WN0WFSMPBET

    View Slide

  10. $BMMCBDL
    QVCMJDDMBTT-JTUFOFS4BNQMF7JFXFYUFOET7JFX\
    QSJWBUF$BMMCBDLDBMMCBDL
    QVCMJDWPJEIPHF
    \
    JG DBMMCBDLOVMM
    SFUVSO
    DBMMCBDLPO)PHF

    ^
    QVCMJDJOUFSGBDF$BMMCBDL\
    QVCMJDWPJEPO)PHF

    ^
    ^
    QVCMJDDMBTT.BJO"DUJWJUZFYUFOET"QQ$PNQBU"DUJWJUZ
    JNQMFNFOUT-JTUFOFS4BNQMF7JFX$BMM#BDL\
    !0WFSSJEF
    QVCMJDWPJEPO)PHF
    \
    DBMMCBDLT
    ^
    ^
    ⋆ ී௨ͷϦεφʔύλʔϯ

    View Slide

  11. $BMMCBDL
    DMBTT-JTUFOFS4BNQMF7JFX7JFX\
    QSJWBUFWBSDBMMCBDL$BMMCBDL OVMM
    QSJWBUFGVOIPHF
    \
    DBMMCBDL PO)PHF
    TBGFDBMM
    ^
    JOUFSGBDF$BMMCBDL\
    GVOPO)PHF

    ^
    ^
    DMBTT.BJO"DUJWJUZ"QQ$PNQBU"DUJWJUZ

    -JTUFOFS4BNQMF7JFX$BMMCBDL\
    PWFSSJEFGVOPO)PHF
    \
    DBMMCBDLT
    ^
    ^
    ⋆ ͦͷ·· ,PUMJO ʹͯ͠ΈΔ

    View Slide

  12. $BMMCBDL
    DMBTT-JTUFOFS4BNQMF7JFX7JFX\
    㕉ᡔә◌क✖ԒԾԠԏԗ԰ӔӘӑӇӘӨӨՉ՛ԸӕᛝӉӅӳӶӵ
    WBSPO)PHF
    6OJU
    OVMM
    QSJWBUFGVOIPHF
    \
    PO)PHF JOWPLF

    ^
    ^
    DMBTT.BJO"DUJWJUZ"QQ$PNQBU"DUJWJUZ
    \
    PWFSSJEFGVOPO$SFBUF TBWFE*OTUBODF4UBUF#VOEMF
    \
    MJTUFOFS4BNQMF7JFXPO)PHF\
    DBMMCBDLT
    ^
    ^
    ^
    ⋆ ؔ਺Ϧςϥϧͱ JOWPLF Ͱ -JTUFOFS ͕ෆཁʹ

    View Slide

  13. $BMMCBDL
    QVCMJDDMBTT+BWB.BJO"DUJWJUZFYUFOET"QQ$PNQBU"DUJWJUZ\
    !0WFSSJEF
    QSPUFDUFEWPJEPO$SFBUF
    !/VMMBCMF#VOEMFTBWFE*OTUBODF4UBUF
    \
    MJTUFOFS4BNQMF7JFXTFU0O)PHF OFX'VODUJPO6OJU
    \
    !0WFSSJEF
    QVCMJD6OJUJOWPLF
    \
    DBMMCBDLT
    SFUVSOOVMM
    ^
    ^

    ^
    ^
    ⋆ +BWB Ͱѻ͏ͱ͖͸ 'VODUJPO/ ΛҾ਺ʹ༩͑Δ
    'VODUJPO/
    㮢/ әᐠᡔӘંᡔ㮣
    ୤ә ,PUMJO Ә㕉ᡔѭ
    6OJU ӔӴ OVMM Ӽ㈘Ӄ

    View Slide

  14. $BMMCBDL
    ⋆ Ҿ਺͕ଟ͘ͳͬͨͱ͖Λߟ͑Δ
    ⋆ ֦େɾॖখɾεΫϩʔϧͰ͖Δ *NBHF7JFX
    Ͱഒ཰΍࠲ඪɺ͸Έग़͠஋౳Λ௨஌ͯ͠΄͍͠
    WBSPO$IBOHF4UBUF
    TDBMF'MPBU
    Y'MPBU
    Z'MPBU
    PWFS9*OU
    PWFS:*OU
    6OJU

    OVMM

    View Slide

  15. $BMMCBDL
    ⋆ +BWB ίʔυͰ͸ඇৗʹ௕͍ 'VODUJPO ʹͳΔ
    ⋆ ิ׬Ͱࣗಈੜ੒͢ΔͱҾ਺໊͕Ṗ
    IPHF7JFXTFU0O$IBOHF4UBUF
    OFX'VODUJPO'MPBU 'MPBU 'MPBU *OUFHFS *OUFHFS 6OJU
    \
    !0WFSSJEF
    QVCMJD6OJUJOWPLF 'MPBUB'MPBU
    'MPBUB'MPBU
    'MPBUB'MPBU
    *OUFHFSJOUFHFS
    *OUFHFSJOUFHFS
    \
    SFUVSOOVMM
    ^
    ^

    ⧞௻ӑᥨҷᝪҲӵӘәǘ

    View Slide

  16. $BMMCBDL
    IPHF7JFXPO$IBOHF4UBUF\
    䖕 GM'MPBU
    GM'MPBU
    GM'MPBU
    J*OU
    J*OU\⧞ಌ⇰ᘻҿӶӉᐠᡔൻ

    GVODUJPOT
    ^
    ^
    ⋆ ,PUMJO Ͱ΋ *OUFOTJPO ͨ࣌͠ͷҾ਺໊͕ʜ
    +BWB ӘӒҷӲӴ㗾ӕӔӍӉǘ㮹

    View Slide

  17. $BMMCBDL ʹ͍ͭͯࢥ͏͜ͱ
    ⋆ ؔ਺ϦςϥϧͰϦεφʔύλʔϯഉআ͸Ͱ͖Δ
    ⋆ ϦεφʔύλʔϯΛ࢖ͬͨ΄͏͕ϝϯςφϯε
    ͠΍͍͢έʔε͸͍ͬͺ͍͋Γͦ͏
    ෳ਺ͷҾ਺͕ଘࡏ͢Δͱ͖
    ଟ਺ͷίʔϧόοΫؔ਺Λ࣋ͭͱ͖
    ⋆ ٯʹར༻ͨ͠ํ͕ྑͦ͞͏ͳέʔε΋͋Γͦ͏
    ඞͣఆٛ͢Δඞཁͷͳ͍ίʔϧόοΫ͕͋Δ࣌
    FH(FTUVSF%FUFDUPS(FTUVSF-JTUFOFS ͷ಺
    μϒϧλοϓͷݕ஌͚ͩར༻͍ͨ͠ɺͱ͔

    View Slide

  18. ࢀߟจݙ
    ⋆ +BWB ͔Βͷར༻Λࢹ໺ʹೖΕͨ ,PUMJO ίʔυͰ
    ԿΛ͢Δ΂͖͔2JJUB
    IUUQRJJUBDPNKNBUTVJUFNTDCBBDCDCG
    ⋆ +BWB,PUMJO ࠞ߹ϓϩδΣΫτͰؾΛ͚͍ͭͯΔ͜ͱɻ
    IUUQMWMBIBUFOBCMPHDPNFOUSZ
    ⋆ ,PUMJO ͰίʔϧόοΫ2JJUB
    IUUQRJJUBDPN""LJSB!HJUIVCJUFNTFCBBFFECED

    View Slide