Shibuya.apk#46 余白の作り方

Transcript

1. Shibuya.apk#46 みやゆ星 余白の 作り方
2. Modifier Padding Layout WindowInsetsPadding Arrangement.spacedBy Spacer Constraint Layout 余白の つくりかた
3. 一番ベーシックなモディファイア （主観） 周りに空間をあける NowInAndroid: 58回出現 Padding
4. そのまんま。スペーサー。 NowInAndroid: 17回出現 Spacer
5. Android Viewでは多用 要素と要素の間の依存関係を 細かく設定できる 美しいコードが書けない印象 なので、あまり使われていない？ NowInAndroid: 0回出現 Constraint Layout
6. カスタムレイアウトの作成 （位置・サイズを細かく指定できる） NowInAndroid: 1回出現 Layout
7. Now In Android 使用例(おまけ)
8. ColumnやRowで要素間の間隔をあける。 NowInAndroid: 16回出現 Arrangement. spacedBy
9. WindowInsets システムバーなどのウィンドウインセットに応じてパディングを適用するもの 引用：https://developer.android.com/jetpack/compose/layouts/insets?hl=ja →なのでちょっと特殊
10. WindowInsets 項目 説明 statusBars(IgnoringVisibility) ステータスバーのインセット（通知アイコンなどを含む上部のシステムUIバー） navigationBars(IgnoringVisibility) ナビゲーションバーのインセット（デバイスの左右下部のシステムUIバー） captionBar(IgnoringVisibility) キャプションバー（フリーフォームウィンドウのトップタイトルバーなど）のインセット systemBars(IgnoringVisibility) 全てのシステムバー（ステータスバー、ナビゲーションバー、キャプションバー）の合計インセット ime ソフトウェアキーボードが占有する下部スペースのインセット imeAnimationSource キーボードアニメーション前のソフトウェアキーボードの占有スペースのインセット imeAnimationTarget キーボードアニメーション後のソフトウェアキーボードの占有スペースのインセット tappableElement(IgnoringVisibility) タップ可能なナビゲーションUI要素のインセット systemGestures システムジェスチャーのインターセプト範囲のインセット mandatorySystemGestures 常にシステムが処理する必須のシステムジェスチャーのインセット displayCutout ディスプレイのカットアウト（ノッチやピンホール）を避けるためのインセット waterfall ウォーターフォールディスプレイの曲線領域を表すインセット https://developer.android.com/jetpack/compose/layouts/insets?hl=ja
11. 消費できる Modifier#windowInsetsPadding 消費できた分の間隔をあける Modifier#consumeWindowInsets 消費のみ
12. 🤔
14. 要素 使用シナリオ Modifier #padding ボタンやテキストなどのコンポーネントに余白を設定する場合に使用 Spacer 水平または垂直なレイアウト内でコンポーネント間に 特定の空白を作成したい場合などに使用 Arrangement #spacedBy 同一方向上に並べられた複数のコンポーネント間に均等な間隔を設定する場合に使用 Modifier #windowInsets ステータスバーなどのシステムUIとの間に余白を設定する必要がある場合に使用 Constraint Layout 複数のコンポーネントを相対的に配置する必要がある場合や、 複雑なレイアウトを作成する場合に使用 Modifier#layout 標準的なレイアウトオプションで要件を満たせない場合に、 カスタムレイアウトを定義するために使用
15. Thank You ご清聴ありがとうございました！！ @yuu1111main