제약 레이아웃(Constraint Layout)

제약 레이아웃

프로젝트를 만들었을 때 XML 레이아웃 파일 안에는 자동으로 만들어진 레이아웃이 들어있게 됩니다.

화면 전체를 표현하는 레이아웃으로 제약 레이아웃이라는 것이 자동으로 만들어져 있습니다.

제약 레이아웃이 어떤 것이고 어떻게 사용하는지 알아봅시다.

제약 레이아웃은 프로젝트를 처음 만들었을 때 자동으로 만들어지는 레이아웃입니다.

자동으로 만들어진 XML 레이아웃 파일인 activity_main.xml 파일을 열어보면 가장 바깥에 있는 최상위 태그가 ConstraintLayout인 것을 확인할 수 있습니다.

이 최상위 태그는 화면 전체를 담고 있는 레이아웃을 의미합니다.

그 태그 안에 들어있는 속성 중에 xmlns라는 지시자가 들어 있습니다.

이 지시자는 XML 파일 하나당 한 번씩만 사용되면 되는데, 보통 최상위 태그에 들어 있습니다.

xmlns 지시자에는 상당히 긴 URL이 값으로 설정됩니다.

이것은 안드로이드 SDK에 들어있는 속성을 사용하겠다는 의미로 해석되는데 일단 같은 URL이 매번 자동으로 만들어지므로 크게 신경 쓰지 않아도 됩니다.

다만 안드로이드 SDK에 들어있는 속성은 android: 라는 접두어를 붙여서 사용하므로 각각의 속성에 대부분 android: 접두어가 붙게 된다고 이해하면 됩니다.

이와 다르게 app라는 속성이 사용되는 경우도 있는데 이것은 여러분이 만든 프로젝트에서 지정한 속성을 사용하겠다는 의미입니다.

예를 들어, 외부 라이브러리를 사용하는 경우에는 안드로이드 SDK에 들어있지 않은 별도의 속성을 사용할 수 있게 되는데 이때는 app라는 지시자를 추가하고 각 속성의 앞에 app: 라는 접두어를 붙이면 됩니다.

제약 레이아웃은 제약조건을 이용해 그 안에 추가된 뷰들의 위치를 결정합니다.

그리고 그 제약조건은 연결선을 통해 만들어지죠.

연결선은 뷰의 상, 하, 좌, 우에 있는 연결점을 다른 레이아웃이나 위젯의 상, 하, 좌, 우와 연결하여 만들 수 있습니다.

만약 버튼을 제약 레이아웃 안에 추가했다면 버튼을 담고 있는 부모 레이아웃인 제약 레이아웃과의 연결선을 만들 수도 있고 그 안에 들어있는 다른 뷰들과의 연결선을 만들 수도 있습니다.

기본적으로 위치조정은 mazin값을 통해 조절할 수 있습니다

양쪽에 연결선이 연결된 경우 bias를 통해 위치를 조정할수도 있습니다.(밑에 스크롤 바를 통해 변경가능)

제약조건

주의할 점은 연결선은 그 뷰의 위치를 결정할 만큼 만들어져야 한다는 것입니다.

예를 들어, 버튼의 연결선을 버튼의 왼쪽 연결점과 부모 레이아웃의 왼쪽 면과 연결하도록 하나만 만들었다면 이 버튼의 위치는 결정할 수 없게 됩니다.

왜냐하면, 이 상태에서는 버튼이 위, 아래 공간 중에서 어디에 위치하도록 할 것인지 알 수 없기 때문입니다.

따라서 버튼의 위쪽에 연결선을 하나 더 만들어주는 것이 필요합니다.

만약 상, 하 연결선을 모두 부모 레이아웃과 연결하여 만들게 되면 그 뷰는 부모 레이아웃의 가운데 지점에 있게 됩니다.

상, 하로 이어진 선의 중간 지점이죠.

상, 하, 좌, 우 모두 부모 레이아웃과 연결하면 어떻게 될까요?

화면의 가운데 부분에 위치하게 됩니다.

Q.레이아웃 안에 레이아웃을 넣는 방식으로 3~4개의 레이아웃을 중첩시켜 넣은 후 그 안에 버튼을 넣으면 하나의 

레이아웃 안에 버튼을 넣었을 때와 다른 점이 있을까요? 어떤 경우에 이렇게 만들까요?

A.2개의 constrainst layout 안에 하나의 linear layout을 설정하고 그 안에 버튼을 만들어 보았습니다. 설정값이 바뀌는 것은 없었습니다. 이러한 경우는 제가 생각하기엔 각각의 layout의 위치를 옮길 때 버튼이 함께 따라가는데, 여러개의 layout을 옮길때 그러한 view들을 일일이 옮기는 경우 불편하니 여러 layout과 여러 버튼을 함께 묶어두어 편집을 용이하게 만들어 주는 것 같습니다.

Q.제약 레이아웃 안에 두 개의 버튼을 넣고 하나의 버튼을 다른 버튼과 연결하여 위치시키면 

하나의 버튼을 움직였을 때 다른 버튼도 따라 움직일까요?

A.네