Khi nói về UI Layout không thể không nói đến TableLayout trong Android. Vậy TableLayout trong Android là gì? Có mấy cách khai báo TableLayout? Sử dụng TableLayout như thế nào?
Bây giờ tôi cùng các bạn sẽ làm rõ các vấn đề được đặt ra ở trên.
1. TableLayout trong Android là gì
TableLayout trong Android là một view group, nhóm tất cả các view vào trong hàng và cột. Sử dụng <TableRow> để tạo ra các hàng trong bảng (một hàng có thể chia thành nhiều ô). Vùng chứa của TableLayout không hiển thị đường viền cho hàng, cột hoặc ô của nó. Vậy cú pháp khai báo TableLayout trong Android như thế nào?
2. Cú pháp khái báo TableLayout trong Android
Trong Android TableLayout được khai báo như sau.
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:shrinkColumns="*" android:stretchColumns="*" android:background="#ffffff"> //TODO </TableLayout>
3. Các thuộc tính của TableLayout trong Android
Một số thuộc tính quan trọng của TableLayout.
Thuộc tính | Mô tả |
---|---|
android:id | ID là duy nhất để nhận diện Layout |
android:collapseColumns | Xác định index của các cột (bắt đầu từ 0). Các index cột được phân biệt riêng rẽ bởi dấu phẩy. |
android:shrinkColumns | Xác định index của các cột (bắt đầu từ 0) để co lại. Các index cột được phân biệt riêng rẽ bởi dấu phẩy. |
android:stretchColumns | Xác định index của các cột (bắt đầu từ 0) để kéo ra. Các index cột được phân biệt riêng rẽ bởi dấu phẩy. |
4. Ví dụ sử dụng TableLayout trong Android
Đến với ví dụ sử dụng TableLayout trong Android tôi sẽ thiết kế giao diện như sau.. Các bạn có thể download source code ngay bên dưới đây.
Nội dung file table_layout_activity.xml
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:collapseColumns="" android:shrinkColumns="*" android:stretchColumns="*" android:background="#ffffff"> <TableRow android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="center_horizontal"> <TextView android:id="@+id/TextView01" android:layout_width="match_parent" android:layout_height="wrap_content" android:textSize="18dp" android:text="@string/TextView_01" android:layout_span="3" android:padding="18dip" android:background="#b0b0b0" android:textColor="#000"/> </TableRow> <TableRow android:id="@+id/tableRow1" android:layout_height="wrap_content" android:layout_width="match_parent"> <TextView android:id="@+id/TextView02" android:text="@string/TextView_02" android:layout_weight="1" android:background="#dcdcdc" android:textColor="#000000" android:padding="20dip" android:gravity="center"/> <TextView android:id="@+id/TextView03" android:text="@string/TextView_03" android:layout_weight="1" android:background="#d3d3d3" android:textColor="#000000" android:padding="20dip" android:gravity="center"/> <TextView android:id="@+id/TextView04" android:text="@string/TextView_04" android:layout_weight="1" android:background="#cac9c9" android:textColor="#000000" android:padding="20dip" android:gravity="center"/> </TableRow> <TableRow android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="center_horizontal"> <TextView android:id="@+id/TextView05" android:text="@string/TextView_05" android:layout_weight="1" android:background="#b0b0b0" android:textColor="#000000" android:padding="20dip" android:gravity="center"/> <TextView android:id="@+id/TextView06" android:text="@string/TextView_06" android:layout_weight="1" android:background="#a09f9f" android:textColor="#000000" android:padding="20dip" android:gravity="center"/> </TableRow> </TableLayout>
Kết quả sau khi chạy ví dụ TableLayout trong Android
Lời kết: Sau khi đã tìm hiểu về TableLayout trong Android các bạn cần nắm khái niệm UI Layout trong Android, UI Layout là gì?. Ngoài ra các bạn có thể xem thêm các nội dung khác trong chuyên mục lập trình Android được chia sẻ với Team Việt Dev.
Xem thêm các layout khác tại đây.
Sử dụng Linear Layout trong Android
Sử dụng Relative Layout trong Android
Đang cập nhật…
(Tác giả: Team Việt Dev)