手记

Android零基础入门第29节:善用TableLayout表格布局,事半功倍

前面学习了线性布局和相对布局,线性布局虽然方便,但如果遇到控件需要排列整齐的情况就很难达到要求,用相对布局又比较麻烦,为此Android系统中提供了表格布局。

                                              

一、认识TableLayout

表格布局就是让控件以表格的形式来排列控件,只要将控件放在单元格中,控件就可以整齐地排列,使用TableLayout标签。

TableLayout继承了 LinearLayout,因此它的本质依然是线性布局管理器。每次向TableLayout中添加一个TableRow,该TableRow就是一个表格行,TableRow也是容器,因此它也可以不断地添加其他组件,每添加一个子组件该表格就增加一列。如果直接向TableLayout中添加组件,那么这个组件将直接占用一行。

在表格布局中,列的宽度由该列中最宽的那个单元格决定,整个表格布局的宽度则取决于父容器的宽度(默认总是占满父容器本身)。

在表格布局管理器中,可以为单元格设置如下3种行为方式。

Shrinkable:如果某个列被设为Shrinkable,那么该列的所有单元格的宽度可以被收缩,以保证该表格能适应父容器的宽度。

Stretchable:如果某个列被设为Stretchable,那么该列的所有单元格的宽度可以被拉伸,以保证组件能完全填满表格空余空间。

Collapsed:如果某个列被设为Collapsed,那么该列的所有单元格会被隐藏。

TableLayout继承了 LinearLayout,因此它完全可以支持LinearLayout所支持的全部XML属性。除此之外,TableLayout还支持如下表所示的XML属性和相关方法。

二、示例

接下来通过一个简单的示例程序来学习TableLayout的使用用法。

同样使用WidgetSample工程,继续使用app/main/res/layout/目录下的activity_main.xml文件,在其中填充如下代码片段:

[代码]xml代码:

?

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

              android:layout_width="match_parent"

              android:layout_height="match_parent"

              android:orientation="vertical">

 

    <!-- 定义第一个表格布局,指定第2列允许收缩,第3列允许拉伸 -->

    <TableLayout

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:shrinkColumns="1"

        android:stretchColumns="2">

        <!--   直接添加按钮,它自己会占一行 -->

        <Button

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="独自一行的按钮"/>

        <!--   添加一个表格行   -->

        <TableRow>

            <!--   为该表格行添加三个按钮 -->

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="普通按钮"/>

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="收缩的按钮"/>

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="拉伸的按钮"/>

        </TableRow>

    </TableLayout>

 

    <!-- 定义第2个表格布局 ,指定第2列隐藏-->

    <TableLayout

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:collapseColumns="1">

        <!--   添加一个表格行   -->

        <TableRow>

            <!--   为该表格行添加三个按钮 -->

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="普通按钮1"/>

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="普通按钮2"/>

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="普通按钮3"/>

        </TableRow>

    </TableLayout>

 

    <!-- 定义第3个表格布局,指定第2列和第3列可以被拉伸-->

    <TableLayout

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:stretchColumns="1,2">

        <!--定义一个表格行-->

        <TableRow>

            <!--   为该表格行添加三个按钮 -->

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="普通按钮" />

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="拉伸的按钮" />

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="拉伸的按钮" />

        </TableRow>

        <!--定义一个表格行-->

        <TableRow>

            <!--   为该表格行添加两个按钮 -->

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="普通按钮" />

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="拉伸的按钮" />

        </TableRow>

    </TableLayout>

</LinearLayout>

上面页面中定义了 3个TableLayout,3个TableLayout中粗体字代码指定了它们对各列的控制行为。

第1个TableLayout,指定第2列允许收缩,第3列允许拉伸。

第2个TableLayout,指定第2列被隐藏。

第3个TableLayout,指定第2列和第3列允许拉伸。

运行程序,可以看到效果。

需要注意的是TableRow不需要设置宽度layout_width和高度layoutJieight,其宽度一定是match_parent,即自动填充父容器,高度一定为wrap_content,即根据内容改变高度。但对于TableRow中的其他控件来说,是可以设置宽度和高度的,但必其须是 wrap_content 或者 fill_parent。

到此,TableLayout的示例结束,关于TableLayout的更多用法可以多动手练习。


今天就先到这里,如果有问题欢迎留言一起探讨,也欢迎加入Android零基础入门技术讨论微信群,共同成长!

原文链接:http://www.apkbus.com/blog-205190-68577.html

0人推荐
随时随地看视频
慕课网APP