Kong돌이의 코딩이야기

Android Studio XML 레이아웃 정리 본문

코딩이야기/안드로이드

Android Studio XML 레이아웃 정리

Kong돌이 2021. 8. 19. 18:37
728x90

 안드로이드에서 제공하는 5가지 대표적인 레이아웃

레이아웃 이름 설 명
제약 레이아웃
(ConstraintLayout)
- 제약조건 (Constraint) 기반 모델
- 연결선을 제약 조건으로 하여 화면을 구성하는 방법
- 안드로이드 스튜디오에서 자동으로 설정하는 디폴트 레이아웃
리니어 레이아웃
(LinearLayout)
- 박스(BOX) 모델
- 한 쪽 방향으로 차례대로 뷰를 추가하며 화면을 구성하는 방법
- 뷰가 차지할 수 있는 사각형 영역을 담당
상대 레이아웃
(RelativeLayout)
- 규칙(Rule) 기반 모델
- 부모 컨테이너나 다른 뷰와의 상대적 위치로 화면을 구성하는 방법
- 제약 레이아웃을 사용하게 되면서 상대 레이아웃은 권장하지 않음
프레임 레이아웃
(FrameLayout)
- 싱글(Single) 모델
- 가장 상위에 있는 하나의 뷰 또는 뷰그룹만 보여주는 방법
- 여러 개의 뷰가 들어가면 충접하여 쌓게 되며 가장 단순하지만 여러 개의 뷰를 중첩한 후 각 뷰를 전환하여 보여주는 방식으로 자주 사용 함
테이블 레이아웃
(TableLayout)
- 격자(Grid) 모델
- 격자 모양의 배열을 사용하여 화면을 구성하는 방법
- HTML에서 많이 사용하는 정렬 방식과 유사하지만 많이 사용하지는 않음

 

 

제약 레이아웃

Constraint (제약조건) - 뷰가 레이아웃 안의 다른 요소와 어떻게 연결되는지 알려주는 것
Anchor Point (앵커 포인트) - 뷰의 연결점이며 점을 이용하여 Target에 연결 해줘야 함
Guideline (가이드라인) - 여러 개의 뷰를 일정한 기준 선에 정렬 할 때 사용

 

 

스크롤뷰에 대한 설명

ScrollView(스크롤뷰) - 하나의 뷰나 뷰 그룹을 넣을 수 있고 어떤 뷰의 내용물이 넘치면 스크롤을 만들수 있게 도와줌

추가적인 설명

예) 스크롤 뷰를 넣은 뷰 안에 글자를 넣었을 때 그 글자가 많아서 화면을 벗어나면 자동으로 스크롤이 만들어지며 뷰를 배치하는 목적을 가진 레이아웃이라기 보다는 단순히 뷰를 담고 있는 뷰그룹의 역할을 한다고 할 수 있다

 

 

뷰의 영역 알아보기

Border - 뷰의 테두리이 며 경계선으로도 부름
Box - 뷰의 영역이라고 하며 테두리를 기준으로 바깥쪽과 안쪽 공간을 띄움
Margin - 테두리의 바깥쪽 공간을 마진이라 부른다
Padding - 테두리의 안쪽 공간을 패딩이이라고 부른다

 

XML 레이아웃

속성이름 설명
wrap_content (가로 크기) - 뷰에 들어 있는 내용물의 크기에 자동으로 맞춰준다.
match_parent (세로 크기)  - 뷰를 담고 있는 뷰그룹의 여유 공간을 꽉 채운다.
숫자로 크기 지정 - 숫자를 사용해 크기를 지정하며 크기는 dp, px와 같은 단위를 써줘야 함.

 

 

접두어 의미
xmlns:android - 안드로이드 기본 SDK에 포함되어 있는 속성을 사용
xmlns:app - 프로젝트에서 사용하는 외부 라이브러리에 포함되어 있는 속성을 사용하며 app라는 단어는 다른것으로도 바꿀수 있음
xmlns:tools - 안드로이드 스튜디오의 디자이너 도구 등에서 화면에 보여줄때 사용하며 이 속성은 앱이 실행될 떄는 적용되지 않고 안드로이드 스튜디오에서만 적용
android:id - 이 id 속성은 ConstrainLayout 태그 안에 들어있는 태그 속성중 하나이며 이속성은 뷰를 구분하는 구분자 역할을 한다.
id 속성이 사용되는 용도는 크게 2가지이며
1. XML 레이아웃 파일 안에서 뷰를 구분할 때
2. XML 레이아웃 파일에서 정의한 뷰를 자바 소스 파일에서 찾을 때
layout_constraint[소스 뷰의 연결점]_[타킷뷰의 연결점]="[타깃뷰의 id]" 예) app:layout_constraintTop_toBottomOF="@+id/button"

 

크기를 표시하는 단위와 마진

단위 단위 표현 설 명
px 픽셀 화면 픽셀의 수
dp 또는 dip  밀도 독립적 픽셀
(density independent pixel)
160dpi 화면을 기준으로 한 픽셀
예) 1인치 당 160개의 점이 있는 디스플레이 화면에서 1dp는 1px와 같으며 1인치 당 320개의 점이 있는 디스플레이 화면에서 1dp는 2px와 같다.
sp 또는 sip 축척 독립적 픽셀
(scale independent pixel)
텍스트 크기를 지정할 때 사용하는 단위이며 가변 글꼴을 기준으로 한 픽셀로 dp와 유사하나 글꼴의 설정에 따라 1sp당 픽셀 수가 달라짐.
in 인치 1인치로 된 물리적 길이
mm 밀리미터 1밀리미터로 된 물리적 길이
em 텍스트 크기  글꼴과 상관없이 동일한 텍스트 크기 표시

 

추가 적인 설명

 

dp나 dip는 해상도에 비례하는 비슷한 크기로 보이게 할 때 사용되며 이 단위를 사용하게되면 해상도가 160dpi인 작은 화면에서는 20픽셀이던 버튼 크기를 320dpi인 약간 큰 화면에서는 40픽셀의 크기로 보이게 하며 따라서 해상도 별로 일일이 크기를 다시 지정해주지 않아도 된다.

 

sp 또는 spi는 글꼴을 기준으로 한 텍스트 크기를 나타내므로 뷰의 크기에서 사용되지 않습니다.

글자를 표시하는 텍스트뷰나 버튼의 텍스트 크기는 sp 단위 사용을 권장하며 이유는 사용자가 단말기의 설정에서 글꼴이나 폰트 크기를 바꾸는 경우가 있는데 sp 단위를 사용해야 설정에 맞추어 글자 크기가 바뀌기 때문이다.

728x90
반응형
LIST
Comments