[안드로이드 스튜디오 강좌#6] 뷰와 뷰의 크기 속성 이해하기

! 목표

어플의 구성 요소가 되는 뷰와 뷰의 크기 속성을 이해해보자

 

1. 뷰의 속성

뷰(View)는 사용자의 눈에 보이는 화면의 구성요소들이다.

화면에 추가할 수 있느 모든것들이라고도 생각할 수 있다.

이런 뷰를 여러개 포함하고 있는 것을 뷰그룹(ViewGroup)이라고 한다.

 

 

뷰그룹을 뷰그룹안에 넣어서 다른 뷰와 동일하게 다룰수 있다.

 

한 뷰그룹을 또 다른 하나의 뷰가 담을 수 있는데 다른 뷰그룹이 이 뷰그룹을 담은 뷰를 뷰처럼 다룰 수 있다.

이런 관계는 Composite Pattern을 사용해 만들어졌다.

Composite Pattern은 뛰어난 확장성을 가졌다.

 

또, 뷰는 다른 뷰의 속성을 상속해 상속받은 뷰의 특성을 그대로 가질 수 있다.

예를 들어 버튼은 텍스트뷰를 상속해서 만들어서 텍스트뷰의 속성을 그대로 가지고 있다.

그래서 텍스트뷰의 레이아웃 파일을 열어 태그이름을 <TextView>에서 <Button>으로 변경하기만 하면 버튼으로 변경된다.

 

 

 

2. 위젯과 레이아웃으로 구별되는 뷰

뷰와 뷰그룹의 역할을 구분하기 위해

일반적인 컨트롤 역할을 하는 뷰를 위젯(Widget),

내부의 뷰를 포함하고 있으며, 그것들을 배치하는 역할을 하는 뷰그룹을 레이아웃(Layout)이라고 부른다.

• 버튼과 리니어 레이아웃의 계층도

레이아웃은 레이아웃이 담고 있는 위젯이 어디에 배치되어야 할지 정해준다.

 

 

3. 뷰의 크기 속성

뷰는 화면의 일정 영역을 차지하기 떄문에 모든 뷰는 반드시 크기 속성을 가져야 된다. 가지지 않으면 오류가 출력 된다.

XML 원본은 태그와 속성으로 구분되어 있다.

</시작 태그
	속성1 = '속성값1'
	속성2 = '속성값2'
</끝 태그>

ex) 화면에 글자를 보여주는 텍스트뷰

<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" />

'**<TextView'**로 시작해서 '/>'로 끝난 것을 확인할 수 있다.

뷰는 '/>' 기호만 붙여서 태그를 정의할 수 있지만,

레이아웃의 경우에는 안에 뷰가 들어가야 함으로 반드시 시작, 끝 태그를 분리해서 사용해야한다.

태그 안에 속성들은 모두 공백, 줄 바꿈으로 구별 된다.

 

* 코드 설명 *

-android: (=android에서 정의한 속성)

직접 정의했거나 외부 라이브러리(Third-party Library)를 사용했을 때 그 안에 정의 된 속성이면 다른 단어가 쓰일 수도 있다.

코드를 읽을 때 생략해도 된다.

 

-layout_width, layout_height (뷰와 폭과 높이를 설정)

 

가로, 세로 크기 값으로는

wrap_content : 뷰 내용물의 크기에 자동 맞춤

match_parent : 뷰를 담은 뷰 그룹의 여유 공간을 꽉 채움

숫자 지정 : 숫자로 크기 지정 (dp, px 단위 필수)

를 사용할 수 있다.

 

 

4. 버튼 크기 속성 변경

디자인 창에서 버튼을 클릭 후, Constraints-layout_#에서 크기 조절이 가능하다.

-wrap_content : 버튼의 내용물에 맞게 크기가 자동으로 결정

-(num)[dp] : 직접 사이즈를 넣어 크기 조절 가능

-match_parent : 제약 내에서 최대 크기로 설정

레이아웃의 종류에 따라서 동일 속성 값이라도 뷰에 적용되는 방식이 달라진다.

 

wrap_content : 버튼 내용물에 맞게 크기 조절

직접 숫자를 넣어 조절

제약 내에서 최대 크기로 설정한다.

 참고로, 양옆으로 제약이 있기 때문에 저 모양이 최대이다.

 

 

 

 

 

## 이 글은 허락을 받아 Do it 안드로이드 앱 프로그래밍을 참고해서 작성되었습니다.

공부를 하며 개인용으로 정리하는 것이기 때문에 틀린 부분이 있을 수도 있습니다.

도서에는 더 자세하고 알기 쉽게 설명이 되어 있어 도서를 참고하면서 공부하는 것을 추천드립니다.

도서 정보 : http://www.yes24.com/Product/Goods/15789466

Do it! 안드로이드 앱 프로그래밍

유투브 강의 : https://www.youtube.com/watch?v=nN4xnEcnjE8