TableLayout 테이블레이아웃

테이블레이아웃은 엑셀시트 처럼 격자 형태의 행과 열로 구성된다.

테이블레이아웃 엘리먼트 안에는 TextRow라는 엘리먼트가 들어 갈 수 있는데, 하나의 TextRow는 하나의 행(가로)을 나타낸다. 그리고 하나의 TextRow안에 쌓이는 뷰는 Horizontal 방향으로 배치된다.

테이블레이아웃 엘리먼트에서 설정 할 수 있는 대표적인 속성으로 shrinkColumns와 stretchColumns가 있다.

shrinkColumns :  부모 컨테이너의 폭에 맞추도록 각 열의 폭을 강제로 축소

stretchColumns : 부모 컨테이너의 공간을 채우기 위해 지정된 뷰의 열의 폭을 자동 조절해서 늘린다.

테스트

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:stretchColumns="1,2"
    tools:context="com.example.choonie.relativelayoutex.TableLayoutActivity">


    <TableRow>

        <Button
            android:id="@+id/button1"
            android:text="로우1버튼1" />

        <Button
            android:id="@+id/button2"
            android:text="로우1버튼2" />

        <Button
            android:id="@+id/button3"
            android:text="로우1버튼3" />

    </TableRow>

    <TableRow>

        <Button
            android:id="@+id/button4"
            android:text="로우2버튼1" />

        <Button
            android:id="@+id/button5"
            android:text="로우2버튼2" />

    </TableRow>


</TableLayout>

TableRow의 높이값인 TableLayout의 layout_height는 항상 wrap_content로 화면을 꽉 채울 수 없다. 그래서 match_parent는 소용없다.

반대로 layout_width는 match_parent로 가로 공간을 꽉 채우게 된다.

결과화면

TableRow가 하나의 행을 나타내고, 다시 TableRow안에 뷰가 열을 나타낸다고 하였다. HTML을 알고 있다면 TableRow가 <tr>역할을 하고 그 안의 뷰가 <td>역할을 한다고 생각하면 쉽다.

stretchColums는 콤마,로 구분해서 지정할 수 있다. TableRow의 안에서 인덱스 순서가 0부터 시작 한다. 위 코드에서 지정하고 있는 값은 1, 2 즉 두번째 Button뷰와 세번째 Button뷰를 지정하고 있다. 

그래서 결과화면을 보면 이 두 버튼이 공평한 크기로 부모 컨테이너의 레이아웃 크기에 맞게 가로 폭이 커진 것을 알 수 있다.