LeoAndo / development-conference-memo

0 stars 0 forks source link

Title : Let's Preview！ Jetpack Compose (mochico) #31

Open LeoAndo opened 2 years ago

LeoAndo commented 2 years ago

https://youtu.be/RKAEoQy3l7A?t=34755

LeoAndo commented 2 years ago

Jetpack Composeを使ったUI構築の特徴

https://youtu.be/RKAEoQy3l7A?t=34812

宣言的UIツールキット
Functionで定義する
全てKotlinで記述する
状態が変わるごとに全てのUIの更新を行う
変更点のみを再描画する再Composeに描画制御を任せてどのように表示するかのみ宣言する

状態に応じて「こういうUIであるべき」という宣言をFunctionで定義してあげる

LeoAndo commented 2 years ago

Previewでデータを使う時の注意点

安易にPreview用のデータをパッケージにValなどで定義するとコンパイル後のアプリに残る

https://youtu.be/RKAEoQy3l7A?t=35081

LeoAndo commented 2 years ago

Previewの表示を変更する

https://youtu.be/RKAEoQy3l7A?t=35184

LeoAndo commented 2 years ago

MVVMアーキテクチャに沿ったアプリ

https://youtu.be/RKAEoQy3l7A?t=35426 https://youtu.be/RKAEoQy3l7A?t=35518

LeoAndo commented 2 years ago

テスト手法

テストの仕方にはいくつか手法がある

Dummy: 実際には使われない穴埋めのためのオブジェクト
Fake: 実際に動作するが本場とは異なる実装を持つオブジェクトUIのテストにも使われる
Stubs: レスポンスを返さない関数やオブジェクト
Spies: 呼び出され方によって呼び出しを記録するStub
Mocks: 期待値を返却する空実装

https://youtu.be/RKAEoQy3l7A?t=35466

LeoAndo commented 2 years ago

Screen composable

https://youtu.be/RKAEoQy3l7A?t=35563

LeoAndo commented 2 years ago

Compose Previewを使う利点

開発初期からCompose Previewを使ってさまざまな環境に対応したUIを構築できる
Previewを実装しやすいインターフェース、パーツ単位を心掛けることで設計が綺麗になる
画面全体のプレビューではフェイクの実装を使うことで本番に近い形で確認しながら実装できる

https://youtu.be/RKAEoQy3l7A?t=35767

LeoAndo commented 2 years ago

Previewの知見

プレビューの画面サイズを小さくするとちょっとだけ早くなった？？？
PreviewはKotlin compileまででいいので、アプリをビルドするよりはちょっとだけマシなはず(Previewの変更時の時間かかる問題に関して)