화면내에 위젯을 배치하기 위해서 사용되는 것이 레이아웃 매니저 입니다. 전에는 Linear Layout, Relative Layout 등이 사용되었는데, 이제는 기본 레이아웃 매니저가 ConstraintLayout 입니다. 이러한 레이아웃 매니저가 사용되는 이유는 서로 다른 화면 크기를 가지는 기계들에서는 동일한 모양의 화면 구성을 유지하기 위하여 위젯들을 화면에서 상대적으로 배치하도록 해주는 것입니다.
안드로이드 스튜디오로 프로젝트를 생성하면 기본 레이아웃 매니저가 이제는 ConstraintLayout 입니다. 이번 글에서는 위젯의 크기를 지정하는 방법과 정렬하는 방법을 알아 보겠습니다.
1. 위젯의 크기 설정
- 리사이즈 핸들(Resize Handle) 이용하여 설정하기
위젯을 클릭하면 네 모서리에 사각형의 핸들이 생깁니다. 이부분을 마우스로 드래그 해서 크지를 설정할 수 있습니다.
드래그해서 크기를 조절하면 오른쪽 속성창의 layout_width와 layout_height 가 변경되는 것을 볼 수 있습니다.
- 직접 값을 입력하여 설정하기
위젯을 클릭하고 오른쪽의 속성창에서 layout_width와 layout_height를 입력해서 크기를 설정할 수 있습니다.
수치를 직접 입력하는것 외에 사용할 수 있는 값이 wrap_content와 match_constraint 가 있습니다.
- wrap_content 는 위젯 내부에 있는 컨텐츠(주로 텍스트)에 딱 맞게 길이가 결정됩니다.
- match_constraint 는 아래에 설명하는 사이트 핸들로 정렬이 되어 있을때 그 영역을 꽉 채우도록 크기가 결정됩니다.
위 이미지에서는 버튼이 좌우측 화면 경계와 연결되어 있고, layout_width가 match_constraint이면 너비를 꽉 채우도록 늘어나고, wrap_content이면 내용에 딱 맞는 너비로 설정되는 것을 보여주고 있습니다.
2. 위젯의 상대적인 정렬
사이드 핸들(Side Handle)을 이용하여 위젯이 다른 위젯 또는 화면의 경계에 대해서 어떻게 정렬될지를 지정할 수 있습니다.
사이드 핸들은 아래 이미지에서처럼 위젯의 각 변의 가운데 있습니다.
- 좌우에 있는 핸들을 가로축에 있는 위젯들간의 정렬을 설정하고 상하에 있는 핸들은 세로축 간의 정렬을 설정합니다.
- 좌우 핸들을 상하 핸들에 연결할 수 는 없습니다. 위젯들 뿐만 아니라 화면의 각 경계 또는 임의로 추가된 수직, 수평의 가이드 라인과의 정렬을 설정할 수 있습니다.
- 드래그 해서 할 수 도 있고, 우측 속성창 상단에 현재 선택된 위젯의 정렬 상태가 보여지고 있는곳의 수치 부분을 클릭해서 집젹 입력해서 설정할 수 도 있습니다.
3. 위젯 내에 포함되어 있는 텍스트의 위치로 정렬 기준을 설정하기
- 베이스라인 핸들(Baseline Handle)
위젯에 마우스를 가져가면 좌측 하단에 ab 라는 베이스라인 아이콘이 보입니다. 이것을 클릭하면 위젯의 텍스트 하단에 베이스 라인 핸들이 보입니다.
이 베이스 라인 핸들을 클릭하여 다른 위젯의 텍스트에 연결하면 연결된 위젯은 텍스트의 하단이 일치하도록 정렬 됩니다.
4. Constraint 툴바 사용하기
1) Autoconnect : 켜두면 위젯을 배치할때 자동으로 이웃한 위젯과 관계를 맺어 줍니다.
2) Clear All Constraints : 모든 관계를 삭제합니다.
3) Infer constraints : 레이아웃내 배치된 모든 위젯을 현재 위치를 기반으로 관계를 맺어 줍니다.
4) Default Margins : 위젯간의 기본 마진 같을 지정합니다.
5) Guidelines : 수평, 수직 가이드라인을 만들 수 있습니다. 위젯을 이 가이드라인을 기준으로 정렬할 수 있습니다.
5. 속성창
속성창 상단의 위젯에 대한 기호에 대해서 알아봅니다.
이미지에서 위쪽 위젯이 선택된 상태입니다.
1) Margin : layout_width가 match_constraint 이므로 좌우 여백 8만 있고 전체를 위젯이 차지하고 있습니다.
2) Aspect Ratio : 클릭하면 위젯의 가로 세로 비율을 지정할 수 있습니다.
3) Wrap Content : 부등호 세계로 된 모양은 wrap_content 로 지정되어 있음을 나타냅니다.
4) Any Size : 톱니 모양은 최대한의 너비를 차지하게 됩니다. match_constraint로 지정되어 있습니다.
5) 점선 : 관계가 없습니다.
6) Horizontal Bias : 위젯의 좌우측 위치 비율을 지정합니다. 드래그해서 바꿀 수 있습니다.
이미지에서 하단의 위젯이 선택된 상태입니다.
1) Fixed : 길이가 고정되어 입력되어 있는 상태를 나타냅니다. 여기에서는 layout_widht 가 100으로 되어 있는 예입니다.
이제 까지 ConstraintLayout의 기본적인 사용법을 알아보았습니다.
'프로그래밍 > 안드로이드' 카테고리의 다른 글
| 안드로이드 디버깅 Logcat을 이용해서 로그 남기기 (0) | 2018.04.20 |
|---|---|
| 안드로이드 탭 이벤트 처리하기 (0) | 2018.04.20 |
| 안드로이드 크기 단위(dp, sp, pt, px, mm, in) (2) | 2018.04.20 |
| 안드로이드 문자열 리소스 만들고 사용하기 (0) | 2018.04.20 |
| 안드로이드 크롬에서 웹페이지 소스 보기 (2) | 2018.04.18 |