[안드로이드] ConstraintLayout의 속성에 대하여

ConstraintLayout의 속성을 두루두루 알아야 일하기 수월해질거라는 사실에 도달하게 되었다.

고로 오늘은 ConstraintLayout의 속성에 대하여 알아보겠다. 그냥 심플하게 속성에 대해서 알아만 보자

ConstrinatLayout에는 속성이 무지하게 많다. 그래서 카테고리 별로 해당 속성을 볼 것이다.

 

1. Relative Positioning

흔히 사용하는 layout_constraintStart_toStartOf와 같은 상대적 위치를 지정해주는 속성은 넘어가겠다.

 

2. Margins

ConstraintLayout은 기본적인 Margin은 다른 레이아웃과 마찬가지로 설정해준다.

 

다른 레이아웃과 다른 점이라면, goneMargin이라는 속성이 사용 가능하다. 만약 A라는 뷰의 타겟 뷰가 없어질 경우 margin이 생기게 해주는 것이다. 그리고 해당 속성은 start, end, top, bottom 모두가 가능하다. (right, left는 사용안해서 제외)

 

• layout_goneMarginStart 
  
  
• layout_goneMarginEnd
  
  
• layout_goneMarginTop
  
  
• layout_goneMarginBottom

 

3. Centering Positioning and Bias

A, B, C 뷰가 있고 B의 Start와 End에 A, C와 제약을 걸어두었으면, B는 A와 C의 정중앙에 배치된다.

이때 완전 중간이 아니라 약간 왼쪽으로 치우치거나 오른쪽으로 치우쳐야 하는 경우가 있으면 Centering Positioning and Bias의 속성들을 사용하면 된다. 해당 속성은 아래와 같다.

• layout_constraintHorizontal_bias : 수평 방향의 position의 비율을 맞출 때 사용되며, 0~1 까지 설정이 가능하다. 이때 숫자가 0에 가까워 질 수 록 View는 start 제약이 걸린 View에 가까워지며 1에 가까워지면 End 제약이 걸린 View에 가까워진다.
  
  
• layout_constraintVertical_bias : 수직 방향의 position의 비율을 맞출때 사용된다. horizontal과 동일하게 0~1 까지 값 설정이 가능하다. 이 값은 0에 가까워 지면 top 방향으로 view가 움직이고 1에 가까워 지면 bottom 방향으로 view가 움직이게 된다.

 

4. Circular Positioning

컴퍼스를 사용할 때 우리는 특정 위치를 정한다. 그리고 그 특정위치에서 얼만큼 떨어질지 거리를 정하여 컴퍼스를 벌린다. 마지막으로 각도기를 이용하여 몇 도 만큼 그릴지 정하게 된다.

 

이러한 일련의 과정을 View에 대입하면 원형 위치 지정이 간단하게 이해가 된다.

 

A와 B라는 View가 있을 때 A는 고정이고 B라는 View의 위치를 지정해야 한다. 그렇다면 B는 A를 기준으로 거리를 얼마나 움직일지, 그리고 각도를 얼마나 움직일지 지정해주는게 바로 Circular Positioning이다. 이러한 모든 과정들은 아래와 같은 속성으로 이루어지게 된다.

 

• layout_contraintCircle : 특정 View가 어떤 View를 기준으로 움직일지 정해준다. 해당 값에는 기준이 될 View의 ID값이 들어간다.
  
  
• layout_constraintCircleRadius : 특정 View와 기준이 되는 View 사이의 거리를 정한다.
  
  
• layout_constraintCircleAngle : 기준이 되는 View로부터 몇 도 벌려져서 배치될 지 정한다. 이때 각도의 경우는 시계 방향을 기준으로 계산되며 12시가 0도로서 기준이된다.

 

5. Visibility Behavior

이 속성은 2번에서 설명한 속성과 동일하기에 패스하겠다.

 

6. Dimension Constraints

위젯 크기 조절하는데 유용하게 사용되는 속성이다. height나 width를 0dp로 두었을 때 혼합해서 사용하면 뷰의 크기를 마음대로 조종할 수 있다.

 

• layout_constraintDimensionRatio : 방향(H or W), 비율(n:m) 혹은 비율(n:m) 이렇게 2가지 방법으로 속성값을 결정한다. 이때 비율에서 n은 가로 m은 세로 방향이며 가로 세로 비율을 조정하여 길이를 조정하게 된다. 그리고 방향의 경우에는 width와 height가 모두 0dp로 설정되어 있을 경우에 변경될 사이드를 명시해 주는 것이다.
  
  
• layout_constraintedWidth : 자식 view가 constraintlayout의 가로범위 밖으로 나가지 않도록 조정해준다. true / false 값으로 설정해준다.
  
  
• layout_constraintedHeight : 자식 view가 constraintlayout의 세로범위 밖으로 나가지 않도록 조정해준다. true / false 값으로 설정해준다.
  
  
• layout_constraintWidth_min / layout_constraintWidth_max : 뷰의 가로길이의 최소, 최대 값을 설정해준다. 길이 값으로 값을 설정한다.
  
  
• layout_constraintHeight_min / layout_constraintHeight_max : 뷰의 세로길이의 최소, 최대 값을 설정해준다. 길이 값으로 값을 설정한다.
  
  
• layout_constraintWidth_percent : 뷰의 가로길이를 parent의 가로 길이의 % 값으로 설정해준다. 0~1까지 들어갈 수 있으며, 1이 들어가면 parent의 뷰 길이와 동일하다.
  
  
• layout_constraintHeight_percent : 뷰의 세로길이를 parent의 세로 길이의 % 값으로 설정해준다. 0~1까지 들어갈 수 있으며, 1이 들어가면 parent의 뷰 길이와 동일하다.

7. Chains

Chains의 경우에는 가로, 세로축에 대하여 해당 레이아웃 안에 있는 자식 뷰들을 그룹지을 수 있게 하는 것이다.

현재 사용 가능한 속성은 Packed, Spread Inside, Spread 이렇게 3가지 이다. 그리고 이 3가지가 뭘 의미하는지는 아직 잘 모르겠다. 나중에 천천히 직접 사용해보면서 알아가 볼 것이다.

 

속성은 아래와 같이 2가지가 있으며, 나머지 속성들과 조합하면 밑에 그림과 같이 여러가지 체인 스타일이 나올 수 있다.

 

• layout_constraintHorizontal_chainStyle : 가로 방향 체인 스타일 결정
  
  
• layout_constraintVertical_chainStyle : 세로 방향 체인 스타일 결정

 

8. Virtual Helper Objects

가상 객체의 경우에는 기존에 포스팅 되어 있는 것들이 있으니 그것들을 참고하길 바란다.

 

[안드로이드] ContraintLayout - GuideLine에 대하여

 

[안드로이드] ConstraintLayout - Barrier에 대하여

 

[안드로이드] ConstraintLayout - Group에 대하여