ConstraintLayout guideline과 barrier 차이는 처음 보면 생각보다 자주 헷갈립니다. 둘 다 보이지 않는 선처럼 동작하고, 둘 다 다른 뷰를 정렬하는 데 쓰이기 때문입니다. 하지만 실제로는 기준이 고정되는지, 내용에 따라 움직이는지가 완전히 다릅니다.
이번 글에서는 guideline과 barrier 차이를 실제 XML 예시와 비교 이미지로 쉽게 정리하겠습니다. 핵심은 정의를 외우는 것이 아니라 언제 고정 기준선을 쓰고 언제 동적 기준선을 써야 하는지 판단하는 기준을 만드는 것입니다.
먼저 한 줄로 정리
- guideline은 고정 기준선
- barrier는 동적 기준선
- 화면 기준이면 guideline
- 내용 기준이면 barrier
이 한 줄만 먼저 기억해도 대부분의 상황을 빠르게 정리할 수 있습니다.
guideline과 barrier가 왜 자주 헷갈릴까
둘 다 눈에 보이지 않는 선처럼 동작하고, 둘 다 다른 뷰를 정렬하는 데 사용되기 때문입니다. 하지만 실제 차이는 좋고 나쁨이 아니라 위치가 무엇을 기준으로 정해지느냐입니다. guideline은 화면 또는 부모 기준으로 위치를 먼저 정하고, barrier는 참조한 뷰들의 실제 위치에 따라 기준이 결정됩니다.
guideline은 어떤 기준선인가
Android 공식 가이드 기준으로 guideline은 고정 위치 또는 비율 위치를 잡는 보이지 않는 선입니다. 즉, 왼쪽에서 24dp 떨어진 위치나 화면 너비의 30% 지점처럼 먼저 기준을 정해두고 다른 뷰를 그 기준에 맞춰 정렬하고 싶을 때 적합합니다.
guideline 예시
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.3" />
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="제목"
app:layout_constraintStart_toStartOf="@id/guideline"
app:layout_constraintTop_toTopOf="parent" />이 예시에서 guideline은 화면 너비의 30% 지점에 고정됩니다. 즉, guideline은 화면 기준으로 먼저 좌표를 정하고 싶은 상황에 잘 맞습니다.
guideline이 잘 맞는 경우
- 카드 레이아웃에서 일정한 시작 지점을 맞추고 싶을 때
- 여러 요소를 화면 비율 기준으로 나누고 싶을 때
- 텍스트 길이와 관계없이 항상 같은 위치에 배치하고 싶을 때
barrier는 어떤 기준선인가
Android 공식 가이드 기준으로 barrier는 자기 위치를 직접 갖는 선이 아닙니다. 대신 참조한 뷰들의 위치에 따라 스스로 위치가 바뀌는 기준선입니다. 즉, 텍스트 길이가 항상 같지 않은 UI에서 특히 강합니다.
barrier 예시
<androidx.constraintlayout.widget.Barrier
android:id="@+id/textBarrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="end"
app:constraint_referenced_ids="nameText,descriptionText" />
<Button
android:id="@+id/actionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="수정"
app:layout_constraintStart_toEndOf="@id/textBarrier"
app:layout_constraintTop_toTopOf="parent" />이 예시에서 barrier는 nameText와 descriptionText 중 더 멀리 뻗은 끝을 기준으로 위치가 정해집니다. 즉, barrier는 내용 길이에 따라 기준이 움직여야 하는 상황에 잘 맞습니다.
barrier가 잘 맞는 경우
- 텍스트 길이가 자주 달라지는 화면
- 여러 라벨 중 가장 긴 요소를 기준으로 정렬하고 싶을 때
- 다국어 문자열 때문에 폭이 자주 달라지는 UI
guideline으로 처리하면 어색해지는 경우
증상
- 이름이 길어지면 버튼이 너무 가까워지거나 겹쳐 보임
- 짧은 텍스트에서는 괜찮은데 긴 텍스트에서는 어색함
- 기준선은 일정한데 실제 내용과 맞지 않음
실패 예시
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.5" />
<Button
android:id="@+id/actionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="수정"
app:layout_constraintStart_toStartOf="@id/guideline"
app:layout_constraintTop_toTopOf="parent" />이 방식은 기준선을 화면 50% 지점에 고정합니다. 하지만 텍스트가 길어져도 guideline 위치는 그대로이므로 실제 내용 끝과 상관없이 버튼이 같은 위치에 있게 됩니다. 문제는 제약을 잘못 건 것이 아니라 기준선 선택이 잘못된 것입니다.
barrier로 바꾸면 자연스러워지는 경우
수정 예시
<androidx.constraintlayout.widget.Barrier
android:id="@+id/textBarrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="end"
app:constraint_referenced_ids="nameText,descriptionText" />
<Button
android:id="@+id/actionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="수정"
app:layout_constraintStart_toEndOf="@id/textBarrier"
app:layout_constraintTop_toTopOf="parent" />이제 버튼은 가장 길게 나온 텍스트 끝 다음에 붙습니다. 그래서 텍스트 길이가 달라져도 항상 실제 내용 기준으로 자연스럽게 배치됩니다. 텍스트나 내용 길이가 핵심 변수라면 barrier가 더 실제 UI에 맞습니다.
guideline과 barrier 차이: 언제 무엇을 써야 할까
guideline이 더 맞는 경우
- 기준이 화면 위치에 고정되어야 할 때
- 비율 또는 고정 간격으로 정렬하고 싶을 때
- 내용 길이와 관계없이 항상 같은 지점에 맞추고 싶을 때
barrier가 더 맞는 경우
- 기준이 실제 내용 길이에 따라 달라져야 할 때
- 여러 텍스트 중 가장 긴 요소를 기준으로 옆 요소를 배치해야 할 때
- 번역 문자열이나 동적 데이터 때문에 폭이 자주 달라지는 UI일 때
한 줄 판단 기준
화면 기준이면 guideline, 내용 기준이면 barrier입니다. 이 한 줄이 가장 중요합니다.
자주 하는 실수
- barrier를 guideline의 상위호환처럼 생각하는 실수
- 가변 텍스트 UI에도 guideline을 고집하는 실수
- 기준선을 정하지 않고 감으로 제약을 거는 실수
둘은 우열 관계가 아니라 해결하려는 문제 자체가 다릅니다. 먼저 기준이 화면에 고정돼야 하는지, 내용에 따라 움직여야 하는지부터 정해야 합니다.
한 번에 정리
- guideline은 고정 기준선이다
- barrier는 동적 기준선이다
- 화면 기준이면 guideline
- 내용 기준이면 barrier
- 텍스트 길이가 달라지는 UI일수록 barrier가 자연스럽다
즉, guideline과 barrier 차이는 기능 이름 차이가 아니라 기준이 무엇에 의해 결정되는가의 차이입니다.
마무리
ConstraintLayout에서 guideline과 barrier는 처음에는 둘 다 비슷한 보조선처럼 보일 수 있습니다. 하지만 하나는 화면 기준으로 위치를 고정하는 도구이고, 다른 하나는 실제 내용 위치에 따라 기준을 움직이는 도구입니다. 이 차이를 이해하면 텍스트 길이가 달라지는 화면에서 왜 자꾸 배치가 어색해졌는지도 훨씬 쉽게 설명할 수 있습니다.
관련해서 ConstraintLayout 전체 개념을 먼저 정리하고 싶다면 안드로이드 ConstraintLayout 완전 정리와 ConstraintLayout 디버깅 가이드를 함께 읽어보면 좋습니다. 공식 기준은 Android Developers ConstraintLayout 가이드, ConstraintLayout API reference, ConstraintSet API reference를 참고하면 됩니다.
