1. 뷰(View) 란?

뷰는 안드로이드 디바이스의 화면을 구성하는 모든 UI(User Inteface) 구성요소를 말한다. 뷰를 여러 개 묶어놓은 클래스(class)를 뷰그룹이라 하며, 뷰그룹은 뷰를 상속하기때문에 하나의 뷰처럼 다룰 수 있으며, 뷰 클래스의 모든 속성을 가진다.

view-viewgroup

뷰들 중에서 사용자의 눈에 보이는 컨트롤의 역할을 하는 뷰를 일반적으로 위젯(widget)이라고 부른다.

뷰그룹 중에서 내부에 여러개의 뷰들을 규칙에 맞게 배치하기 위해 사용하는 레이아웃(Layout)이란 것이 있다.

뷰들 중 가장 대표적인 것으로는 텍스트뷰(TextView)와 버튼(Button)이 있다. 또한 뷰그룹의 예인 레이아웃들 중 대표적인 레이아웃으로는 리니어 레이아웃(LinearLayout)이란 것이 있다. 이들의 계층도는 다음과 같이 그려진다.

views

레이아웃은 하나의 뷰와 같으므로 레이아웃 안에 또다른 레이아웃이 들어갈 수도 있다.

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">
    </LinearLayout>
</LinearLayout>

위 XML 코드는 하나의 LinearLayout 안에 두 개의 LinearLayout이 추가된 것이다. 그러면 아래의 그림과 같이 레이아웃이 나뉘고, 각각의 레이아웃 안에 뷰들을 배치할 수 있게 된다.

viewgroup-viewgroup

 
 

2. 뷰의 크기 속성

모든 뷰는 화면에서 차지할 크기 속성을 가진다. 크기 속성이 정의되지 않으면 이는 잘못된 XML 코드이며, 에러를 발생시킨다.

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

위 XML 코드는 ConstraintLayout이라는 레이아웃 안에 텍스트뷰(TextView) 하나를 추가한 것이다. ConstraintLayout도 하나의 뷰로서 폭(layout_width)와 높이(layout_height)의 크기 속성을 가지며, 텍스트뷰 역시 마찬가지이다.

 
※ 'android:' 의 의미

XML 코드에서 'android:'는 안드로이드의 기본 API에서 정의한 속성이란 의미이다.

 
다시 본론으로 돌아와, layout_widthlayout_height 속성의 값은 다음과 같은 형태들 중 하나로 지정할 수 있다.

  1. wrap_content : 뷰의 내용물에 따라 자동으로 맞춤

  2. match_parent(match_constraint) : 남은 여유 공간 채우기

  3. 숫자 : 특정 크기를 사용자가 지정

 
android:layout_width=\"wrap_content\"

android:layout_height=\"wrap_content\"

 
wrapcontent
wrapcontent

wrap_content 속성은 내용물의 크기에 따라 적절하게 크기를 알아서 조절한다.

 
android:layout_width="match_parent"

android:layout_height="wrap_content"

wrapcontent

layout_width(폭) 속성을 match_parent로 하니 남은 여유공간을 다 채운다.

 

+ Recent posts