FrameLayoutを使ってレイアウトを重ねる方法(位置指定もOK)

LinearLayoutで画面のオブジェクトを配置していくと、オブジェクト同士を重ねることはできない。

Androidの画面レイアウトは、Wordの文章に図を貼り付けた時のように、オブジェクト同士が干渉しないよう自動調整される。

これはこれで便利なのだが、ちょっとレイアウトを工夫しようと思ったらなかなか上手くいかない場合がある。

 

そこで、ビューを重ねて配置するのがFrameLayout。このレイアウトは最もシンプルなレイアウトと言われており、中のオブジェクトをとにかく左上に配置する。例えば、タグ内に３つのオブジェクトがあれば、３つとも左上に重ねて表示される。他のレイアウトとは異なり、位置を指定することもできない。それ故に、何のためのレイアウトか良く分からないという意見も。

 

私も当初、「使えないヤツ」と思っていたけど、そうでもないことが判明。FrameLayout内にLinearLayoutを配置すれば、その中のオブジェクトWidgitはちゃんと位置指定できる。

 

例えばこんな感じ。

 

 

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

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

  android:orientation="vertical"

  android:layout_width="fill_parent"

  android:layout_height="fill_parent">

 

    <FrameLayout android:layout_width="fill_parent"

      android:id="@+id/frameLayout1"

      android:layout_height="wrap_content">

        <LinearLayout android:layout_width="fill_parent"

          android:id="@+id/linearLayout1"

          android:layout_height="fill_parent"

          android:orientation="vertical">

            <Button android:layout_width="fill_parent"

              android:id="@+id/button1"

              android:text="Button"

              android:layout_height="wrap_content">

            </Button>

            <Button android:layout_width="fill_parent"

              android:id="@+id/button2"

              android:text="Button"

              android:layout_height="wrap_content">

            </Button>

            <Button android:layout_width="fill_parent"

              android:id="@+id/button3"

              android:text="Button"

              android:layout_height="wrap_content">

            </Button>

        </LinearLayout>

        <LinearLayout android:layout_width="fill_parent"

          android:id="@+id/linearLayout2"

          android:layout_height="fill_parent"

          android:orientation="vertical">

            <TextView android:text="TextView"

              android:id="@+id/textView1"

              android:layout_marginLeft="100dp"

              android:layout_marginTop="70dp"

              android:textSize="30sp"

              android:textColor="#FFFF0000"

              android:layout_width="wrap_content"

              android:layout_height="wrap_content">

            </TextView>

        </LinearLayout>

    </FrameLayout>

 

</LinearLayout>

 

これで、下のようにボタンとテキストを重ねて表示できる。