• 목록

컨스트레인트레이아웃(ConstraintLayout)은 레이아웃 구성 시, 뷰 위젯의 위치와 크기를 유연하게 조절할 수 있게 만들어주는 레이아웃입니다.
컨스트레인트레이아웃이 어떠한 방식으로 레이아웃 배치의 유연함을 제공하는지는, "컨스트레인트(Constraint)"라는 단어의 의미를 통해 유추할 수 있습니다.

컨스트레인트레이아웃는 레이아웃에 배치되는 뷰들에 여러 제약(Constraint)을 적용하여 각 뷰의 위치와 크기를 결정합니다. 여기서 말하는 "제약(Constraint)"이란, 각 요소들의 최종 위치와 크기를 결정하게 될 조건, 예를 들어, 특정 뷰 왼쪽 사이드를 지정된 뷰의 오른쪽 사이드에 맞추거나, 뷰의 왼쪽,오른쪽 사이드를 각각 부모 레이아웃의 왼쪽,오른쪽 사이드에 맞추는 것 등을 말하며, 이러한 각각의 제약(Constraint)은 컨스트레인트레이아웃이 가지는 하나의 레이아웃 속성으로 매핑됩니다.

예를 들어, 뷰의 "왼쪽 사이드를 대상 뷰의 오른쪽 사이드에 배치"하는 속성은 "layout_constraintLeft_toRightOf"입니다. "layout_constraint"에 "Left_toRightOf"라는 제약 조건을 결합하여, 뷰의 왼쪽 사이드(Left)를 속성 값으로 지정된 ID 뷰의(Of) 오른쪽 사이드(ToRight)에 맞추라는 제약을 지정할 수 있습니다.

앱 개발 시, 레이아웃을 구성할 때는, 아래와 같이 XML 코드를 작성합니다.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context=".MainActivity"
    tools:showIn="@layout/activity_main">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="48sp"
        android:background="#FF0000"
        android:id="@+id/text1"
        android:text="TEXT1" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="48sp"
        android:background="#00FF00"
        android:id="@+id/text2"
        android:text="TEXT2"
        app:layout_constraintLeft_toRightOf="@id/text1" />

</android.support.constraint.ConstraintLayout>

컨스트레인트레이아웃이 제공하는 제약(Constraint) 

컨스트레인트레이아웃이 제공하는 제약(Constraint)은 그 종류가 매우 많으며, 사용 목적과 방법에 따라 몇 가지 카테고리로 분류됩니다, 물론, 컨스트레인트레이아웃을 사용하는데 있어, 하나의 속성 또는 하나의 카테고리에 속한 속성들만 사용할 수 있는 것은 아니며, 필요에 따라, 여러 카테고리의 제약들을 다양하게 조합하여 사용합니다.

아래 그림은 컨스트레인트레이아웃에서 사용할 수 있는 제약(Constraint)들을 카테고리로 구분하여 정리한 내용이다.

아래 표는 컨스트레인트레이아웃에서 제공하는 속성을 나열한 것입니다.