[앱인벤터 기초] 레이아웃 - 수평배치, 수직배치 이해하기

스크린에 넣는 컴포넌트는 한줄에 하나씩만 들어갈 수 있습니다.  한 줄에 여러개의 컴포넌트들을 넣고 싶을 때에는 레이아웃 요소들을 사용하면 됩니다. 

---

수평배치 블록

 

수평배치는 컴포넌트들이 왼쪽에서부터 오른쪽으로 가로로 정렬되도록 하는 레이아웃입니다. 수평배치는 기본적으로 수평정렬은 왼쪽에서부터, 수직정렬은 위쪽에서부터 시작됩니다. 화면 안에 컴포넌트들이 정렬되게 할 때 주로 사용합니다. 

블록	설명
	수평배치 안에 들어있는 컴포넌트들이 가로로 정렬될 때 왼쪽, 가운데, 오른쪽으로 정렬되도록 설정합니다.
	수평배치 안에 들어있는 컴포넌트들이 세로로 정렬될 때 위쪽, 가운데, 아래로 정렬되도록 설정합니다.
	배경색을 가져오거나 변경할 수 있는 블록입니다. 기본적으로 rgba 배경값을 가지고 있습니다.
	세로길이 값을 가져오거나 변경할 수 있는 블록입니다. 숫자 속성(픽셀 단위)을 사용합니다. 높이비율은 스크린의 높이를 기준으로 몇 퍼센트를 가질지 변경할 수 있습니다.
	수평배치에 표시할 이미지 파일명을 지정합니다. 텍스트 속성을 사용합니다.  * 한글 파일명은 지원하지 않습니다.
	컴포넌트의 보이기여부 값을 가져오거나 변경할 수 있는 블록입니다. 참, 거짓 속성을 사용합니다. 참이면 컴포넌트가 보이고 거짓이면 컴포넌트가 화면에서 보이지 않습니다.
	가로길이 값을 가져오거나 변경할 수 있는 블록입니다. 숫자 속성(픽셀 단위)을 사용합니다. 너비비율은 스크린의 너비를 기준으로 몇 퍼센트를 가질지 변경할 수 있습니다.

---

수평배치 사용해보기

 

파란색 배경은 수평배치이고 초록색 배경은 수직배치입니다. 수평배치의 수평정렬 속성을 바꾸었을 때 어떻게 되는지 확인해봅시다. 위에서 부터 순서대로 왼쪽, 가운데, 오른쪽입니다. 

속성	스마트폰 화면