안드로이드 Constraint Layout 공부하기
4. Constraint bias 적용하기
기본적으로 View를 부모View 왼쪽 오른쪽에 제약을 준다면 View는 가운데에 오게된다.
Constraint bias를 이용하면 View의 위치를 변화시킬 수 있다.
View를 드래그하거나 아래 Attribute 창에서 44라고 쓰인 동그라미 버튼을 좌우로 움직여주면 된다. (동그라미 버튼의 숫자는 다를 수 있음.)
5. View의 크기 조절
뷰를 선택하면 오른쪽 Attribute 창에 위의 컨텐츠가 나온다.
1 -> 크기 비율
2 -> 제약 조건 지우기
3 -> 높이, 너비 모드
4 -> 마진
5 -> constraint bias
6 -> 제약조건 내용
🔢 여기서 3번의 경우 기호로 표시하기 때문에 각 기호의 의미를 알아야한다.
고정된 크기를 말한다.
뷰 안의 내용에 따라 최대한 펼쳐진다.
제약조건을 만족하는 범위에서 최대치로 펼쳐진다.
여기서 Match Constraint 관려해서 몇가지 속성을 알아두면 View를 그릴 때 편할 것이다.
- layout_constraintWidth_default
기본값은 spread이다.
제약조건을 만족하는 선에서 최대한으로 펼쳐진다.
wrap으로 설정하면 wrap_content 처럼 View 안의 컨텐츠가 허용하는 범위까지 View가 펼쳐진다.
wrap_content와 다른 점은 뷰가 컨텐츠 내용보다 작아질 수가 있다.
- layout_constraintWidth_min : 뷰의 최소 너비를 dp로 정한다.
- layout_constraintWidth_max : 뷰의 최대 너비를 dp로 정한다.
만약, 제약조건이 하나밖에 없다면 뷰는 contents에 맞춰서 펼쳐진다.
6. 뷰의 크기 비율
뷰의 비율을 정할 때는 위 화면 빨간 동그라미 부분을 누른다음 ratio 입력창에다 원하는 비율을 적으면 된다.
다만, width와 height 둘다 0dp(match constraint)라면 빨간 동그라미 부분을 2번 눌러서 width와 height 중 어느 부분을 변화시킬 건지 정해야한다.
예를들어,
위 경우에 파란 텍스트뷰는 세로에 선이 생겼기 때문에 width가 고정이고 height이 2:1의 비율에 맞게 변경이 된다. (위 화면 빨간색 화살표 참고)
<TextView
android:id="@+id/textView5"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@color/won_color"
android:text="TextView"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="h,2:1" // 이부분이 핵심!
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
코드로 보면 위와 같다.
7. 뷰의 마진 조절하기
View의 마진을 조절할 때 위 화면처럼 툴바에서 조절하면 이후에 생기는 뷰들은 균일하게 16dp의 마진이 적용된다.
8. Chain 적용
Chain이란 뷰들을 서로 연결시켜 그룹으로 만드는 것이다.
1 -> Spread
뷰 사이 공간이 균일하게 배분된다.
2 -> Spread inside
양 끝의 뷰 내부 공간이 균일하게 배분된다.
3 -> Weighted
layout_constraintHorizontal_weight 과 layout_constraintVertical_weight으로 뷰들의 비율을 정할 수 있다.
4 -> Packed
뷰들을 딱 달라붙게해서 함께 움직이게 만든다.
위 4가지의 Chain Style을 적용할 때, Chain의 head view에 적용해준다.
(맨 왼쪽 뷰나 맨 위쪽의 뷰)
체인을 적용한다고 정렬이 되는 것은 아니니 이후에 꼭 align을 해주자!
댓글 없음:
댓글 쓰기