3. Layout – 4. GridLayout

이번에는 GridLayout을 실습하기로 합시다.

GridLayout은 행과 열의 개수를 지정할 수 있습니다. 그리고 자식을 원하는 행과 열을 지정하여 배치할 수 있으며 필요에 의해 여러 개의 행과 여러 개의 열을 차지하게 배치할 수도 있습니다.

[그림 1] GridLayout 실습 실행화면

최상위 요소로 LinearLayout을 배치하고 자식으로 TextView(GridLayout 실습)과 GridLayout을 배치합니다.

GridLayout은 4행, 4열로 지정합니다. 이를 위해 columnCount와 rowCount 속성을 설정합니다.

그리고 실습 실행화면처럼 8개의 버튼(0~6, GRIDLAYOUT)을 배치합니다. 원하는 행과 열에 배치하려면 layout_column, layout_row 속성을 이용하고 3, 4, 5, 6, GRIDLAYOUT 버튼은 layout_rowSpan, layout_columnSpan 속성을 설정해야 합니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical">
    <TextView
        android:text="GridLayout 실습"
        android:textAlignment="center"
        android:textSize="30sp"
        android:textColor="#0000FF"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <GridLayout
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:columnCount="4"
        android:rowCount="4">
        <Button
            android:text="0"
            android:layout_column="0"
            android:layout_row="0"
            android:layout_gravity="fill_horizontal"/>
        <Button
            android:text="1"
            android:layout_column="1"
            android:layout_row="0"
            android:layout_gravity="fill_horizontal"/>
        <Button
            android:text="2"
            android:layout_column="2"
            android:layout_row="0"
            android:layout_gravity="fill_horizontal"/>
        <Button
            android:text="3"
            android:layout_column="3"
            android:layout_row="0"
            android:layout_rowSpan="2"
            android:layout_gravity="fill_vertical"/>
        <Button
            android:text="4"
            android:layout_column="0"
            android:layout_row="1"
            android:layout_columnSpan="3"
            android:layout_gravity="fill_horizontal"/>
        <Button
            android:text="5"
            android:layout_column="0"
            android:layout_row="2"
            android:layout_columnSpan="2"
            android:layout_gravity="fill_horizontal"/>
        <Button
            android:text="6"
            android:layout_column="2"
            android:layout_row="2"
            android:layout_columnSpan="2"
            android:layout_gravity="fill_horizontal"/>
        <Button
            android:text="GridLayout"
            android:layout_column="0"
            android:layout_row="3"
            android:layout_columnSpan="4"
            android:layout_gravity="fill_horizontal"/>
    </GridLayout>
</LinearLayout>

Android