6.셀 기반 레이아웃

PDF 내려받기

6.1columnrow 속성으로 컴포넌트 배치하기

화면을 가상의 컬럼으로 나눠 각 셀에 컴포넌트를 배치합니다. 전체 셀의 크기는 모든 컴포넌트의 columnrow 속성의 최대 값으로 결정합니다. 예를 들어 열이 3, 행이 4인 레이아웃이 있습니다.

column 속성은 왼쪽부터 1에서 시작합니다. row 속성은 위부터 1에서 시작합니다.

색칠한 셀에 컴포넌트를 배치하려면 columnrow 값을 다음과 같이 설정합니다.

<r-doc id="3e005ee60edcc72d" column="1" row="1" />

특정 행에 컴포넌트를 배치하지 않으면 해당 행의 높이가 0이기 때문에 화면에서 공간을 차지하지는 않습니다.

색칠한 셀에 컴포넌트를 배치하려면 columnrow 값을 다음과 같이 설정합니다.

<r-doc id="3e005ee60edcc72d" column="3" row="4" />

여러 열에 하나의 컴포넌트를 배치할 수 있습니다. 색칠한 셀에 컴포넌트를 배치하려면 columnrow 값을 다음과 같이 설정합니다.

<r-doc id="3e005ee60edcc72d" column="1-3" row="3" />

column 속성에 -를 구분자로 시작 열과 끝열을 설정합니다.

여러 행에 하나의 컴포넌트를 배치할 수 있습니다. 색칠한 셀에 컴포넌트를 배치하려면 columnrow 값을 다음과 같이 설정합니다.

<r-doc id="3e005ee60edcc72d" column="1" row="2-3" />

row 속성에 -를 구분자로 시작 행과 끝행을 설정합니다.

여러 열과 여러 행에 하나의 컴포넌트를 배치할 수 있습니다. 색칠한 셀에 컴포넌트를 배치하려면 columnrow 값을 다음과 같이 설정합니다.

<r-doc id="3e005ee60edcc72d" column="1-2" row="3-4" />

column 속성에 -를 구분자로 시작 열과 끝열을 설정합니다.


row 속성에 -를 구분자로 시작 행과 끝행을 설정합니다.

6.2참고 사항