ConstraintLayout : Flow

帰ってきた関西モバイルアプリ研究会#2
https://kanmoba.connpass.com/event/134059/

Transcript

1. $POTUSBJOU-BZPVU
   
   'MPX 
   
   ؔϞό
   ,B[VLJ
   8BUBOBCF
2. 1SPpMF w ͳ΂
   w 5XJUUFS
   
   !/BCF$PUU
   w (JU)VC
   
   /6NFSP"OE%FW
   w 'FOSJS
   *OD
   w "OESPJE
   "QQ
   %FWFMPQFS
3. 8IBU`T
   'MPX w $POTUSBJOU-BZPVU
   BMQIB
   ͔Β
   w 'MFYCPY
   ͷΑ͏ͳϨΠΞ΢τΛ࣮ݱͰ͖Δ
   w 7JFX
   ͷ֊૚ΛϑϥοτʹอͯΔ
   w .PUJPO-BZPVU
   ͱ૊Έ߹ΘͤΔ͜ͱ͕Ͱ͖Δ
4. #BTJD <com.google.android.material.button.MaterialButton android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Button1" /> <com.google.android.material.button.MaterialButton android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Button2" /> …
5. #BTJD <androidx.constraintlayout.helper.widget.Flow android:id="@+id/flowLayout" android:layout_width="0dp" android:layout_height="wrap_content" android:orientation=“horizontal” app:constraint_referenced_ids=“button1,button2,butt…” app:flow_wrapMode="aligned" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" />
6. #BTJD w Πϝʔδ
7. 0SJFOUBUJPO w )PSJ[POUBM
   android:orientation="horizontal" w 7FSUJDBM
   
   
   android:orientation="vertical"
8. w )PSJ[POUBM w 7FSUJDBM 0SJFOUBUJPO
9. XSBQ.PEF w /POF
   app:flow_wrapMode="none" w $IBJO
   app:flow_wrapMode="chain" w "MJHO
   app:flow_wrapMode="none"
10. w $IBJO w "MJHO XSBQ.PEF
11. NBY&MFNFOUT8SBQ app:flow_maxElementsWrap=“integer"
12. NBY&MFNFOUT8SBQ
13. 0UIFS
    BUUSJCVUFT w $IBJO
    4UZMF
    app:flow_verticalStyle="packed|spread|spread_inside" app:flow_horizontalStyle="packed|spread|spread_inside" w #JBT
    app:flow_verticalBias="float" app:flow_horizontalBias="float" w "MJHO
    app:flow_horizontalAlign="start|end|center" app:flow_verticalAlign="top|bottom|center|baseline" w (BQ
    app:flow_verticalGap="dimension" app:flow_horizontalGap="dimension"
14. 8JUI
    .PUJPO-BZPVU
15. <ConstraintSet android:id="@+id/start"> <Constraint android:id="@id/flowLayout"> <Layout android:layout_width="0dp" android:layout_height="wrap_content" motion:constraint_referenced_ids=“button1,button2,butt…” motion:layout_constraintEnd_toEndOf="parent" motion:layout_constraintStart_toEndOf="@id/sideLayout" motion:layout_constraintTop_toTopOf="parent" /> </Constraint> <Constraint android:id="@id/button1"> <Layout android:layout_width="92dp" android:layout_height="92dp" /> </Constraint> … </ConstraintSet> 8JUI
    .PUJPO-BZPVU
16. <ConstraintSet android:id="@+id/end"> <Constraint android:id="@id/flowLayout"> <Layout android:layout_width="42dp" android:layout_height="0dp" motion:constraint_referenced_ids=“button2,button3,…” motion:layout_constraintBottom_toBottomOf="parent" motion:layout_constraintEnd_toEndOf="parent" motion:layout_constraintStart_toEndOf="@id/sideLayout" motion:layout_constraintTop_toTopOf="parent" /> </Constraint> <Constraint android:id="@id/button1"> <Layout android:layout_width="120dp" android:layout_height="120dp" android:layout_marginTop="24dp" motion:layout_constraintEnd_toEndOf="@id/sideLayout" motion:layout_constraintStart_toStartOf="parent" motion:layout_constraintTop_toTopOf="parent" /> </Constraint> <Constraint android:id="@id/button2"> <Layout android:layout_width="42dp" android:layout_height="42dp" /> </Constraint> … </ConstraintSet> 8JUI
    .PUJPO-BZPVU
20. w IUUQTBOESPJETUVEJPHPPHMFCMPHDPN DPOTUSBJOUMBZPVUBMQIBIUNM
    w IUUQTBOESPJETUVEJPHPPHMFCMPHDPN DPOTUSBJOUMBZPVUCFUBIUNM
    w IUUQTEFWFMPQFSBOESPJEDPNSFGFSFODFBOESPJE TVQQPSUDPOTUSBJOUIFMQFS'MPXIUNM