菜单

金沙国际棋牌下载官网Android开发之详解五大布局

2020年1月15日 - 金沙国际唯一官网
金沙国际棋牌下载官网Android开发之详解五大布局

TableLayout是一个以行、列显示视图View的视图组

 

TableLayout表格布局,将子元素的位置分配到行或列中。TableLayout布局由许多的TableRow(行)
组成,它没有列的概念,列是由行中的控件数目决定的。TableLayout布局也是实际中常用的布局方式。
TableLayout布局不会显示行、列
、单元格的边框线。TableLayout布局应用如图7-17所示。
 
金沙国际棋牌下载官网 1

1、开始一个新的工程,名字叫做HelloTableLayout

为了适应各式各样的界面风格,Android系统提供了5种布局,这5种布局分别是:

图7-17 TableLayout1
TableLayout布局文件请参考代码清单7-20,完整代码请参考chapter7_5工程中tablelayout1.xml代码部分(chapter7_5/res/layout/tablelayout1.xml)。
【代码清单7-20】
<?xml version=”1.0″ encoding=”utf-8″?>
<TableLayout
xmlns:android=””
android:layout_width=”match_parent”
android:layout_height=”match_parent”>

2、打开res/layout/main.xml文件并且插入如下内容

LinearLayout(线性布局)

<TableRow>
<TextView android:text=”@string/row1_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row1_2″ android:padding=”3dip”
/>
<TextView android:text=”@string/row1_3″ android:padding=”3dip”
/>
</TableRow>
<TableRow>
<TextView android:text=”@string/row2_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row2_2″ android:padding=”3dip”
/>
<TextView android:text=”@string/row2_3″ android:padding=”3dip”
/>
</TableRow>
<TableRow>
<TextView android:text=”@string/row3_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row3_2″ android:padding=”3dip”
/>
<TextView android:text=”@string/row3_3″ android:padding=”3dip”
/>
</TableRow>
<TableRow>
<TextView android:text=”@string/row4_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row4_2″ android:padding=”3dip”
/>
<TextView android:text=”@string/row4_3″ android:padding=”3dip”
/>
</TableRow>
<TableRow>
<TextView android:text=”@string/row5_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row5_2″ android:padding=”3dip”
/>
<TextView android:text=”@string/row5_3″ android:padding=”3dip”
/>
</TableRow>
<TableRow>
<TextView android:text=”@string/row6_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row6_2″ android:padding=”3dip”
/>
<TextView android:text=”@string/row6_3″ android:padding=”3dip”
/>
</TableRow>

<?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:stretchColumns="1">
        <TableRow>
                <TextView
                        android:layout_column="1"
                        android:text="Open..."
                        android:padding="3dip"
                />
                <TextView
                        android:text="Ctrl-O"
                        android:gravity="right"
                        android:padding="3dip"
                />
        </TableRow>
        <TableRow>
                <TextView
                        android:layout_column="1"
                        android:text="Save..."
                        android:padding="3dip"
                />
                <TextView
                        android:text="Ctrl-S"
                        android:gravity="right"
                        android:padding="3dip"
                />
        </TableRow>
        <TableRow>
                <TextView
                        android:layout_column="1"
                        android:text="Save as..."
                        android:padding="3dip"
                />
                <TextView
                        android:text="Ctrl-Shift-S"
                        android:gravity="right"
                        android:padding="3dip"
                />
        </TableRow>
        <View
                android:layout_height="2dip"
                android:background="#FF909090"
        />
        <TableRow>
                <TextView
                        android:text="X"
                        android:padding="3dip"
                />
                <TextView
                        android:text="Import..."
                        android:padding="3dip"
                />
        </TableRow>
        <TableRow>
                <TextView
                        android:text="X"
                        android:padding="3dip"
                />
                <TextView
                        android:text="Export..."
                        android:padding="3dip"
                />
                <TextView
                        android:text="Ctrl-E"
                        android:gravity="right"
                        android:padding="3dip"
                />
        </TableRow>
        <View
                android:layout_height="2dip"
                android:background="#FF909090"
        />
        <TableRow>
                <TextView
                        android:layout_column="1"
                        android:text="Quit"
                        android:padding="3dip"
                />
        </TableRow>
</TableLayout>

TableLayout(表格布局)

</TableLayout>
下面再看一个合并单元格TableLayou布局应用图7-18所示。
 
金沙国际棋牌下载官网 2

注意到这个文件类似于HTML的table的结构,TableLayout元素就像是HTML中的<table>元素;TableRow就像是一一个<tr>元素;但是对于每一个单元格,你可以用各种视图元素,在这里例子里,每个单元格用TextView,在这些行之间,还有一个基本View,用来画水平线

RelativeLayout(相对布局)

图7-18 TableLayout2
TableLayout布局文件请参考代码清单7-21,完整代码请参考chapter7_5工程中tablelayout2.xml代码部分(chapter7_5/res/layout/tablelayout2.xml)。
【代码清单7-21】
<?xml version=”1.0″ encoding=”utf-8″?>
<TableLayout
xmlns:android=””
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:stretchColumns=”0,1,2″>
<TableRow>
<TextView android:text=”@string/row1_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row1_2″ android:padding=”3dip”
/>
<TextView android:text=”row1_3″ android:padding=”3dip” />
</TableRow>

TextView中的一些属性

AbsoluteLayout(绝对布局)

<TableRow>
<TextView android:text=”@string/row2_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row2_2″ android:padding=”3dip”
android:layout_span=”2″ android:background=”#ff0060″ />
</TableRow>

android:layout_column=”1″:表示控件放在标号为1的列上,标号是从0开始的
android:gravity=”right”:定义字体在父控件中显示在右边
android:stretchColumns=”1″:设置自动拉伸哪些列,列ID从0开始,多个列的话用”,”分隔。这里的作用是让第2列可以扩展到所有可用空间
android:shrinkColumns:设置自动收缩哪些列,列ID从0开始,多个列的话用”,”分隔
android:collapseColumns:设置自动隐藏哪些列,列ID从0开始,多个列的话用”,”分隔
顺便:android:layout_span表示一个控件占几列空间
下面的是基本的View,是在屏幕上画一条2dip高的一条横线
<View
android:layout_height=”2dip”
android:background=”#FF909090″
/>

FrameLayout(框架布局)

<TableRow>
<TextView android:text=”@string/row3_1″ android:padding=”3dip”
/>
<!– android:layout_column=”1″ –>
<TextView android:text=”@string/row3_2″ android:padding=”3dip”
/>
<TextView android:text=”row3_3″ android:padding=”3dip” />
</TableRow>

3、运行结果如下:

利用这五种布局,可以在屏幕上将控件随心所欲的摆放,而且控件的大小和位置会随着屏幕大小的变化作出相应的调整。下面是这五个布局在View的继承体系中的关系:
<ignore_js_op>金沙国际棋牌下载官网 3 

<TableRow>
<TextView android:text=”@string/row4_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row4_2″ android:padding=”3dip”
/>
<TextView android:text=”row4_3″ android:padding=”3dip” />
</TableRow>

金沙国际棋牌下载官网 4

一,LinearLayout(线性布局)

<TableRow>
<TextView android:text=”@string/row5_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row5_2″ android:padding=”3dip”
/>
<TextView android:text=”row5_3″ android:padding=”3dip” />
</TableRow>

    在一个方向上(垂直或水平)对齐所有子元素
一个垂直列表每行将只有一个子元素(无论它们有多宽)
一个水平列表只是一列的高度(最高子元素的高度来填充)

<TableRow>
<TextView android:text=”@string/row6_1″ android:padding=”3dip”
/>
<TextView android:text=”@string/row6_2″ android:padding=”3dip”
/>
<TextView android:text=”row6_3″ android:padding=”3dip” />
</TableRow>
</TableLayout>
TableLayout
标签内的android:stretchColumns=”0,1,2″属性是第一列、第二列、第三列自动调节列宽。<TableRow&
gt;内的TextView控件中的属性android:layout_span=”2″是合并一个单元格,如图7-18显示的粉色背景就是合并的单元
格。
                                       
出自《Android开发案例驱动教程》第七章

下面是一个简单的线性布局的例子:
<ignore_js_op>金沙国际棋牌下载官网 5

  1. 01 <?xml version=”1.0″ encoding=”utf-8″?> 
  2. 02 <LinearLayout 
  3. 03 xmlns:android=”” 
  4. 04 android:layout_width=”match_parent” 
  5. 05 android:layout_height=”match_parent”
    android:orientation=”vertical”> 
  6. 06 <EditText android:text=”EditText” 
  7. 07   
  8. 08 android:id=”@+id/editText1″ 
  9. 09   
  10. 10 android:layout_height=”wrap_content” 
  11. 11   
  12. 12 android:layout_width=”fill_parent”> 
  13. 13   
  14. 14 </EditText> 
  15. 15 <LinearLayout android:id=”@+id/linearLayout1″ 
  16. 16   
  17. 17 android:layout_height=”fill_parent” 
  18. 18   
  19. 19 android:layout_width=”fill_parent” 
  20. 20   
  21. 21 android:gravity=”right”> 
  22. 22 <Button android:id=”@+id/button2″ 
  23. 23   
  24. 24 android:text=”Button” 
  25. 25   
  26. 26 android:layout_width=”wrap_content” 
  27. 27   
  28. 28 android:layout_height=”wrap_content”></Button> 
  29. 29 <Button android:text=”Button” 
  30. 30   
  31. 31 android:id=”@+id/button1″ 
  32. 32   
  33. 33 android:layout_width=”wrap_content” 
  34. 34   
  35. 35 android:layout_height=”wrap_content”></Button> 
  36. 36 </LinearLayout> 
  37. 37 </LinearLayout>

复制代码

最外层布局为垂直线性布局,宽度为整个屏幕(fill_parent),高度为刚好适合子控件(wrap_content)。然后依次添加一个EditText,一个水平布局的LinearLayout,在这个线性布局里面,摆放两个Button,该线性布局的gravity属性设置为”right”,所以里面的两个Button靠右显示。

二,TableLayout(表格布局)

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图