各コンポーネントを中央配置する方法を説明しています。
レイアウト
以下の例では、LinearLayout内にテキストとボタンを配置しています。
※他のLayoutコンポーネントでも同じように出来ます。
Layoutコンポーネント
中央配置に必要な設定のみ紹介していきます。
android:layout_gravity="center"
layout_gravityは、コンポーネントの配置を指定する設定です。
上記のように”center”を指定すると、縦・横のどちらも中央になります。
縦・横の片方のみ中央配置にすることも可能です。その場合は、以下の値を指定します。
- 縦のみ中央配置:center_vertical
- 横のみ中央配置:center_horizontal
android:layout_width="wrap_content"
android:layout_height="wrap_content"
layout_width、layout_heightは、コンポーネントの大きさ(幅)を指定する設定です。
“wrap_content”を指定すると、必要な分の領域を確保するように大きさが決まります。最初に示しているキャプチャでも、テキストとボタンが表示できる分だけの大きさとなっています。
“match_parent”を指定してしまうと、親コンポーネントに合わせた領域を確保してしまうため、中央配置することが出来なくなってしまいます。
ここまででLayoutコンポーネントを画面の中央に配置できるようになります。
テキスト・ボタン等のコンポーネント(Layout内部のコンポーネント)
Layout内部のコンポーネントが単一であれば、設定しなくても見た目は変わりません。Layoutコンポーネントで”wrap_content”を指定しているためです。
Layout内部に複数のコンポーネントを配置している場合は、各コンポーネントに中央配置する設定を追加していきます。
android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center"
Layoutコンポーネントと同じように設定します。
内部コンポーネントでは、縦の中央配置は出来ません。
親コンポーネントで設定しておきましょう。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" android:layout_gravity="center" tools:context=".MainActivity"> <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="1つ目のアクティビティ" /> <Button android:id="@+id/buttonNext" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="次のアクティビティへ" /> </LinearLayout>
まとめ
コンポーネントを中央配置する方法について説明しました。
- コンポーネントの配置を設定するには「layout_gravity」を使用する。
- center_vertical
縦のみ中央配置
- center_horizontal
横のみ中央配置 - center
どちらも中央配置
- center_vertical
- “wrap_content”、”match_parent”の違いについて理解する。
- wrap_content
必要な領域を確保 - match_parent
親コンポーネントに合わせた領域を確保
- wrap_content