（转）DroidDraw 教程二: Table Layout

DroidDraw 教程二: Table Layout

• 步骤零

本教程描述如何创建一个从DroidDraw简单的输入和TableLayout布局。本教程假设你已经下载并安装了Android SDK。本教程也假设你对GUI编程概念和Java编程语言相当熟悉。

• 步骤一

启动 DroidDraw 用户界面设计器

• 步骤二

根布局选择为RelativeLayout布局

• 步骤三

选择"Layouts"标签

• 步骤四

把一个TableLayout对象从Layouts面板中拖放到屏幕顶的中部。

• 步骤五

双击"TableLayout"来修改它的属性。把它的宽度"width"改为"fill_parent"

• 步骤六

把三个TableRow对象从Layouts面板中拖放到TableLayout对象中。当你拖放TableRow对象时，你应该从弹出菜单中选择TableLayout。

• 步骤七

每一个TableRow中拖放一个TextView：

• 步骤八

双击每一个TextView来修改它的属性，修改显示文本如下图一样：

• 步骤九

每一个TableRow中拖放一个EditText，放在存在的文本右边。

• 步骤十

选中TableLayout，修改"Stretchable Column"(可扩展栏)属性值为1，这将把所有的EditText widget 扩展开来填充满该Table表格。

• 步骤十一

编辑每一个EditText的属性，让Text文本属性为""

• 步骤十二

把一个Button 拖放到TableLayout下面的右下角空白处。它应该在TableLayout的外面并和它右对齐。

• 步骤十三

修改该按钮的属性，文本设置为"OK"

 

 

• 步骤十四

点击"Generate"按钮来生成.xml文件

• 步骤十五

在Eclipse中，创建一个新的Android工程

• 步骤十六

用第十五步骤生成的XML来替换res/layouts/mian.xml文件内容。

• 步骤十七

运行你的新工程，你应该在Android中看到你的GUI。它应该像这样：

• 完整XML文件

2. android:id="@+id/widget49"
3. android:layout_width="fill_parent"
4. android:layout_height="fill_parent"
5. xmlns:android="http://schemas.android.com/apk/res/android">
7.     android:id="@+id/widget54"
8.     android:layout_height="160px"
9.     androidrientation="vertical"
10.     android:stretchColumns="1"
11.     android:layout_alignParentTop="true"
12.     android:layout_centerHorizontal="true" android:layout_width="fill_parent">
13.    
14.         android:id="@+id/widget55"
15.         android:layout_width="fill_parent"
16.         android:layout_height="wrap_content"
17.         androidrientation="horizontal">
18.        
19.             android:id="@+id/widget58"
20.             android:layout_width="wrap_content"
21.             android:layout_height="wrap_content"
22.             android:text="Name">
23.       
24.       
25.             android:id="@+id/widget61"
26.             android:layout_width="wrap_content"
27.             android:layout_height="wrap_content"
28.             android:textSize="18sp">
29.        
30.    
31.    
32.         android:id="@+id/widget56"
33.         android:layout_width="fill_parent"
34.         android:layout_height="wrap_content"
35.         androidrientation="horizontal">
36.        
37.             android:id="@+id/widget59"
38.             android:layout_width="wrap_content"
39.             android:layout_height="wrap_content"
40.             android:text="hone">
41.        
42.        
43.             android:id="@+id/widget62"
44.             android:layout_width="wrap_content"
45.             android:layout_height="wrap_content"
46.             android:textSize="18sp">
47.        
48.    
49.    
50.         android:id="@+id/widget57"
51.         android:layout_width="fill_parent"
52.         android:layout_height="wrap_content"
53.         androidrientation="horizontal">
54.        
55.             android:id="@+id/widget60"
56.             android:layout_width="wrap_content"
57.             android:layout_height="wrap_content"
58.             android:text="E-Mail">
59.        
60.        
61.             android:id="@+id/widget63"
62.             android:layout_width="wrap_content"
63.             android:layout_height="wrap_content"
64.             android:textSize="18sp">
65.        
66.    
68.     android:id="@+id/widget64"
69.     android:layout_width="wrap_content"
70.     android:layout_height="wrap_content"
71.     android:text="Button"
72.     android:layout_below="@+id/widget54"
73.     android:layout_alignRight="@+id/widget54">

• 结果