zoukankan      html  css  js  c++  java
  • 【转】Pro Android学习笔记(二五):用户界面和控制(13):LinearLayout和TableLayout

    目录(?)[-]

    1. 布局Layout
      1. 线性布局LinearLayout
      2. 表格布局TableLayout

    布局Layout

    Layout是容器,用于对所包含的view进行布局。layout是view的子类,所以可以作为view嵌入到其他的layout中。Android的layout有LinearLayout、TableLayout,RelativeLayout、FrameLayout、GridLayout。

    线性布局:LinearLayout

    这是最常用的,有anroid:orientation来确定排列的方向。在view属性中与布局相关的常用的属性有weight和gravity。下面是一个例子垂直的布局。

    <?xml version="1.0" encoding="utf-8"?> 
    <LinearLayout  ……  android:orientation="vertical" > 
         <EditText android:layout_width="match_parent" 
            android:layout_height="wrap_content" 
            android:text="one" 
            android:gravity="left" 
            android:layout_weight="0.0"/

        <EditText android:layout_width="match_parent" 
            android:layout_height="wrap_content" 
            android:text="two" 
            android:gravity="center" 
            android:layout_weight="1.0
    "/> 
        <EditText android:layout_width="match_parent" 
            android:layout_height="wrap_content" 
            android:text="three" 
            android:gravity="right" 
            android:layout_weight="0.0"
    /> 
    </LinearLayout>

    android:gravity是view中内容在该view中的位置,可以为top,buttom,left, center, right, top, bottom, center_vertical(超出范围,将上下裁剪掉), clip_horizontal,fill,fill_vertical,fill_horizion。view有另一个属性和它相似,就是android:layout_gravity,android:layout_gravity是view在容器中的位置。

       <Button android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:text="TEST" 
            android:layout_gravity="right"/>

    android:layout_weight是view所占空间的权重。0.0是比较特别的表示,表明必须占据所需的空间,不参与空间的分割。在例子中one和three都是0.0,系统为他们预留了最上和最下的位置,而two占据了1,表明剩余参与分配的空间,由于剩余只有two一个控件,全部给了two。0.0是很有用的方式,例如Pro Android学习笔记(十九):用户界面和控制(7):ListView,能够确保listview最下方留下一button的空间,无论list有多长,用户都不需要拉到最后才看到button,确保button一定出现在屏幕的下方。

    表格布局:TableLayout

    TableLayout是表格布局方式。下面是最简单的例子:

    <?xml version="1.0" encoding="utf-8"?>
    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent" 
        android:layout_height="match_parent" > 
        <TableRow > 
            <TextView android:text="One:" 
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content"/> 
            <EditText android:text="Hello" 
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content"/> 
        </TableRow> 

        <TableRow > 
            <TextView android:text="Two:" 
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content"/> 
            <EditText android:text="World" 
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content"/> 
        </TableRow>  
        
    </TableLayout>

    TableLayout的子view是TableRow,TableRow是表格的一行。但是TableLayout也可以用其它view作为它的child,每个child就是一行,即使我们设置android:layout_width=”wrap_content“也不起作用,认为都是占据一行位置。表格的列数是多少,由最多列的TableRow决定。试验如下:

    <?xml version="1.0" encoding="utf-8"?>
    <TableLayout ......> 
        <TableRow > <!-- 有2列 --> 
            <TextView android:text="One:" ……/> 
            <EditText android:text="Hello" ……/> 
        </TableRow> 

        <TableRow > <!-- 有3列,表格列数为3 --> 
            <TextView android:text="Two:" …… /> 
            <EditText android:text="World" …… /> 
            <EditText android:text="History" ……/> 
        </TableRow> 
        <!-- 采用EditText作为child,占据整行,即便设置wrap_content,也是占据整行 -->
        <EditText android:text="Hello my Friend!" 
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"/> 
    </TableLayout>

    缺省下,表格的cell都是紧凑布局,常会导致表格的最右方让有空余位置。如果我们希望某列或者某些列能够延展,将空余位置分配给这些列,可以通过strechColumns指出需要延展的列,从0开始计算。同样的可以使用shirnkColumns设置可压缩的列,如果其他列位置不够,则压缩所设置的shirnkColumns。

    <?xml version="1.0" encoding="utf-8"?>
    <TableLayout ……  
        android:stretchColumns="0,1,2" > 
        <EditText android:text="Full Space here" …… />
        <TableRow > 
            <TextView android:text="One" ……/> 
            <TextView android:text="Two" ……/> 
            <TextView android:text="Three" ……/>        
        </TableRow> 
    </TableLayout>

    下面,我们试验几个变化,同时温习一下控件间隔的设置。

    <?xml version="1.0" encoding="utf-8"?>
    <TableLayout ……  android:stretchColumns="0,1,2"> 
        <TableRow > 
            <TextView android:text="One" …… /> 
            <TextView android:text="Two"…… /> 
            <TextView android:text="Three" …… /> 
        </TableRow>   
       <!-- 通过layout_span,cell可以占据多个位置 -->  
        <TableRow > 
            <EditText android:text="One" ……      android:layout_span="2"/>
            <EditText android:text="Two" ……/> 
        </TableRow>  
        <!-- 试验padding,padding表示在view内部,内容到view边框的距离,可以分别设置四边 -->
        <TableRow> 
            <Button android:text="One" ......     android:padding="30px"/>
            <Button android:text="Two" … … /> 
            <Button android:text="Three" … … /> 
        </TableRow>  
        <!-- 试验margin,margin是view与容器边框的距离,这是设置view外部的留空。而padding是view内部的留空,一般而言,属性中带有layout_xxx,都是与外部容器之间的关系。 -->
        <TableRow> 
            <Button android:text="One" …… /> 
            <Button android:text="Two" ……     android:layout_marginLeft="20px"/>
            <Button android:text="Three" …… /> 
        </TableRow> 
    </TableLayout>

    相关链接: 我的Android开发相关文章

  • 相关阅读:
    童年记忆
    展现、通讯、IO
    通电自动开机
    英雄每多屠狗辈,自古侠女出风尘(看黄金大劫案有感)
    反射整理学习<一>(转)
    在ASP.NET中跟踪和恢复大文件下载
    高内聚、低耦合
    你需要权限才能执行此操作
    WP7应用开发笔记(5) 通信设计
    一个简单的软件工程流程
  • 原文地址:https://www.cnblogs.com/blongfree/p/5047940.html
Copyright © 2011-2022 走看看