layered
7. 상대 레이아웃(RelativeLayout) 본문
개념
제약 레이아웃 이전에 기본으로 사용되던 레이아웃으로, 다른 뷰와의 상대적 위치를 이용해 화면에 배치한다.
중첩된 뷰 그룹을 없애고 레이아웃 계층 구조를 평면으로 유지하여 성능을 개선한다.
팔레트에서 Layouts가 아니라 legacy 항목에 있다!
이걸 리니어 레이아웃으로 구현하면 Button 5가 Button 6를 가리게 된다. 레이아웃에 의해 위쪽부터 아래쪽으로 자리하게 되므로 Button 5는 다음 버튼이 어디서부터 시작하는지 모르기 때문이다.
추가: 해보니까 리니어 레이아웃으로도 가능하긴 하다!
2023.04.05 - [안드로이드/안드로이드 앱 프로그래밍] - 3. 리니어 레이아웃(LinearLayout)
상대 레이아웃으로 만들 수 있는 화면 레이아웃은 모두 제약 레이아웃으로도 가능하므로, 사용이 권장되지는 않으나 이해는 해 두어야 한다.
메모
음... 부모 레이아웃과의 align을 설정하는 건 절대적인 기준을 잡기 위한 것 같다. 해당 라인들을 모두 지우고 나니 버튼이 한곳에 우르르 쌓여 버렸는데, 각 버튼 간의 관계는 정해졌어도 레이아웃 내의 위치는 정해지지 않았기 때문이다.
처음에는 왜 Button 5에 layout_above와 layout_below를 모두 지정하는지 몰랐는데, 위의 리니어 레이아웃의 관점에서 생각해 보니 그냥 Button 6이 Button 5를 가리키도록 하면 Button 5 입장에서는 어디까지 커져야 하는지 모르기 때문인 것 같다.
위의 버튼들에서 크기가 유동적으로 변하는 건 Button 5뿐이므로, 다른 버튼들과의 경계를 Button 5가 알아야 크기가 정해질 수 있으니까.
그리고 Button 4와 Button 6은 위치가 절대적으로 고정되어 있어야 하기 때문에 alignParent 값을 따로 설정해 준다!
결국 상대 레이아웃에서 연결이라는 건 누구의 입장이느냐가 상당히 중요한 부분이 되는 것 같다.
alignParent_ 속성을 지정하면 버튼의 연결점이 파랗게 바뀌고, 커서를 갖다 대어서 삭제했을 때 XML 코드 라인도 사라진다.
그런데 왼쪽의 연결점은 alignParentLeft가 아니라 alignParentStart를 지정했을 때 파랗게 되는데 왜 그러는지 모르겠다...
속성
| 속성 | 설명 | XML 예시 |
| layout_alignParent | 부모 컨테이너와 뷰의 한쪽을 맞춤 Top, Bottom, Left, Right |
|
| layout_center | 뷰를 부모 컨테이너의 중앙에 배치함 Horizontal, Vertical, InParent |
|
| layout_above/below | 지정한 뷰의 위쪽/아래쪽에 배치 |
|
| *layout_align | 지정한 뷰와 한쪽을 맞춤 Left, Right, Start, End, Top, Bottom |
|
| layout_toLeftOf/toRightOf | 지정한 뷰의 왼쪽/오른쪽애 배치 |
|
| layout_alignBaseline | 지정한 뷰와 내용물의 아래쪽 기준선을 맞춤 |
|
layout_align
Left와 Start는 비슷비슷하지만 레이아웃의 방향에 따라 달라진다. 일반적으로 쓰는 레이아웃에서는 Start = Left이고 오른쪽에서 왼쪽 방향의 레이아웃은 Start = Right이다.
찾아본 바로는 오른쪽->왼쪽 레이아웃을 사용하는 언어(아랍어 등)를 지원하기 위함이라는데, 그냥 Left, Right로 지정하면 어느 한쪽 레이아웃에서는 제대로 적용이 안 되지만 Start로 지정할 경우 Left, Right가 레이아웃에 따라 유동적으로 바뀌기 때문인 것 같다!
https://developer.android.com/reference/android/widget/RelativeLayout?hl=en
RelativeLayout | Android Developers
developer.android.com
'안드로이드 > 안드로이드 앱 프로그래밍' 카테고리의 다른 글
| 9. 드로어블(Drawable) (0) | 2023.04.13 |
|---|---|
| 8. 프레임 레이아웃(FrameLayout) (0) | 2023.04.13 |
| 6. 위젯 (0) | 2023.04.13 |
| 5. 텍스트뷰(TextView) (0) | 2023.04.13 |
| 3. 리니어 레이아웃(LinearLayout) (0) | 2023.04.13 |
