안드로이드

안드로이드 ConstraintLayout Visibility behavior / Dimensions constraints

알통몬_ 2017. 11. 13. 15:34
반응형


공감 및 댓글은 포스팅 하는데

 아주아주 큰 힘이 됩니다!!

포스팅 내용이 찾아주신 분들께 

도움이 되길 바라며

더 깔끔하고 좋은 포스팅을 

만들어 나가겠습니다^^

 


지난 포스팅에 이어 ConstraintLayout 에 대해 공부합니다.


 

Visibility behavior


가시성 동작입니다.

ConstraintLayout 에는 View.GONE 으로 표시된 위젯의 특정 처리가 있습니다.

GONE 속성을 가지는 위젯은 일반적으로 표시되지 않고 레이아웃에서도 차지하는 부분이

없어집니다. 

그러나 레이아웃 계산 측면에서는 여전히 중요한 부분입니다.

레이아웃의 크기는 0으로 간주됩니다.(일반적으로 하나의 점으로 표현됩니다)

그리고 GONE 속성을 가지는 위젯을 참조하는 위젯이 있다면 존재하는 제약조건을

그대로 가집니다.

하지만 GONE 속성을 가지는 위젯의 margin 같은 값들은 0으로 간주됩니다.

예를들어 공식문서에 있는 그림처럼

B라는 위젯이 A라는 위젯을 참고하고 있는데, A라는 위젯이 GONE 속성을 가지게 되면

A의 크기는 0이 되어 사라지지만, A를 참조하는 B의 제약조건들은 그대로 존재해서

위에서는 margin 을 그대로 표시하는 것을 볼 수 있습니다.

예제로 보겠습니다.

1. gone 속성을 가지지 않음.


2. gone 속성을 가짐.


실제로 코드를 작성해보시면 그 차이를 이해하기 쉬우실 거에요^^


 

Dimensions constraints (치수 제약 조건)


ConstraintLayout 자체의 최소 및 최대 크기를 지정할 수 있는데요.

아래 4가지 속성입니다.

android:minWidth="100dp"
android:minHeight="100dp"
android:maxWidth="150dp"
android:maxHeight="150dp"


위 속성들은 ConstraintLayout 이나 자식 위젯들이 layout_width 와 layout_height 가 wrap_content 로 설정되어 있는 경우에 사용할 수 있습니다.


그리고 위젯에는 3가지 제약으로 크기를 나타낼 수 있습니다.

1. 특정 값을 지정 ex) 100dp or @dimen/margin_36

2. wrap_content 위젯이 자체적으로 크기를 구하도록 합니다.

3. 0dp  얘는 ConstraintLayout 이 아닌 다른 레이아웃에서 위젯이 match_parent 속성을

가지는 것과 같은 결과를 가져와요.


위젯에 layout_width 나 layout_height 에 0dp 를 지정했을 때 사용할 수 있는

제약 조건 3가지가 있습니다.

아래는 layout_width="0dp"일 경우입니다.


android:layout_width="0dp"
app:layout_constraintWidth_max="200dp"
app:layout_constraintWidth_percent=".3"
app:layout_constraintWidth_min="100dp"

max는 말 그대로 최대 크기

min은 말 그대로 최소 크기

percent 는 부모의 크기를 그대로 따라 갈거면 1, 가장 작게는 0입니다.

그 사이의 double 값을 넣어주면 됩니다.

위에서는 .3으로 표시했는데, 부모 크기의 30%만큼의 크기를 가지는 위젯이 됩니다.


위젯의 크기를 비율로도 지정할 수 있습니다.


android:layout_width="wrap_content"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:2"

그리고 layout_width 와 layout_height 가 모두 0dp 일 경우는 아래처럼 사용 가능합니다.


android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="W,1:2"

width가 기준이 될 경우는 W, height 가 기준이 될 경우 H 를 써주시면 됩니다.


이상입니다.

감사합니다.




반응형