多くの Android レイアウトを理解する方法

Linear、Relative、Constraint、Table、Frame など。 Android アプリケーションには、アプリケーションを設計するときに選択できる多数のレイアウトがあります。 問題は、どれが一番いいですか?

さまざまなレイアウトの詳細に入る前に、まずビュー オブジェクトの階層と Android の描画プロセスについて説明します。

View と ViewGroup

ViewGroup は、任意のビューの親クラスであり、レイアウトの基本クラスでもあると考えてください。これは、他のビューのコンテナーであるオブジェクトを表します。たとえば、 LinearLayout ViewGroup です ビューやその他のレイアウトも含めることができるためです。

一方、ビューは UI 要素の基本的な構成要素です。ビューは、ViewGroup の一部にすることができます。たとえば、 TextView ビューです .

測定 -> レイアウト -> 描画 -> 繰り返し

Android では、レイアウトは XML ファイルとして保存されます。しかし、それらはどのようにして画面に表示されるオブジェクトに変換されるのでしょうか?各 XML ファイルがインスタンス化され (つまり、インフレートされ)、ビュー階層ツリーが形成されます。これは、レイアウト A 内にネストされたレイアウト B がある場合、それらには子 - 親の関係があることを意味します (レイアウト A はレイアウト B の親です)。ツリーが形成されると、測定、レイアウト、描画の 3 つのフェーズが発生します。これらの各フェーズは、深さ優先検索の順序でツリーをトラバースします。

測定

最初のフェーズでは、各親ノードは、子ノードのサイズに関する特定の制約を把握します。これらの制限を下位の子に渡します。各子は自身のサイズ (必要な大きさ) を評価し、与えられた制限とその子の制限を考慮します。

レイアウト

ここで、各ノードは、画面上の各子の最終的なサイズと位置を決定します。

描く

自分自身を描画するルート ノードから始めて、その子に自分自身を描画するように指示します。このようにして、親が描画され、その上にその子が描画されます。

上記のプロセスを念頭に置いて、アプリケーションのレイアウトをできるだけ浅くして、ビュー階層をトラバースするのにかかる時間を短縮するようにしてください

レイアウトの内訳

リニア

縦または横の向きで子を一列に編成します。つまり、ビューはすべて 1 行または 1 列になります。 android:orientation を使用して方向を指定できます

Linear Layout の興味深い機能の 1 つは、layout_weight です。 属性。これは、子ビュー間のスペースを分割する方法を Linear Layout に指示するために使用されます。デバイスや向きによってレイアウトを統一したい場合に便利です。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello"
        />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="World!"
        />

</LinearLayout>

Hello, という単語を含む最初の TextView が必要だとしましょう。 常に画面幅の 3/4 を占めるようにします。これを行うには、layout_weight 属性を使用できます。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="4"        // <-- We added a total weight for our layout (4)
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="3"   // <-- Will have a weight of 3 out of 4 (3/4)
        android:text="Hello" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="World!"
        android:layout_weight="1"   // <-- Will have a weight of 1 out of 4 (1/4)
        />

</LinearLayout>

相対

名前が示すように、このレイアウトは内部の子ビューを相対的な位置に設定します。これにより、ネストされたビュー グループを使用せずに、レイアウト階層をフラットに保つことができます。ただし、同時に、各相対レイアウトは 2 つの測定パスのプロセスを実行する必要があり、パフォーマンスに影響を与える可能性があります。

RelativeLayout の便利な機能の 1 つは、 centerInParent を使用して子ビューを中央に配置できることです。

制約

制約 制約が関連付けられている要素への接続または配置です。存在する他のビューに関連するすべての子ビューに対して、さまざまな制約を定義します。これにより、フラットなビュー階層 (ネストされた ViewGroup なし) を使用して複雑なレイアウトを構築できます。 RelativeLayout と同様に、このレイアウトにも 2 つの測定パスが必要です。

フレーム

このレイアウトは、単一の子ビューを保持するためにのみ使用されるため、レイアウト内の他のビューをブロックします。レイアウト自体は、その最大の子ビュー (表示されているかどうかに関係なく) と同じ大きさになり、パディングが追加されます。

子ビューが互いに重ならないようにするのは難しいため、FrameLayout 内に複数の子ビューを配置することは避けてください。 layout_gravity を割り当てることで、これらの子ビューの位置を制御できます

リスト ビュー/グリッド ビュー

画面に複数のアイテムを表示する必要がある場合に使用します (レストランのメニューなど)。リスト ビューは、ユーザーがスクロールできる 1 列のリストです。グリッド ビューは、複数の列を持つリスト ビューと考えることができます。

これらのレイアウトについて知っておくべき重要なことは、ビューが動的で実行時に作成されるということです。実行時に項目を設定するには、AdapterView を使用する必要があります。

テーブルレイアウト

グリッド ビューと非常によく似たこのレイアウトは、子を行と列に配置します。各レイアウトには複数の TableRow オブジェクトが含まれ、それぞれが行を定義します。

最適なレイアウトが見つかるまで、恐れずにさまざまなレイアウトを試してください。以下のコメント欄で、どのレイアウトがあなたにとって最も役立つか、またその理由を教えてください。