RelativeLayoutクラス

android.view ＞ ViewGroupクラス

RelativeLayoutとは？

　状態:- 　閲覧数:1,845 　投稿日:2013-06-05 　更新日:2018-09-10 　

複数Viewを相対的に配置するレイアウトクラス


配置位置を「他オブジェクトとの想定座標によって指定」するレイアウト
・「ビューとの相対位置で指定する相対レイアウト」を作成する
<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" >



</RelativeLayout>


・レイアウト関連主要クラスの階層一覧

クラス構成

　閲覧数:433　投稿日:2013-06-12　更新日:2014-04-03　

親クラス



java.lang.Object
  ↳ android.view.View
     ↳ android.view.ViewGroup
        ↳ android.widget.RelativeLayout



直接子クラス


DialerFilter, TwoLineListItem

ネストクラス


・型の内部で宣言されたクラス「ネストしたクラス」
RelativeLayout.LayoutParams


XML属性一覧

　閲覧数:512　投稿日:2013-06-12　更新日:2014-04-03　

概要


android:gravity … XML属性
オブジェクトの配置方法を指定する属性
・「RelativeLayoutクラス」で定義
・「LinearLayoutクラス」でも定義されている

レイアウト例 … 相対基準が単数

　閲覧数:392　投稿日:2014-06-01　更新日:2014-06-22　


構成


・1つのRelativeLayoutの中に5つのButtonを配置

RelativeLayout
　┃
　┣Button
　┃ ├android:id="@+id/center"
　┃ ├android:layout_centerInParent
　┃ └android:text="☆"
　┃
　┣Button
　┃ ├android:layout_above="@+id/center"　… "☆"の上
　┃ ├android:layout_alignLeft="@+id/center" … "☆"の左端を基準　
　┃ └android:text="↑"
　┃
　┣Button
　┃ ├android:layout_below="@+id/center"　… "☆"の下
　┃ ├android:layout_alignLeft="@+id/center" "☆"の左端を基準
　┃ └android:text="↓"
　┃
　┣Button
　┃ ├android:layout_toLeftOf="@+id/center"　… "☆"の右
　┃ ├android:layout_alignTop="@+id/center" … "☆"の上端を基準とする
　┃ └android:text="←"
　┃
　┗Button
　　　├android:layout_toRightOf="@+id/center"　… "☆"の左
　　　├android:layout_alignTop="@+id/center" … "☆"の上端を基準とする
　　　└android:text="→"

コード


▼/res/layout/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

        android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:background="@android:color/darker_gray"

        android:padding="20dip">

        <Button

            android:id="@+id/center"

            android:layout_width="50dip"

                android:layout_height="50dip"

                android:layout_centerInParent="true"

                android:text="☆" />

        <Button

            android:id="@+id/avobe"

            android:layout_width="50dip"

                android:layout_height="50dip"

                android:layout_above="@+id/center"

                android:layout_alignLeft="@+id/center"

                android:text="↑" />

        <Button

            android:id="@+id/below"

            android:layout_width="50dip"

                android:layout_height="50dip"

                android:layout_below="@+id/center"

                android:layout_alignLeft="@+id/center"

                android:text="↓" />

        <Button

            android:id="@+id/left"

            android:layout_width="50dip"

                android:layout_height="50dip"

                android:layout_toLeftOf="@+id/center"

                android:layout_alignTop="@+id/center"

                android:text="←" />

        <Button

            android:id="@+id/right"

            android:layout_width="50dip"

                android:layout_height="50dip"

                android:layout_toRightOf="@+id/center"

                android:layout_alignTop="@+id/center"

                android:text="→" />

</RelativeLayout>


レイアウト例 … 相対基準が複数

　閲覧数:356　投稿日:2014-06-06　更新日:2014-06-22　



構成


・1つのRelativeLayoutの中に4つのButtonを配置

RelativeLayout
　┃
　┣Button
　┃ ├android:id="@+id/a"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_centerHorizontal="true"
　┃ ├android:layout_centerVertical="true"
　┃ └android:text="A"
　┃
　┣Button
　┃ ├android:id="@+id/b"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_alignTop="@+id/a" … Aの上端を基準
　┃ ├android:layout_toRightOf="@+id/a" … Aの右
　┃ └android:text="B"
　┃
　┣Button
　┃ ├android:id="@+id/c"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_alignLeft="@+id/b" … Bの上端を基準
　┃ ├android:layout_below="@+id/b" … Bの下
　┃ └android:text="C"
　┃
　┗Button
　　 ├android:id="@+id/d"
　　 ├android:layout_width="wrap_content"
　　 ├android:layout_height="wrap_content"
　　 ├android:layout_alignBottom="@+id/c" … Cの下端を基準
　　 ├android:layout_alignTop="@+id/b" … Bの上端を基準
　　 ├ android:layout_toRightOf="@+id/b"
　　 └android:text="D"



コード


▼/res/layout/activity_main.xml
<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"

    tools:context=".MainActivity" >



    <Button

        android:id="@+id/a"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerHorizontal="true"

        android:layout_centerVertical="true"

        android:text="A"

        android:textSize="16sp" />



    <Button

        android:id="@+id/b"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignTop="@+id/a"

        android:layout_toRightOf="@+id/a"

        android:text="B" />



    <Button

        android:id="@+id/c"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignLeft="@+id/b"

        android:layout_below="@+id/b"

        android:text="C" />



    <Button

        android:id="@+id/d"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignBottom="@+id/c"

        android:layout_alignTop="@+id/b"

        android:layout_toRightOf="@+id/b"

        android:text="D" />



</RelativeLayout>


レイアウト例 … 相対基準が複数

　閲覧数:435　投稿日:2014-06-16　更新日:2014-06-22　



構成


・1つのRelativeLayoutを3段で区切る

RelativeLayout
　┃
　┣TextView
　┃ ├android:id="@+id/textView01"
　┃ ├android:layout_width="wrap_content"
　┃ └android:text="会社名"
　┃
　┣EditText
　┃ ├android:id="@+id/editText01"
　┃ ├android:layout_width="match_parent"
　┃ └android:layout_toRightOf="@+id/textView01"
　┃
　┣TextView
　┃ ├android:id=@+id/textView02
　┃ ├android:layout_width="wrap_content"
　┃ ├android:text="住所"
　┃ ├android:layout_below="@+id/editText01"
　┃ └android:layout_alignBaseline="@+id/editText02" … の下端基準
　┃
　├EditText
　┃ ├android:id="@+id/editText02"
　┃ ├android:layout_width="match_parent"
　┃ ├android:layout_toRightOf=@+id/textView02
　┃ ├android:layout_below="@+id/textView01"
　┃ └android:layout_alignLeft="@+id/editText01" … の左端基準
　┃　
　┣TextView
　┃ ├android:id="@+id/textView03"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:text="担当者"
　┃ ├android:layout_below="@+id/editText02"
　┃ └android:layout_alignBaseline="@+id/editText03"
　┃　
　├EditText
　┃ ├android:id="@+id/editText03"
　┃ ├android:layout_width="match_parent"
　┃ ├android:layout_toRightOf="@+id/textView03"
　┃ ├android:layout_below="@+id/textView01"
　┃ └android:layout_alignLeft="@+id/editText01" … の左端基準
　┃
　┗Button
　　　├android:layout_width="match_parent"
　　　├android:layout_height="wrap_content"
　　　├android:text="登録"
　　　└android:layout_alignParentBottom="true"

android:layout_alignParentBottom
・親ビューの下辺中央に配置

コード


▼/res/layout/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:id="@+id/relativeLayout01"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:paddingTop="10dip"

    android:background="@android:color/white">

    <TextView

        android:id="@+id/textView01"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:textColor="#000000"

        android:text="会社名"

        android:layout_alignBaseline="@+id/editText01" />

    <EditText 

        android:id="@+id/editText01"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:singleLine="true"

        android:maxLength="50"

        android:layout_toRightOf="@+id/textView01"

        android:layout_marginLeft="10dip" />

    <TextView

        android:id="@+id/textView02"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:textColor="#000000"

        android:text="住所"

        android:layout_below="@+id/editText01"

        android:layout_alignBaseline="@+id/editText02" />

    <EditText

        android:id="@+id/editText02"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:singleLine="true"

        android:maxLength="50"

        android:layout_toRightOf="@+id/textView02"

        android:layout_below="@+id/editText01"

        android:layout_alignLeft="@+id/editText01" />

    <TextView

        android:id="@+id/textView03"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:textColor="#000000"

        android:text="担当者"

        android:layout_below="@+id/editText02"

        android:layout_alignBaseline="@+id/editText03" />

    <EditText 

        android:id="@+id/editText03"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:singleLine="true"

        android:maxLength="50"

        android:layout_toRightOf="@+id/textView03"

        android:layout_below="@+id/editText02"

        android:layout_alignLeft="@+id/editText01" />

    <Button

        android:id="@+id/button01"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:textColor="#000000"

        android:text="登録"

        android:layout_alignParentBottom="true" />

</RelativeLayout>


レイアウト例 … 相対基準が複数

　閲覧数:432　投稿日:2014-06-22　更新日:2014-07-01　



構成


・1つのRelativeLayoutの中に9つのButtonを配置

RelativeLayout
　┃
　┣Button
　┃ ├android:id="@+id/Button1"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_alignParentLeft="true" … trueの場合、このビューの左端は、親の左端に一致
　┃ ├android:layout_alignParentTop="true" … trueの場合、このビューの上端は、親の上端と一致
　┃ └android:text="1"
　┃
　┣Button
　┃ ├android:id="@+id/Button4"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_below="@+id/Button1" … 1の下
　┃ └android:text="4"
　┃
　┣Button
　┃ ├android:id="@+id/Button5"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_below="@+id/Button4" … 4の下
　┃ └android:text="5"
　┃
　┣Button
　┃ ├android:id="@+id/Button2"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_toRightOf="@+id/Button1" … 1の右
　┃ └android:text="2"
　┃
　┣Button
　┃ ├android:id="@+id/Button3"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_toRightOf="@+id/Button2" … 2の右
　┃ └android:text="3"
　┃
　┣Button
　┃ ├android:id="@+id/Button6"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_centerInParent="true" … 水平方向および垂直方向の位置が、親ビュー中央になるよう配置
　┃ └android:text="6"
　┃
　┣Button
　┃ ├android:id="@+id/Button7"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_alignParentLeft="true" … trueの場合、このビューの左端は、親の左端に一致
　┃ ├android:layout_alignParentBottom="true" … trueの場合、このビューの左端は、親の下端に一致
　┃ └android:text="7"
　┃
　┣Button
　┃ ├android:id="@+id/Button8"
　┃ ├android:layout_width="wrap_content"
　┃ ├android:layout_height="wrap_content"
　┃ ├android:layout_toRightOf="@+id/Button7" … 7の右
　┃ ├android:layout_alignParentBottom="true"
　┃ └android:text="8"
　┃
　┗Button
　 　 ├android:id="@+id/Button9"
　 　 ├android:layout_width="wrap_content"
　 　 ├android:layout_height="wrap_content"
　 　 ├android:layout_above="@+id/Button7" … 7の上
　 　 └android:text="9"

コード


▼/res/layout/activity_main.xml
<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=".MainActivity" >



    <!-- TODO: Button1 の右に 2 つのボタンを並べる -->

    <!-- TODO: Button1 の下に 2 つのボタンを並べる -->

    <Button

        android:id="@+id/Button1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_alignParentTop="true"

        android:text="1"/>

    <Button

        android:id="@+id/Button4"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_below="@+id/Button1"

        android:text="4"/>

    <Button

        android:id="@+id/Button5"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_below="@+id/Button4"

        android:text="5"/>

    <Button

        android:id="@+id/Button2"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_toRightOf="@+id/Button1"

        android:text="2"/>

    <Button

        android:id="@+id/Button3"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_toRightOf="@+id/Button2"

        android:text="3"/>



    <!-- TODO: Button6 を 画面中央に配置する -->

    <Button

        android:id="@+id/Button6"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerInParent="true"

        android:text="6"/>



    <!-- TODO: Button7 を画面左下に配置する -->

    <Button

        android:id="@+id/Button7"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_alignParentBottom="true"

        android:text="7"/>

    <!-- TODO: Button7 の右に 1 つボタンを並べる -->

    <Button

        android:id="@+id/Button8"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_toRightOf="@+id/Button7"

        android:layout_alignParentBottom="true"

        android:text="8"/>

    <!-- TODO: Button7 の上に 1 つボタンを並べる -->

    <Button

        android:id="@+id/Button9"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_above="@+id/Button7"

        android:text="9"/>

</RelativeLayout>


TableLayoutクラス

FrameLayoutクラス

コメント投稿(ログインが必要)



類似度ページランキング
順位 ページタイトル抜粋 ％
1 RelativeLayoutクラス 82
2 TableLayoutクラス 71
3 LinearLayoutクラス 69
4 AbsoluteLayoutクラス 65
5 FrameLayoutクラス 65
6 RelativeLayout.LayoutParamsクラス 60
7 AlertDialogクラス 58
8 TableRowクラス 57
9 DateUtilsクラス 55
10 ViewGroup.LayoutParamsクラス 52
11 LayoutInflater 52
12 AlertDialog.Builderクラス 51
13 Activityクラス 50
14 外部クラス (outer class) 50
15 ListViewクラス 50
16 ListActivityクラス 50
17 DatePickerDialogクラス 50
18 SimpleDateFormatクラス 50
19 Dateクラス 50
20 RecyclerViewクラス 50
2024/9/21 20:48 更新
週間人気ページランキング ／ 9-14 → 9-20
順位 ページタイトル抜粋 アクセス数
1 リソース | レイアウト 6
2 Android用語 2
2 「android:layout_alignLeft」と「android:layout_toLeftOf」の違い | レイアウト 2
2 プロセス | ガイド 2
3 ジェネリクスの歴史を振り返る 1
3 リソースID 1
3 uses-sdk ＜ manifest 1
3 java.text(Java) カテゴリー 1
3 ログイン 1
3 Known direct subclasses ／ Known indirect subclasses | Java 1
3 android:stretchColumns … XML属性 1
3 Androidにおける「コンポーネント」と「クラス」の関係 1
3 ジェネリクス | Java 1
3 ビルドツール | 環境構築 1
3 LinearLayoutクラス | Viewクラス 1
3 具体的な実装例 1
3 Contextから LayoutInflaterクラスを取得する 1
2024/9/21 1:01 更新