Androidアプリで要素間のマージンを調整する方法 - Kotlin拡張コードを使用してマージンを設定
7 min read
ProgrammingLang#Android#Extension#Kotlin
前書き
今日は、超簡単な小技を皆さんに共有します。
Androidアプリを設計する際に、コードを使って要素のマージンを調整する方法です。
この方法は便利なだけでなく、デザインをより美しくすることができます。
初心者のエンジニアでも簡単にマスターできます！
一緒に学びましょう！
基本的な方法
Androidで要素間のマージンを調整する方法は複数ありますが、この記事ではKotlin拡張コードを使用してマージンを設定する方法を紹介します。
その前に、
xmlでviewのマージンを設定する場合、
最も直接的な方法は一行だけです。
android:layout_marginLeft="30dp"
場合によっては、
要求者がAndroid View要素間のマージンを動的に設定するよう求めることがあります。
通常、以下の方法を使用できます。
この方法では、LayoutParamsをインスタンス化し、
上下左右のマージンを設定してからViewにセットする必要があります。
しかし、複数の場所でこのマージン設定方法を使用する必要がある場合、
コードが冗長になり、保守が難しくなります。
この問題を解決するために、
Kotlin Extensionを使用してマージン設定方法を実装できます。
これにより、コードがより簡潔で保守しやすくなります。
Kotlin Extensionを使用して実装
ステップ0. まずは完全な拡張関数を示します
このコードはすでに直接使用できます。
プロジェクトにコピーして、
直接viewを呼び出すだけです！
vb.btConfirmZero.margin(top = 0F)
vb.btConfirmOne.margin(bottom = 30F,right = 2F)
vb.btConfirmTwo.margin(bottom = 10F,left = 3F)
ステップ1. どのように実装するか？
まず、以下のように関数を作成します。
上記のコードの説明
-
ここでは、blockという名前のfunction typeを渡します。
これはKotlinの変数の一種です（他の言語にもあるかもしれませんが、Javaはまだサポートしていません）。 <b style="color:blue;">（Function typeの説明はこちらを参照:クリック）</b> Function typeを使用すると、lambdaを操作できます（Javaにもlambdaがありますが、現在のところfunction typeはありません）。 </a> </li> -
我々はここでジェネリックを使用しています
そして型変換を使用してジェネリックを変換しました コンパイル時に暗黙の型キャストと見なされてエラーが発生する可能性があります したがって、明確なクラスがない場合 直接キャストすると <b style="color:red;">`xxxxClass cannot be cast to zzzzClass` </b>のようなエラーが発生する可能性があります または、一部のコンパイラは直接<b style="color:red;">`unchecked cast`</b>警告を表示します もちろん、clazz: Classのようなものを渡して実際のクラスを判断することもできます しかし、そうするとコードが増えます クラスが多くなると、さらに多くのコードを書き、同じことを繰り返すことになります...など したがって、ここでは`reified`を解決策として使用しました これは、この種の問題を解決するためにKotlinが提供する使い方の一つです -> reifiedを使用するには`inline`を付ける必要があります
その後、次のように呼び出すことができます
上記のコードの説明
ここでは、異なるViewGroup.LayoutParamsに対応するためです将来、<b>ViewGroup.LayoutParams</b>を継承する実体クラスが増えた場合
より柔軟に操作できるようにします
Step2. dpをpxに変換するメソッドを書く
- ここは非常に簡単です 主に間隔を設定する際にピクセルを使用するため 変換メソッドを書きました
Step3. 拡張したlayoutParamsを使用してレイアウトのパラメータを変更する
上記のコードの説明
ここでは、先ほど書いたView.layoutParamsを使用して設定したいビューを操作します以前はJavaで設定する際、必ず上下左右の4つのパラメータを一度に入力する必要がありました
したがって、ここでは
<b>left: Float? = null, top: Float? = null, right: Float? = null, bottom: Float? = null</b>
として、4つの位置の間隔をすべてnullに設定します
そしてKotlinのnull安全の特性を使用してチェックします。例えば
<b>left?.run { leftMargin = convertDpToPixel(this) }</b>
値がある場合にのみマージンの間隔値を設定します
null例外を心配する必要がなく、変更したい位置だけを柔軟に入力できます