Android:半分の画面に分割された2つの相対レイアウト
私は何度も水平方向に整列し、半画面に分割された2つの相対レイアウトを描画しようとしました。
ペイントで画像をデザインし、私が意味することをもう少し詳しく説明します。
なにか提案を?
これら2つのRelativeLayoutを水平方向のLinearLayout内に配置し、両方のRelativeLayoutに weight を使用できます。これにより、LinearLayoutが2つの等しい部分に分割されます。
<LinearLayout
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:orientation="horizontal"
Android:baselineAligned="false">
<RelativeLayout
Android:layout_width="0dp"
Android:layout_height="wrap_content"
Android:layout_weight="1">
</RelativeLayout>
<RelativeLayout
Android:layout_width="0dp"
Android:layout_height="wrap_content"
Android:layout_weight="1">
</RelativeLayout>
</LinearLayout>
LinearLayoutを使用せずに同じタスクを実行するもう1つの方法は、親レイアウトの中央に中央揃えの「シム」を配置し、他の要素をそれに合わせます。半角エレメントの幅をmatch_parentに設定し、左右を揃えると、それらは収まるように縮小します。
<RelativeLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:tools="http://schemas.Android.com/tools"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:paddingBottom="@dimen/activity_vertical_margin"
Android:paddingLeft="@dimen/activity_horizontal_margin"
Android:paddingRight="@dimen/activity_horizontal_margin"
Android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.EqualWidthExample" >
<!-- An invisible view aligned to the center of the parent. Allows other
views to be arranged on either side -->
<View
Android:id="@+id/centerShim"
Android:layout_height="match_parent"
Android:layout_width="0dp"
Android:visibility="invisible"
Android:layout_centerHorizontal="true"/>
<!--Set width to match_parent sets maximum width. alignParentLeft aligns
the left Edge of this view with the left Edge of its parent. toLeftOf
sets the right Edge of this view to align with the left Edge of the
given view. The result of all three settings is that this view will
always take up exactly half of the width of its parent, however wide
that may be. -->
<Button
Android:id="@+id/btLeft"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_alignParentLeft="true"
Android:layout_toLeftOf="@+id/centerShim"
Android:text="Left Button" />
<!--Same deal, but on the right -->
<Button
Android:id="@+id/btRight"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_alignParentRight="true"
Android:layout_toRightOf="@+id/centerShim"
Android:layout_below="@+id/tvLeft"
Android:text="Right Button" />
</RelativeLayout>
percentRelativeLayoutを使用して簡単に実行できるようになりました
<Android.support.percent.PercentRelativeLayout
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="match_parent"
Android:layout_height="match_parent"
Android:padding="16dp"
tools:context=".MainActivity">
<Button
Android:id="@+id/button"
Android:layout_height="wrap_content"
Android:layout_centerVertical="true"
Android:text="Button"
app:layout_widthPercent="50%"/>
<Button
Android:id="@+id/button2"
Android:layout_height="wrap_content"
Android:layout_centerVertical="true"
Android:layout_toRightOf="@id/button"
Android:text="Button 2"
app:layout_widthPercent="50%"/>
</Android.support.percent.PercentRelativeLayout>
gradle依存関係を追加することを忘れないでください
dependencies {
compile 'com.Android.support:percent:25.3.1'
}
更新
ネストされたウィジェットで非推奨構造を使用できます
<LinearLayout
xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:tools="http://schemas.Android.com/tools"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:orientation="vertical"
Android:baselineAligned="false"
Android:weightSum="5">
<RelativeLayout
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:layout_weight="1"
Android:paddingLeft="@dimen/activity_horizontal_margin"
Android:paddingRight="@dimen/activity_horizontal_margin"
Android:paddingTop="@dimen/activity_vertical_margin"
Android:paddingBottom="@dimen/activity_vertical_margin"
Android:layout_gravity="center">
<TextView
Android:id="@+id/TopTextView"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:textAppearance="?android:attr/textAppearanceLarge"
Android:text="Top Text View"
Android:layout_alignParentTop="true"
Android:layout_centerHorizontal="true"
Android:layout_marginTop="5dp"/>
</RelativeLayout>
<LinearLayout
Android:layout_width="fill_parent"
Android:layout_height="fill_parent"
Android:orientation="horizontal"
Android:weightSum="2"
Android:layout_weight="4">
<RelativeLayout
Android:layout_width="0dp"
Android:layout_height="wrap_content"
Android:layout_weight="1"
Android:paddingLeft="@dimen/activity_horizontal_margin"
Android:paddingRight="@dimen/activity_horizontal_margin"
Android:paddingTop="@dimen/activity_vertical_margin"
Android:paddingBottom="@dimen/activity_vertical_margin">
<TextView
Android:id="@+id/LeftTextView"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:textAppearance="?android:attr/textAppearanceLarge"
Android:text="Left Text View"
Android:layout_centerHorizontal="true"
Android:layout_marginTop="30dp"/>
</RelativeLayout>
<RelativeLayout
Android:layout_width="0dp"
Android:layout_height="wrap_content"
Android:layout_weight="1"
Android:paddingLeft="@dimen/activity_horizontal_margin"
Android:paddingRight="@dimen/activity_horizontal_margin"
Android:paddingTop="@dimen/activity_vertical_margin"
Android:paddingBottom="@dimen/activity_vertical_margin">
<TextView
Android:id="@+id/RightTextView"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:textAppearance="?android:attr/textAppearanceLarge"
Android:text="Right Text View"
Android:layout_centerHorizontal="true"
Android:layout_marginTop="30dp"/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
図面に4つの相対レイアウトが表示されます...?
真ん中の2つを1つのLinearLayout(水平方向)に配置する場合は、すべての幅をmatch_parentにし、両方の相対レイアウトの重みを1にします。