RelativeLayout(相対レイアウト) 概要 【Android基礎】

この記事は2012年12月2日に書かれたものです。内容が古い可能性がありますのでご注意ください。


相対レイアウト(RelativeLayoutクラス)は、子のビューを相対位置で表示するレイアウトクラスです。

 

子要素は、兄弟の要素に対しての相対位置(対象の要素の左や下など) 、またはRelativeLayout領域に対しての相対位置(底辺、中心の左に揃えるなど)を指定することができます。

要素は与えられた順番にレンダリングされるため、最初の要素がスクリーンの中心の場合、その他の要素はその中心要素に対して相対的に並べていくことになる。

 

XMLでレイアウト定義する場合は、基準となる要素を特定するためにandroid:id属性が使われるため、基準となるビューには必ずandroid:id属性を定義しておく必要がある。参照設定する際には、@id/hogehoge構文を使用する。

RelativeLayoutクラスは入れ子を最小限に抑えるという観点からユーザーインターフェースを設計する上でとても強力であり実用性に優れている。

 

以前はAndroidプロジェクトを作成した際にレイアウトファイルとしてmain.xmlが自動作成されLinearLayoutが使われていたが、Android SDK R20からはactivity_main.xmlが自動作成されRelativeLayoutが使われるようになっている。

 

相対位置の定義には以下の属性を使います。

属性名 概要
android:layout_alignBaseline @id/xxx 指定したViewのベースラインに合わせて配置する。
android:layout_above @id/xxx 指定したViewの上部とこのViewの下部を合わせるように配置する。
android:layout_below @id/xxx 指定したViewの下部とこのViewの上部を合わせるように配置する。
android:layout_toLeftOf @id/xxx 指定したViewの左端とこのViewの右端を合わせるように配置する。
android:layout_toRightOf @id/xxx 指定したViewの右端とこのViewの左端を合わせるように配置する。
android:layout_alignRight @id/xxx 指定したViewの右部とこのViewの右部を合わせるように配置する。
android:layout_alignTop @id/xxx 指定したViewの上部とこのViewの上部を合わせるように配置する。
android:layout_alignButtom @id/xxx 指定したViewの下部とこのViewの下部を合わせるように配置する。
android:layout_alignLeft @id/xxx 指定したViewの左部とこのViewの左部を合わせるように配置する。
android:layout_alignParentTop true/false 親の上辺とこのViewの上辺を合わせるように配置する。
android:layout_alignParentButtom true/false 親の下辺とこのViewの下辺を合わせるように配置する。
android:layout_alignParentLeft true/false 親の左辺とこのViewの左辺を合わせるように配置する。
android:layout_alignParentRight true/false 親の右辺とこのViewの右辺を合わせるように配置する。
android:layout_alignWithParentIfMissing true/false trueが指定された場合、layout_toLeftOfやlayout_toTopOfなどで指定する対象となるViewが見つからなかったときに親Viewが対象のViewとして指定される。
android:layout_centerHorizontal true/false このViewの水平配置を親Viewの幅に対して中央となるように配置する。
android:layout_centerVertical true/false このViewの上下配置を親Viewの幅に対して中央となるように配置する。
android:layout_centerInParent true/false このViewを親の中央に配置する。

 

 

TextViewが全ての基準となっています。EditTextはTextViewのbelow位置に、OKボタンはEditTextのbelow位置かつ右寄せ、CancelボタンはOKボタンの左位置かつ同じ高さに配置されています。

device-2012-12-02-130647

<?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:padding="10px" >
 
    <TextView
        android:id="@+id/label"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Type here:" />
 
    <EditText
        android:id="@+id/entry"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/label" />

    <Button
        android:id="@+id/ok"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_below="@id/entry"
        android:layout_marginLeft="10dp"
        android:text="OK" />
 
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@id/ok"
        android:layout_toLeftOf="@id/ok"
        android:text="Cancel" />

</RelativeLayout>

基礎

[Android 基礎] リニアレイアウト LinearLayout概要
[Android 基礎] 相対レイアウト RelativeLayout概要

とっても簡単なAndroidサンプルアプリ集

【Button・電話・ブラウザ】
【EditText・TextView・Button】
【Spinner・TextView】
【RadioButton・Toast 単体のRadioGroup】

Androidサンプルアプリ集 第5弾!

【RadioButton・Toast 複数のRadioGroup】
【Spinnerの項目をJavaで記述(MainActivity.javaに記述)・Toast】
【ProgressDialog・EditTextのnull(未入力)を取得・Button】
【ListView・配列】

Android TIPS

Android TIPS 旧バージョンで開発環境を構築する
Android TIPS 日本アンドロイドの会 2012年7月定例会
Android TIPS 開発環境の構築①
Android TIPS 開発環境の構築②

Android TIPS 開発環境の構築③
Android TIPS Toastの表示時間を長く/短くする
Android TIPS HelloWorldプログラムの作成・実行
Android TIPS HelloWorldプログラムについて

Android TIPS アプリケーション開発 初級(activity_main.xmlについて)
Android TIPS アプリケーション開発 初級(strings.xmlについて)
Android TIPS アプリケーション開発 初級(ローカライズ)
Android TIPS ボタン(Button)とイベントリスナー

Android TIPS onClick(View) はスーパークラスのメソッドをオーバーライドする必要があります
Android TIPS フラグメントでタブレット用レイアウトを作る
Android TIPS DialogFragmentをつかってAlertDialogを表示する
Android TIPS DialogFragmentをつかってAlertDialogを表示する(その2)

Android TIPS タブレットとスマートフォンに対応したアプリケーション
Android TIPS エミュレータが起動しない(PANIC: Could not open: C:Users…)

ADT Bundle (Android 新開発環境)

最新のAndroid開発環境【adt-bundle】のまとめ
ADT Bundleを使って開発環境を構築する(Android SDK revision 21)
Eclipseを日本語化する(Pleiadesプラグイン使用)

Android講座 体験レポート

Android講座 体験レポート 第1回
Android講座 体験レポート 第2回
Android講座 体験レポート 第3回
Android講座 体験レポート 第4回

Android講座 体験レポート 第5回
Android講座 体験レポート 第6回
Android講座 体験レポート 第7回
Android講座 体験レポート 第8回

Android講座 体験レポート 第9回
Android講座 体験レポート 第10回
Android講座 体験レポート 第11回
Android講座 体験レポート 最終回

  • このエントリーをはてなブックマークに追加

PAGE TOP