TableLayout表格布局UI
2875 点击·0 回帖
![]() | ![]() | |
![]() | 新建一个Android项目时,UI的默认布局是LinearLayout(线性排版),如果要要实现并排显示TextView,我们可以使用TableLayout(表格排版)。 Android.widget.TableLayout 是一個“排版类别”,它可以将画面切割成一个表格,下面在上个工程中添加一个两列表格的例子。 编辑main.XML文件: [html] view plaincopyprint?<?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:Android="http://schemas.android.com/apk/res/android" Android:layout_width="fill_parent" Android:layout_height="fill_parent" Android:orientation="vertical" > <TextView Android:layout_width="fill_parent" Android:layout_height="wrap_content" Android:text="@string/hello" /> <webView Android:layout_width="fill_parent" Android:layout_height="wrap_content" Android:id="@+id/wv" /> <TableRow> <TextView Android:layout_width="fill_parent" Android:layout_height="wrap_content" Android:text="www.atcpu.com" Android:padding="5dip" Android:autoLink="web" /> <TextView Android:layout_width="fill_parent" Android:layout_height="wrap_content" Android:text="www.atcpu.com" Android:autoLink="web" /> </TableRow> </TableLayout> <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:Android="http://schemas.android.com/apk/res/android" Android:layout_width="fill_parent" Android:layout_height="fill_parent" Android:orientation="vertical" > <TextView Android:layout_width="fill_parent" Android:layout_height="wrap_content" Android:text="@string/hello" /> <WebView Android:layout_width="fill_parent" Android:layout_height="wrap_content" Android:id="@+id/wv" /> <TableRow> <TextView Android:layout_width="fill_parent" Android:layout_height="wrap_content" Android:text="www.atcpu.com" Android:padding="5dip" Android:autoLink="web" /> <TextView Android:layout_width="fill_parent" Android:layout_height="wrap_content" Android:text="www.atcpu.com" Android:autoLink="web" /> </TableRow> </TableLayout> Android.widget.TableRow配合TableRow使用的一个类,当在TableLayout添加一个TableRow时,在TableRow里面所有的View都会在同一个列(row)中显示。 为了避免同一行所有的文字都挤在一起,因此在TextView中加上padding的属性: [html] view plaincopyprint?Android:padding="5dip" Android:padding="5dip" 表示第一个TextView的padding(间格)为5dip,表示与旁边的View有5个空格,这样就解决了两个TextView不会挤在一起。 效果如图: ![]() 摘自 Young的专栏 | |
![]() | ![]() |