본문 바로가기
모바일/Android View & Layout

[Android] 컴포넌트를 겹쳐서 배치할 수 있는 FrameLayout, RelativeLayout

by drCode 2021. 4. 19.
728x90
반응형

 

LinearLayout은 컴포넌트를 겹쳐서 배치할 수 없다.

FrameLayout과 RelativeLayout은 가능하다.

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#2196F3"
            android:text="hello"
            android:textSize="30dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#673AB7"
            android:text="hello"
            android:textSize="30dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#E91E63"
            android:text="hello"
            android:textSize="30dp" />

    </LinearLayout>

    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp">

        <TextView
            android:layout_width="300dp"
            android:layout_height="300dp"
            android:background="#2196F3"
            android:text="hello"
            android:textSize="30dp" />

        <TextView
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:background="#673AB7"
            android:text="hello"
            android:textSize="30dp" />

        <TextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:background="#E91E63"
            android:text="hello"
            android:textSize="30dp" />

    </FrameLayout>

</LinearLayout>

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:background="#3f51B5"
        />

    <TextView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:background="#4CAF50"
        />

    <TextView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#E91E63"
        />

</RelativeLayout>

 

 

RelativeLayout 실습 >>> 중첩 사각형 만들기

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:background="#ff0000"
        android:layout_centerInParent="true"
        />

    <TextView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:background="#FFFF00"
        android:layout_centerInParent="true"
        />

    <TextView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#0000FF"
        android:layout_centerInParent="true"/>



</RelativeLayout>

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true">

        <TextView
            android:layout_width="300dp"
            android:layout_height="300dp"
            android:layout_gravity="center"
            android:background="#F44336" />

        <TextView
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:layout_gravity="center"
            android:background="#4CAF50" />

        <TextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_gravity="center"
            android:background="#FFEB3B" />

    </FrameLayout>
</RelativeLayout>
728x90
반응형

댓글