[Android] ImageViewを左右の両端に配置する方法

LinearLayoutなどを使って普通にImageView（やButtonなど）を二つ続けて記述すると、layout_gravity属性にそれぞれright、leftを指定しても、左詰めで表示されてしまいます。GridLayoutやTableLayoutを使ってセルを定義して左右の端に表示する方法もありますが、XMLの記述が複雑になりますし、端末の画面サイズによってはImageViewが見えなくなる現象が起きたりします。また、Layoutの上にViewを配置することもLinearLayoutの方がシンプルに実現できます（LinearLayoutのbackgroundに画像をセットして、<LinearLayout>〜</LinearLayout>にViewを置くことで、画像の上にViewを配置できます）。

それで、LinearLayoutで左右の両端にImageViewを表示する方法ですが、空（空文字）のTextViewを二つのImageViewの間に挟むことで実現できます。

	<LinearLayout
	android:id="@+id/background_layout"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:background="@drawable/background_img"
	android:gravity="center_horizontal">
	<ImageView
	android:id="@+id/left_img"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:layout_gravity="bottom|left"
	android:layout_weight="0"
	android:onClick="leftClickHandler"
	android:src="@drawable/left_img"
	android:text="" />
	<TextView
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:layout_gravity="bottom|center"
	android:layout_weight="1"
	android:gravity="center" />
	<ImageView
	android:id="@+id/right_img"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:layout_gravity="bottom|right"
	android:layout_weight="0"
	android:onClick="rightClickHandler"
	android:src="@drawable/right_img"
	android:text="" />
	</LinearLayout>

view raw gistfile1.xml hosted with ❤ by GitHub

ポイントはgravity="center"を持つTextViewが二つのImageViewの間にあって、そのlayout_weightがImageView達のlayout_viewより高く設定されていることです。この設定によって、TextViewが中心に鎮座して最大限に幅をきかせようとするので、結果として二つのImageViewが左右両端に（TextViewにおいやられて）表示されることになります。