[Do it! 안드로이드 앱 프로그래밍 #2] 안드로이드 스튜디오와 친숙해지기

02 안드로이드 스튜디오와 친숙해지기

 

02-1 안드로이드 스튜디오 제대로 익히기

Ctrl + Tap: 스위처(Switcher), 윈도우의 Alt + Tap과 같이 현재 열려 있는 창을 빠르게 이동할 수 있게 해준다.

Crtl + Q: API 문서 정보를 띄워준다.

Ctrl + P: 파라미터에 대한 정보를 띄워준다.

Ctrl + Shoft + F: 코드를 검색하는 창을 띄워준다.

 

02-2 뷰와 뷰의 크기 속성 이해하기

뷰의 속성

뷰(View)는 화면 안에 들어가는 각각의 요소를 말하며 일반적으로 컨트롤이나 위젯이라고 불린다. 이러한 뷰를 여러 개 포함하고 있는 것을 뷰그룹(ViewGroup)이라고 한다.

뷰그룹은 뷰를 상속했기 때문에 뷰의 속성을 모두 물려받았다. 뷰그룹 역시 하나의 뷰라고 했을 때 또 다른 뷰그룹이 이 뷰그룹을 뷰처럼 다룰 수 있다. 이러한 관계는 디자인 패턴 중 컴포지트 패턴(Composite Pattern)을 사용하여 만들어진 것이다.

 

 

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

뷰 중에서 화면에 보이면서 일반적인 컨트롤 역할을 하는 것을 위젯(Widget)이라고 부르며, 뷰그룹 중에서 내부에 뷰들을 포함하고 있으면서 그것들을 배치하는 역할을 하는 것을 레이아웃(Layout)이라고 부른다.

 

 

뷰의 크기 속성

뷰는 화면의 일정 영역을 차지하기 때문에 모든 뷰는 반드시 크기 속성을 가지고 있어야 한다.

속성	설명
layout_width	가로 크기
layout_height	세로 크기

속성 값	설명
wrap_content	뷰에 들어있는 내용물의 크기에 자동 맞춤
match_parent	뷰그룹의 여유 공간을 꽉 채움
숫자로 크기 지정	숫자를 사용해 크기 지정 (dp, px와 같은 단위 필수)

 

02-3 레이아웃 기초 익히기

제약 조건 이해하기

안드로이드 스튜디오에서는 기본적인 레이아웃을 제약 레이아웃(Constraint Layout)으로 자동 설정한다.

제약 레이아웃의 가장 큰 특징은 뷰의 위치를 결정할 때 제약 조건(Constraint)을 사용한다는 것이다. 제약 조건이란 뷰가 레이아웃 안의 다른 요소와 어떻게 연결되는지 알려주는 것으로, 뷰의 연결점(Anchor Point)과 대상(Target)을 연결한다.

구분	연결점이 될 수 있는 것
1	위쪽(Top), 아래쪽(Bottom), 왼쪽(Left), 오른쪽(Right)
2	가로축의 가운데(Center X), 세로축의 가운데(Center Y)
3	베이스라인(Baseline) → 텍스트를 보여주는 뷰인 경우에만 적용됨

구분	대상이 될 수 있는 것
1	같은 부모 레이아웃 안에 들어 있는 다른 뷰의 연결점
2	부모 레이아웃의 연결점
3	가이드라인(Guideline)

연결점과 대상과의 거리를 마진(Margin)이라고 부른다.

 

 

화면 가운데에 뷰 배치하기

뷰가 가운데를 기준으로 한쪽으로 얼마나 치우쳐 있는지 나타내는 것을 바이어스(Bias)라고 한다.

 

사각형 안쪽의 선은 뷰의 layout_width와 layout_height가 어떻게 설정되었는지 표시한다.

구분	구불구불한 선	화살표	직선
의미	부모의 여유 공간을 채움	뷰의 내용물 크기에 맞춤	숫자를 사용해 크기 지정
설정값	match_constraint 또는 0dp	wrap_content	지정한 값

여기서 여유 공간(Available Space)이란 해당 뷰가 차지할 수 있는 공간을 의미한다.

 

 

가이드라인 사용하기

가이드라인(Guideline)은 여러 개의 뷰를 일정한 기준선에 정렬할 때 사용한다. 뷰처럼 화면에 추가할 수 있지만 그 크기가 0이고 화면에 보이지 않기 때문에 레이아웃에서 없는 것으로 간주된다.

 

app > res > layout > 우클릭 > New > Layout resource file > File name 입력 > OK

가이드라인(Guideline) 사용하기

 

 

XML 원본에 추가된 속성 확인하기

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

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_begin="50dp" />
        
    // 중략

-<?xml version="1.0" encoding="utf-8"?>: 이 파일이 XML 형식으로 된 것임을 알려준다.

 

-androidx.constraintlayout.widget.ConstraintLayout: 화면 전체를 감싸고 있는 레이아웃이다.

위젯이나 레이아웃이 안드로이드 기본 API에 포함되어 있다면 그 위젯이나 레이아웃의 이름만 입력하면 된다. 외부 라이브러리에서 불러온 것이라면 패키지 이름까지 같이 입력해야 한다. ConstraintLayout은 안드로이드 SDK에 나중에 추가되면서 외부 라이브러리로 분류되어 있다. 그러므로 패키지 이름(androidx.constraintlayout.widget) + 태그(ConstraintLayout)의 형태이다.

 

-xmlns와 접두어(Prefix)

접두어	의미
xmlns:android	안드로이드 기본 SDK에 포함되어 있는 속성을 사용
xmlns:app	프로젝트에서 사용하는 외부 라이브러리에 포함되어 있는 속성을 사용 app라는 단어는 다른 것으로 바꿀 수 있음
xmlns:tools	안드로이드 스튜디오의 디자이너 도구 등에서 화면에 보여줄 때 사용 이 속성은 앱이 실행될 때는 적용되지 않고 안드로이드 스튜디오에서만 적용됨

 

-android:id: 뷰를 구분하는 구분자 역할을 한다.

id 속성의 용도는 크게 두 가지로 나눌 수 있다.

① XML 레이아웃 파일 안에서 뷰를 구분할 때

② XML 레이아웃 파일에서 정의한 뷰를 자바 소스 파일에서 찾을 때

 

*제약 레이아웃에서 하나의 뷰를 다른 뷰와 연결할 때 사용하는 XML 속성 규칙

layout_constraint[소스 뷰의 연결점]_[타깃 뷰의 연결점]="[타깃 뷰의 id]"

Ex) layout_constraintTop_toBottomOf="@+id/button"

 

-android:orientation: 가로 또는 세로 중 어느 방향인지를 지정한다. 가이드라인의 필수 속성이다.

 

 

크기를 표시하는 단위 

뷰의 폭과 높이는 일반적으로 match_parent와 wrap_content 값을 지정하는 방식으로 사용하는데 그 이유는 단말마다 해상도나 화면의 크기가 달라도 전체 화면을 기준으로 뷰를 배치할 수 있기 때문이다.

뷰의 폭과 높이를 정숫값으로 지정하면서도 픽셀 단위인 px가 아니라 dp나 sp와 같은 단위를 사용하면 해상도가 다른 단말에서도 뷰의 크기를 비슷하게 보이도록 만들 수 있다.

단위	단위 표현	설명
px	픽셀	화면 픽셀의 수
dp 또는 dip	밀도 독립적 픽셀 (density independent pixel)	160dpi 화면을 기준으로 한 픽셀
sp 또는 sip	축척 독립적 픽셀 (scale independent pixel)	텍스트 크기를 지정할 때 사용하는 단위
in	인치	1인치로 된 물리적 길이
mm	밀리미터	1밀리미터로 된 물리적 길이
em	텍스트 크기	글꼴과 상관없이 동일한 텍스트 크기 표시