CLで取り込み始めた階層的なUiStateについて

Transcript

1. GO BEYOND TOGETHER Chief Creative Officer BABY NAIL EXILE EXILE THE SECOND 三代目 J SOUL BROTHERS from EXILE TRIBE GENERATIONS from EXILE TRIBE THE RAMPAGE FANTASTICS from EXILE TRIBE BALLISTIK BOYZ from　EXILE TRIBE 劇団EXILE DEEP SQUAD DOBERMAN INFINITY Dream Ami Dream Shizuka Happiness 伶 PKCZ　DJ DARUMA m-flo MIYAVI　Crystal Kay JAY’ED Leola MABU Girls² iScream Lucky² PSYCHIC FEVER ACTOR MODEL ATHLETE AMAZING COFFEE CLで取り込み始めた 階層的なUiStateについて Yoshikane Fumitaka, @black_bracken CyberAgent, Android
2. GO BEYOND TOGETHER 映像配信サービス CL D 2020年サービス開C D 番組配1 D ライ' D PPA D 配1 D コミュニティ
3. GO BEYOND TOGETHER Jetpack ComposeとUiState h Compose• h 新規画面をFragment + Composeo h 既存のレイアウトもComposeViewで部分 的に置き換X h ComposeでのUiStateの取り扱€ h 信頼できる唯一の情報源としてVMが持7 h 状態を持つScreenとそうでないScreenを 切り分けてホイスティングすF h UiStateはどのような形で定義する? 状態の流れ
4. GO BEYOND TOGETHER UiState - flattened ™ data classを使ったUiStateの定F ™ UIの状態を全て1つのdata classに詰め– ™ メリッp ™ 慣れた方W ™ シンプルな構造なので拡張する上で破綻し にく‡ ™ デメリッp ™ どのプロパティがいつ使われているか文脈 を考慮しておく必要があ– ™ 現状はCLではこちらが多く使われている
5. GO BEYOND TOGETHER UiState - hierarchized ~ sealed interfaceを使ったUiStateの定e ~ 画面の各状態をそれぞれdata class/objectj ~ 共通の状態はsealed interfaceq ~ UIの状態のモデリングを厳格に行えt ~ メリッA ~ 排他な状態を型で表現できt ~ UI側から不必要なプロパティを隠蔽できt ~ どのタイミングでどの状態が使われるべきか明確 になt ~ 状態遷移時に使われない状態が自動で初期化されt ~ デメリッA ~ 共通化するプロパティが多いと煩雑になt ~ 少しずつ様子を見ながら複数の画面で利用
6. GO BEYOND TOGETHER まとめ — UiStateを階層的に定義するアプローv — 特に関数単位でコンポーネントを切り分け られるComposeとの噛み合いが良8 — 画面の複雑さによっては恩恵が薄くな• — 部分的に共通のプロパティが大量にあるよう なケースでなければ採用の価値あり
7. LIVE CAST ONDEMAND PROGRAM LIVE STREAMING COMMUNITY ありがとうございました Y GitHub - android/nowinandroid - feature/foryoe Y https://github.com/android/nowinandroid/blob/main/feature/foryou/src/ main/java/com/google/samples/apps/nowinandroid/feature/foryou/ ForYouInterestsSelectionUiState.kB Y developers - Compose UI を設計すS Y https://developer.android.com/jetpack/compose/ architecture#architecture-events