DEV Community

ownership903
ownership903

Posted on

[Android Studio] Basic Resource Layout

OverView

  • ConstraintLayout (Constraint(제약조건) 설정만으로 화면 구성)
  • LinearLayout
  • FrameLayout

Bias 위치 조절 버튼
Aspect Ratio 가로세로비

ConstraintLayout
Image description
① View Options : 제약조건을 화면에 표시하거나 숨길 수 있다.
② Auto Connect : 오토 커넥트가 켜진 상태에서 위젯을 컨스트레인트 레이아웃에 가져다 놓으면 기본 컨스트레인트를 연결해준다.
③ Default Margin : 컨스트레인트 연결 시 설정한 만큼 기본 마진값을 적용한다.
④ Clear Constraints : 화면상의 모든 컨스트레인트를 제거한다. 개별로 제거할 때는 위젯에 마우스 포인터를 올리면 나타나는 동일한 모양의 아이콘을 클릭한다.
⑤ Infer Constraints : 오토 커넥트를 끄고 작업할 때 사용한다. 가까운 위젯이나 레이아웃에 2개 이상의 컨스트레인트를 연결한다.
⑥ Pack : 여러 개의 위젯을 동시에 선택한 상태에서 크기를 조절할 때 사용한다. 선택된 위젯들의 상태에 따라서 크기가 조절될 때도 있고, 위치가 조절될 때도 있다.
⑦ Align : 선택된 위젯들을 정렬해준다.
⑧ GuideLine : layout 안의 모든 위젯에 대해 공통의 여백을 지정할 때 사용한다. 가로 또는 세로 가이드라인을 삽입하면 위젯들은 가이드라인에 컨스트레인트를 연결할 수 있다.

GuideLine
ConstraintLayout에만 사용할 수 있는 보조 도구다.
GuideLine을 Drag해서 화면 임의의 위치에 가져다 놓으면 layout 안에 배치되는 위젯에 가상의 Anchor Point를 제공한다.
Image description

LinearLayout
위젯을 가로 또는 세로로 한 줄로 배치하기 위한 layout.

orientation 속성
하위 버전의 android studio에서는 필수 속성이었지만, 3.1부터는 입력하지 않으면 horizontal가 적용돼 가로로 배치된다. (horizontal, vertical만 변경해주면 기존에 배치되어 있던 위젯들도 방향을 바꿀 수 있다.)

layout_weight 속성
레이아웃 안에 배치되는 위젯의 크기를 비율로 나타낼 수 있는 옵션. LinearLayout에 배치되는 위젯의 layout_weight 속성은 기본 설정값이 1이다.

gravity 속성

layout_gravity 속성
속해있는 layout(부모 layout)을 기준으로 나의 위치를 설정할 때 사용. 주로 LinearLayout과 FrameLayout 에서 사용된다.

LinearLayout을 사용하기 위해 ConstraintLayout 안에 LinearLayout을 추가할 수도 있지만 Layout이 중첩되면 그만큼 그래픽 처리 속도가 느려지기 때문에 기본 Layout인 ConstraintLayout을 LinearLayout으로 바꾼 후에 작업을 한다.

주의사항
LinearLayout과 같은 일반 layout들은 화면 크기(높이, 넓이)를 넘어가는 위젯이 삽입돼도 Scroll이 되지 않는다.
이럴 때는 최상위 layout을 Scroll 할 수 있는 요소로 감싸야 한다. Scroll View를 사용하려면 ① 기존 layout(ConstraintLayout)을 Scroll View로 변경해서 사용하거나, ② 기본 layout 안에 Scroll View를 추가해야 한다.

example)
Image description
1) Change [android.constraintlayout.widget.ConstraintLayout] -> [ScrollView]
2) LinearLayout을 Drag하여 ScrollView 안에 놓는다.
3) 그 다음 LinearLayout 안에 Button을 20개 정도 삽입한 다음 emulator를 실행해보면 scroll 되는 것을 확인할 수 있다.

*FrameLayout *

Top comments (0)