본문 바로가기
Android

[안드로이드/Layout] FrameLayout 프레임 레이아웃

by nanee_ 2021. 12. 21.
728x90
반응형
SMALL

<FrameLayout>

: 부모가 될 수 있는 태그로, 화면들을 겹치게 할 수 있는 태그이다.

 

자식요소의 순서로 제일 아래에 위치한 태그가 맨 위로 올라오게 된다.

 

겹치는 순서를 조정하기 위해 z-index 라는 개념이 필요하다.

 

z-index

: 화면의 순서를 값으로 표현할 수 있는 속성으로, 값이 높을수록 화면의 맨 위에 위치하게 된다.

 

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

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

        <TextView
            android:layout_width="300dp"
            android:layout_height="300dp"
            android:background="@color/purple_200"
            android:text="hello" />

        <TextView
            android:background="#86FCA0"
            android:text="hello"
            android:layout_width="200dp"
            android:layout_height="200dp"/>

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

    </FrameLayout>

</LinearLayout>

 

안드로이드 스튜디오 화면의 오른쪽 아래에 보면 Layout Inspector 탭이 있다.

 

가상 디바이스를 실행하고 이 탭을 누르게되면

아래와 같이 view들의 층(layer)을 확인할 수 있다.

 

LinearLayout 의 자식뷰들은 z-index 속성이 없어서

겹쳐지지도, 층이 생기지도 않고 평면으로 나타나진다.

 

반면, FrameLayout 에서는

보라색view가 맨 밑,

초록색view가 가운데,

노란색view가 맨 위에

있는 것을 확인할 수 있다.

 

 

 

 

 

728x90
반응형
LIST