goback add

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的专栏


喜欢0 评分0