[Android] 선형 레이아웃(LinearLayout)

 LinearLayout 설명에 앞서, 뷰 컴포넌트에는 부모 컴포넌트와 자식 컴포넌트라는 개념이 있습니다. 부모 컴포넌트의 경우 화면 자체에 직접적으로 나타나지는 않으며, 보통 큰 틀을 제공하거나 자식 컴포넌트들의 정렬 기준을 설정하는데 쓰입니다. xml 디자인 탭의 palette에서 Layouts 항목이나 Containers 항목에 있는 것들이 보통 부모 컴포넌트라고 생각하시면 되겠습니다. 

 

 

 자식 컴포넌트의 경우 화면에 직접적으로 나타나는 컴포넌트이나 이것 하나만으로는 화면의 어디에 위치할 것인지를 설정할 수는 없습니다. 

 

 

 이제 LinearLayout의 기본적인 속성들에 대해 설명드리겠습니다. 첫 번째로 자식 컴포넌트의 정렬 기준, orientaion입니다.

 이 화면을 예로 들었을 때, LinearLayout은 부모 컴포넌트이고 그 안의 TextView 두 개가 자식 컴포넌트입니다. 쉽게 말하면 LinearLayout 안에 TextView들이 자리하고 있는 것이며, 이를 정렬하는 기준은 LinearLayout 의 속성 중 orientation의 옵션입니다. 상기 화면에는 vertical, 즉 수직으로(세로로) 정렬한다고 선언했기 때문에 TextView들이 세로로 정렬되어 있습니다.

 

 

 orientation의 옵션을 horizontal로 주게 되면 위의 화면처럼 가로로 정렬되게 됩니다.

 

 

 두 번째로, LinearLayout의 속성 중 gravity라는 속성에 대해 설명하겠습니다. gravity는 해당 컴퍼넌트 내의 자식 컴퍼넌트들의 위치를 지정할 수 있는 옵션인데, default는 left이며 gravity의 옵션에서 원하는 위치로 변경할 수 있습니다.

 

 위의 화면은 gravity에 right를 부여한 모습입니다. 이렇게 하나만 넣어서 위치를 지정할 수도 있고, '|' 기호를 사용하여 다양한 위치를 부여할 수도 있습니다.

 

gravity에 'rightcenter'를 부여한 모습

 

 

 다음으로, TextView가 LinearLayout의 자식으로 있을 때 부여할 수 있는 속성이 있습니다. TextView 내에서 layout_gravity를 사용할 수 있는데, TextView를 LinearLayout 내의 어느 위치에 놓을 것인지를 선택할 수 있는 옵션입니다.

 

layout_gravity의 속성들. LinearLayout내에서 위치를 지정할 수 있다.

 여기서는 layout_gravity를 center로 주었는데, 보시다시피 TextView가 중앙으로 위치를 옮긴 것을 볼 수 있습니다.

 

 만일 부모 뷰(부모 컴포넌트)에서 gravity로 right를 주었는데, 자식 뷰(자식 컴포넌트)에서 layout_gravity를 left로 준다면 위치는 가장 하위 뷰에서 설정한 gravity를 따르게 됩니다. 이에 따라 상기한 상황에선 left로 설정되리라는 것을 알 수 있습니다.

 

 

 다음은 weight에 관해 설명드리겠습니다. 

 

 LinearLayout 안에 LinearLayout을 하나 더 만든 후, 그 안에 Textview 세 개를 집어넣었습니다. TextView 내의 속성들에 대해 간단히 설명드리면 background는 배경색을, textSize는 글씨의 크기를 의미하며 textStyle의 글씨의 형태를 지정합니다. 글씨의 형태에는 bold(굵게),  italic(기울게), normal(일반)이 있습니다. default는 일반입니다. 

 

 그리고 weight는 한마디로 '비율'이라고 할 수 있습니다. 위의 화면에선 LinearLayout에 orientation을 horizontal로 주었기 때문에 가로로 비율이 맞춰진 상태입니다. 각각 weight를 1씩 주었기 때문에 1:1:1의 비율로 화면을 차지하고 있는 것을 알 수 있습니다. 이 때 주의해야 할 점은 width 또는 height의 값이 각각 같아야 한다는 점입니다. 이 값이 다르면 weight를 같게 주더라도 크기가 달라질 수 있습니다. 

 

 

 같은 화면에서 orientation을 vertical로 줄 경우 이렇게 배치가 바뀝니다. 

 

 

 이번엔 부모 뷰에 weightSum을 넣은 경우입니다. 방금은 비율이 1:1:1로 부모의 크기 전체를 사용했다면 이번엔 사용할 크기를 지정한 형태입니다. 화면에서는 weight를 5로 주었습니다. 때문에 weight 5 중 자식 뷰가 각각 1씩 3을 사용했으므로 2가 남습니다. 남은 2는 프리뷰 화면의 하단 공백으로 이해할 수 있습니다.