오늘은 레이아웃에 대한 정리를 해보겠습니다.
1. 레이아웃의 종류
1) Linear Layout
리니어 레이아웃은 뷰객체를 가로혹은 세로 방향으로 나열하는 레이아웃 이다.
-
android:orientation 속성은 방향을 지정하는 속성으로 속성값으로는 vertical 혹은 horizontal이 있다.
-
layout_weight 속성은 여백 자동 확장 속성으로 리니어 레이아웃에서 뷰가 차지하는 영역의 크기를 설정해 준다. 이때 width를 0dp로 설정해주면 weight에서 설정한 만큼 디바이스의 크기에 맞게 width의 여백을 자동으로 확장하여 화면을 구성한다.
-
gravity는 정렬을 위한 속성으로 뷰 영역내에서 뷰의 컨텐츠를 정렬한다.
-
layout_gravity는 뷰를 부모의 영역내에서 정렬한다.
2) Relative Layout
뷰의 상대위치로 정렬을 하는 레이아웃으로 속성을 이용해 방향과 align을 지정한다.
•android:layout_above : 기준이 되는 View 의 윗부분에 배치
•android:layout_below : 기준이 되는 View 의 아래 부분에 배치
•android:layout_toLeftOf : 기준이 되는 View 의 왼쪽에 배치
•android:layout_toRightOf : 기준이 되는 View 의 오른쪽에 배치
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/testImage"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/logo_1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello"
android:layout_toRightOf="@id/testImage"/>
</RelativeLayout>align 속성
•android:layout_alignTop : 기준 View 와 윗부분을 정렬
•android:layout_alignBottom : 기준 View 와 아랫부분을 정렬
•android:layout_alignLeft : 기준 View 와 왼쪽을 정렬
•android:layout_alignRight : 기준 View 와 오른쪽을 정렬
•android:layout_alignBaseline : 기준 View 와 텍스트 기준선을 정렬
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/testImage"/>
<TextView
android:id="@+id/text1“ android:text="Hello"
android:layout_toRightOf="@id/testImage"/>
<TextView
android:text="World"
android:layout_below="@id/text1"
android:layout_alignLeft="@id/text1"/>
</RelativeLayout>부모 뷰를 기준으로 정렬하기위한 속성
•android:layout_alignParentTop : 부모의 윗부분에 View 의 상단을 위치
•android:layout_alignParentBottom : 부모의 아랫부분에 View 의 하단을 위치
•android:layout_alignParentLeft : 부모의 왼쪽에 View 의 왼쪽을 위치
•android:layout_alignParentRight : 부모의 오른쪽에 View 의 오른쪽을 위치
•android:layout_centerHorizontal : 부모의 가로방향 중앙에 View 를 위치
•android:layout_centerVertical : 부모의 세로방향 중앙에 View 를 위치
•android:layout_centerInParent : 부모의 가로, 세로 중앙에 View 를 위치
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/testImage"
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@drawable/logo_1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello"
android:layout_alignBottom="@id/testImage"
android:layout_alignParentRight="true"/>
</RelativeLayout>3) FrameLayout
뷰를 겹쳐 출력시키는 레이아웃이다. 동일 위치에 여러 뷰르르 겹치게 출력한 후 한순간에 하나의 뷰만 출력하도록 한다. 보통 탭 레이아웃을 사용할때 프레임 레이아웃을 많이 사용한다.
4) GridLayout
- Row, Column 구조의 테이블 화면을 만들기 위한 레이아웃
- orientation 속성을 이용해 뷰의 배치 방향 지정
- rowCount 혹은 columnCount 속성을 이용해 자동 개행 지정
- 스팬 속성을 통해서 그리드레이아웃 내의 뷰들의 영역을 조정할 수 있다.
5) ConstraintLayout
androidx 에서 제공하는 레이아웃
