android RelativeLayoutまとめ


# RelativeLayoutについて
指定した属性でView同士の位置関係から相対的に配置する。
が、文字だけではかなりわかりにくいのでスクショと一緒に見てみる。
ちなみになにも属性を指定しないと左上に配置され、コードの下にあるものほど上に重ねるように表示される。

属性は大まかに

- 親となるRelativaLayoutを基準に位置を決める属性
- 指定したidのViewを基準に位置を決める属性
- その他

の3種類がある

## 親となるRelativaLayoutを基準に位置を決める属性
デフォルトとするコードと配置は以下の通りである。

```layout_alignParent~系
<?xml version="1.0" encoding="utf-8"?>
<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:paddingLeft="64dp"
    android:paddingRight="64dp"
    android:paddingTop="16dp"
    android:paddingBottom="16dp"
    tools:context="*****">

    <ImageView
        android:id="@+id/*****"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:src="@drawable/*****" />

</RelativeLayout>

```
![default1.png](https://qiita-image-store.s3.amazonaws.com/0/73973/bb68de08-951f-79f8-5f08-60ea8c1d9b26.png "default1.png")


### Layout_alignParentTop
trueで親に対して上寄せで配置
![alignParentTop.png](https://qiita-image-store.s3.amazonaws.com/0/73973/a9ff58b9-b838-a7e2-3324-247ae23222e4.png "alignParentTop.png")


### Layout_alignParentBottom
trueで親に対して下寄せで配置
![alignParentBottom.png](https://qiita-image-store.s3.amazonaws.com/0/73973/ed7e7a64-99dc-8cda-3e19-fe44e0cb20c3.png "alignParentBottom.png")


### Layout_alignParentLeft
true : 親に対して左寄せで配置
![alignParentLeft.png](https://qiita-image-store.s3.amazonaws.com/0/73973/f8caffb0-4b11-6d54-bf95-22f44441d951.png "alignParentLeft.png")


### Layout_alignParentStaut
Layout_alignParentLeftと同じ(APIのversionが古いので非推奨)

### Layout_alignParentRight
true : 親に対して右寄せで配置
![alignParentRight.png](https://qiita-image-store.s3.amazonaws.com/0/73973/1fce46f4-4323-d846-230a-cdbe6c39427f.png "alignParentRight.png")

### Layout_alignParentEnd
Layout_alignParentRightと同じ(APIのversionが古いので非推奨)

### Layout_centerHorizontal
true : 親に対して水平方向中央寄せで配置
![centerHorizontal.png](https://qiita-image-store.s3.amazonaws.com/0/73973/9ab3ad10-2070-41e2-4522-d5722ce17847.png "centerHorizontal.png")

### Layout_centerVertical
true : 親に対して垂直方向中央寄せで配置
![centerVertical.png](https://qiita-image-store.s3.amazonaws.com/0/73973/e54c093d-4a4d-8486-f640-4a8bb0026711.png "centerVertical.png")

### Layout_alignInParent
true : 親に対して水平垂直方向中央寄せで配置
![centerInParent.png](https://qiita-image-store.s3.amazonaws.com/0/73973/09edbb43-c1a7-6d88-8608-5265d21db8e5.png "centerInParent.png")

## 指定したidのViewを基準に位置を決める属性
デフォルトとするコードと配置は以下の通りである。

```

<?xml version="1.0" encoding="utf-8"?>
<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:paddingLeft="64dp"
    android:paddingRight="64dp"
    android:paddingTop="16dp"
    android:paddingBottom="16dp"
    tools:context="*****">

    <ImageView
        android:id="@+id/*****1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:gravity="center"
        android:layout_centerInParent="true"
        android:src="@drawable/*****" />
        
    <ImageView
        android:id="@+id/*****2"
        android:layout_width="44dp"
        android:layout_height="44dp"
        android:src="@drawable/*****"
        android:layout_hoge="@+id/*****1" />

</RelativeLayout>
```
![default2.png](https://qiita-image-store.s3.amazonaws.com/0/73973/2f200981-5050-b85b-64a8-316d0c614ebe.png "default2.png")


### Layout_alignTop
指定したidのViewの上端と対象のViewの上端を揃えて配置
![alignTop.png](https://qiita-image-store.s3.amazonaws.com/0/73973/58b63608-e77b-d987-6dab-c4b5602458da.png "alignTop.png")

### Layout_alignBottom
指定したidのViewの下端と対象のViewの下端を揃えて配置
![alignBottom.png](https://qiita-image-store.s3.amazonaws.com/0/73973/c9ec99bc-f78f-4f1c-e407-68ec6ea13aa6.png "alignBottom.png")

### Layout_alignLeft
指定したidのViewの左端と対象のViewの左端を揃えて配置
![alignLeft.png](https://qiita-image-store.s3.amazonaws.com/0/73973/0bfbfdb8-e468-36cb-4f2f-aceb534bdef9.png "alignLeft.png")


### Layout_alignStaut
Layout_alignLeftと同じ(APIのversionが古いので非推奨)

### Layout_alignRight
指定したidのViewの右端と対象のViewの右端を揃えて配置
![alignRight.png](https://qiita-image-store.s3.amazonaws.com/0/73973/a74a5683-1dca-9514-8fbb-37840f420e1d.png "alignRight.png")

### Layout_alignEnd
Layout_alignRightと同じ(APIのversionが古いので非推奨)


### Layout_alignBaseline
指定したidのViewのベースラインと対象のViewのベースラインを揃えて配置
![alignBaseLine.png](https://qiita-image-store.s3.amazonaws.com/0/73973/55816f58-0164-b3a5-2782-52ed628e439c.png "alignBaseLine.png")


### layout_toLeftOf
指定したidのViewに対して左側に配置
![toLeftOf.png](https://qiita-image-store.s3.amazonaws.com/0/73973/a01bb51f-ac5b-5e92-9bd9-400742c49ed9.png "toLeftOf.png")


### layout_toRightOf
指定したidのViewに対して右側に配置
![toRightOf.png](https://qiita-image-store.s3.amazonaws.com/0/73973/11effb16-15db-aaed-6888-33ef95403bbf.png "toRightOf.png")


### layout_toStartOf
指定したidのViewに対して左側に配置(APIのversionが古いので非推奨)

### layout_toEndOf
指定したidのViewに対して右側に配置(APIのversionが古いので非推奨)

### layout_above
指定したidのViewの上端と対象のViewの下端を揃えて配置
![above.png](https://qiita-image-store.s3.amazonaws.com/0/73973/5e1ad1dc-7e71-ec96-c74a-7fe9d131ab76.png "above.png")


### layout_below
指定したidのViewの下端と対象のViewの上端を揃えて配置
![below.png](https://qiita-image-store.s3.amazonaws.com/0/73973/cfbea610-8ea9-4ce3-555a-e3bd98b78dda.png "below.png")


## その他


### layout_alignWithParentMissing
true : 他の属性で指定したidのViewが存在しない場合は親のViewに対して効果を適用させる

### ignoreGravity

指定したidのViewはgravityで指定した効果が適用されないようになる

-------

主な属性は以上です。
これらとmargin, paddingをいい感じに組み合わせてすっきりとしたコードを書きたいものですね。


# 参考

- https://developer.android.com/guide/topics/ui/layout/relative.html
- http://qiita.com/yysk/items/c686153b39d32571d1bd