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

Material Components for Android 1.1.0 and 1.2.0

Nabe
November 07, 2019

Material Components for Android 1.1.0 and 1.2.0

Nabe

November 07, 2019
Tweet

More Decks by Nabe

Other Decks in Programming

Transcript

  1. .BUFSJBM$PNQPOFOUT
    GPS"OESPJE
    BOE

    "OESPJE%FW4VNNJUใࠂձ
    ,B[VLJ8BUBOBCF

    View full-size slide

  2. 1SPpMF
    w ͳ΂
    w 5XJUUFS!/BCF$PUU
    w (JU)VC/6NFSP"OE%FW
    w ͸ͯͳ
    w "OESPJE"QQ%FWFMPQFS

    View full-size slide

  3. NBUFSJBMDPNQPOFOUTCFUB

    View full-size slide

  4. ὎ CFUB

    w .BUFSJBM5IFNJOH
    w $PMPS 4IBQF 5ZQPHSBQIZ5IFNJOH
    w %BSL5IFNF
    w /FX$PNQPOFOUT
    w 6QEBUF$PNQPOFOUT
    w #VHpYFUD
    IUUQTHJUIVCDPNNBUFSJBMDPNQPOFOUTNBUFSJBMDPNQPOFOUTBOESPJESFMFBTFTUBHCFUB

    View full-size slide

  5. ὎ CFUB

    w .BUFSJBM5IFNJOH
    w $PMPS 4IBQF 5ZQPHSBQIZ5IFNJOH
    w %BSL5IFNF
    w /FX$PNQPOFOUT
    w 6QEBUF$PNQPOFOUT
    w #VHpYFUD

    View full-size slide

  6. "OESPJE%FW4VNNJU
    %FWFMPQJOH5IFNFTXJUI4UZMF
    IUUQTZPVUVCF0XLG%I"04P

    View full-size slide

  7. /FX$PNQPOFOUT
    w &YUFOEFE'MPBUJOH"DUJPO#VUUPO
    w .BUFSJBM#VUUPO5PHHMF(SPVQ
    w .BUFSJBM%BUF1JDLFS

    View full-size slide

  8. &YUFOEFE'"#
    loatingActionButton
    android:id="@+id/extendedFab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    android:text="Create"
    app:icon="@drawable/ic_add" />

    View full-size slide

  9. &YUFOEFE'"#
    extendedFab.extend() extendedFab.shrink()

    View full-size slide

  10. .BUFSJBM#VUUPO5PHHMF(SPVQ

    View full-size slide

  11. .BUFSJBM#VUUPO5PHHMF(SPVQ
    android:id="@+id/singleSelectToggleGroup"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:singleSelection="true">
    style=“?attr/materialButtonOutlinedStyle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Select1" />
    style="?attr/materialButtonOutlinedStyle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Select2" />

    View full-size slide

  12. .BUFSJBM#VUUPO5PHHMF(SPVQ
    w DIFDLFE#VUUPO*EDIFDLFE#VUUPO*ET
    w DIFDL JE*OU
    VODIFDL JE*OU

    w BEE0O#VUUPO$IFDLFE-JTUFOFS
    w DMFBS$IFDLFE
    w "OENPSFʜ

    View full-size slide

  13. .BUFSJBM%BUF1JDLFS

    View full-size slide

  14. .BUFSJBM%BUF1JDLFS
    val datePickerFragment =
    MaterialDatePicker.Builder.datePicker().build()
    val dateRangePickerFragment =
    MaterialDatePicker.Builder.dateRangePicker().build()

    View full-size slide

  15. .BUFSJBM%BUF1JDLFS
    w TFU4FMFDUJPO E-POH

    TFU4FMFDUJPO E1BJS-POH -POH

    w TFU5IFNF

    NBUFSJBM$BMFOEBS'VMMTDSFFO5IFNF

    NBUFSJBM$BMFOEBS5IFNF

    DVTUPNUIFNF

    View full-size slide

  16. .BUFSJBM%BUF1JDLFS
    w TFU$BMFOEBS$POTUSBJOU D$BMFOEBS$POTUSBJOUT

    -JNJUUIFEJTQMBZSBOHFPGDBMFOEBSBOETFUBOPQFO"UNPOUI
    w TFU4UBSU E-POH
    TFU&OE E-POH

    w TFU0QFO"U E-POH

    w TFU7BMJEBUPS WBMJEBUPS%BUF7BMJEBUPS

    %BUF7BMJEBUPS1PJOU'PSXBSE

    DMBTTUIBUJNQMFNFOUFE%BUF7BMJEBUPS

    View full-size slide

  17. NBUFSJBMDPNQPOFOUTBMQIB

    View full-size slide

  18. ὎ BMQIB

    w "EEFE4MJEFS
    w .BUFSJBM#VUUPO5PHHMF(SPVQTVQQPSUTWFSUJDBM
    PSJFOUBUJPO
    w "OENPSFVQEBUFT
    IUUQTHJUIVCDPNNBUFSJBMDPNQPOFOUTNBUFSJBMDPNQPOFOUTBOESPJESFMFBTFTUBHBMQIB

    View full-size slide

  19. 4MJEFS
    android:id="@+id/discreteSlider"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:stepSize="10"
    android:value="10"
    android:valueFrom="0.0"
    android:valueTo="100.0"
    app:floatingLabel="true" />

    View full-size slide

  20. 4MJEFS
    w TFU0O$IBOHF-JTUFOFS
    w TFU-BCFM'PSNBUUFS

    #BTJD-BCFM'PSNBUUFS

    DMBTTUIBUJNQMFNFOUFE-BCFM'PSNBUUFS

    View full-size slide

  21. +FUQBDL$PNQPTF

    View full-size slide