過去記事
- Xamarin.AndroidでHello world - かずきのBlog@hatena
- Xamarin.Androidで画面遷移してみよう - かずきのBlog@hatena
- Xamarin AndroidでActivityにライフサイクルを確認してみた - かずきのBlog@hatena
- Xamarin AndroidでLinearLayoutを見てみよう - かずきのBlog@hatena
RelativeLayout
他のコントロールや親のパネルから見て相対的にどういう位置に表示するかといった指定方法で並べるレイアウトになります。親からの相対位置の指定方法は以下のものがあります。
- layout_alignParentLeft:親の左側
- layout_alignParentRight:親の右側
- layout_alignParentTop:親の上側
- layout_alignParentBottom:親の下側
- layout_centerInParent:親の中央
以下のようなaxmlを記述すると
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <Button android:id="@+id/MyButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="Center" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button1" android:text="Top|Left" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button2" android:text="Bottom|Right" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" /> </RelativeLayout>
以下のように表示されます。
他の要素から相対的に位置を設定するには以下の属性を指定します。属性の値は相対的に配置したい元になるコントロールのID(@id/XXXX)になります。
- layout_toLeftOf:左に配置する
- layout_toRightOf:右に配置する
- layout_above:上に配置する
- layout_below:下に配置する
- layout_alignLeft:左端に位置を合わせる
- layout_alignRight:右端に位置を合わせる
- layout_alignTop:上端に位置を合わせる
- layout_alignBottom:下端に位置を合わせる
全組み合わせは試しませんが、以下のようなaxmlで
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <Button android:id="@+id/MyButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="Center" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button1" android:text="Right|above" android:layout_toRightOf="@id/MyButton" android:layout_above="@id/MyButton" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button2" android:text="Left|below" android:layout_toLeftOf="@id/MyButton" android:layout_below="@id/MyButton" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button3" android:text="alignLeft|below" android:layout_alignLeft="@id/MyButton" android:layout_below="@id/MyButton" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button4" android:text="alignRight|above" android:layout_alignRight="@id/MyButton" android:layout_above="@id/MyButton" /> </RelativeLayout>
以下のように表示されます。