Android开发五大布局及其属性整合

  经过一天的学习,我了解到在安卓开发中我们常用的布局方式有这么几种:

  1.LinearLayout ( 线性布局 ) :(里面只可以有一个控件,并且不能设计这个控件的位置,控件会放到左上角)

  线性布局分为水平线性和垂直线性二者的属性分别为: android:orientation= " horizontal "       android:orientation= "vertical" 。

       LinearLayout以你为它设置的垂直或水平的属性值,来排列所有的子元素。所有的子元素都被堆放在其它元素之后,因此一个垂直列表的每一行只会有一个元素,而不管他们有多宽,而一个水平列表将会只有一个行高(高度为最高子元素的高度加上边框高度)。LinearLayout保持子元素之间的间隔以及互相对齐(相对一个元素的右对齐、中间对齐或者左对齐)。 

LinearLayout还支持为单独的子元素指定weight 。好处就是允许子元素可以填充屏幕上的剩余空间。这也避免了在一个大屏幕中,一串小对象挤成一堆的情况,而是允许他们放大填充空白。子元素指定一个weight 值,剩余的空间就会按这些子元素指定的weight 比例分配给这些子元素。默认的 weight 值为0。例如,如果有三个文本框,其中两个指定了weight 值为1,那么,这两个文本框将等比例地放大,并填满剩余的空间,而第三个文本框不会放大。

我们看一下效果图:

预览效果

其中Main.xm l代码如下: 

<?xml version="1.0" encoding="utf-8"?>  
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:orientation="vertical"  
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent">  
   <LinearLayout  
    android:orientation="vertical"  
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent"  
    android:layout_weight="2">  
    <TextView  
        android:text="Welcome to Mr Wei's blog"  
        android:textSize="15pt"  
        android:layout_width="fill_parent"  
        android:layout_height="wrap_content"  
     />  
    </LinearLayout>  
    <LinearLayout  
    android:orientation="horizontal"  
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent"  
    android:layout_weight="1">  
     
   <TextView  
        android:text="red"  
  
        android:gravity="center_horizontal" //这里字水平居中  
        android:background="#aa0000"  
        android:layout_width="wrap_content"  
        android:layout_height="fill_parent"  
        android:layout_weight="1"/>  
    <TextView  
        android:text="green"  
        android:gravity="center_horizontal "  
        android:background="#00aa00"  
        android:layout_width="wrap_content"  
        android:layout_height="fill_parent"  
        android:layout_weight="1"/>     
    </LinearLayout>  
</LinearLayout>  

   2.RelativeLayout ( 相对布局 ) : (里面可以放多个控件,但是一行只能放一个控件)

  附加几类 RelativeLayout 的属性供大家参考:

  第一类 : 属性值为 true 或 false

  android:layout_centerHrizontal 水平居中

  android:layout_centerVertical 垂直居中

  android:layout_centerInparent 相对于父元素完全居中

  android:layout_alignParentBottom 贴紧父元素的下边缘

  android:layout_alignParentLeft 贴紧父元素的左边缘

  android:layout_alignParentRight 贴紧父元素的右边缘

  android:layout_alignParentTop 贴紧父元素的上边缘

  android:layout_alignWithParentIfMissing 若找不到兄弟元素以父元素做参照物

  第二类:属性值必须为 id 的引用名” @id/id-name” 

        android:layout_below 在某元素的下方

  android:layout_above 在某元素的上方

  android:layout_toLeftOf 在某元素的左边

  android:layout_toRightOf 在某元素的右边

  android:layout_alignTop 本元素的上边缘和某元素的的上边缘对齐

  android:layout_alignLeft 本元素的左边缘和某元素的的左边缘对齐

  android:layout_alignBottom 本元素的下边缘和某元素的的下边缘对齐

  android:layout_alignRight 本元素的右边缘和某元素的的右边缘对齐

  第三类:属性值为具体的像素值,如 30dip , 40px

  android:layout_marginBottom 离某元素底边缘的距离

  android:layout_marginLeft 离某元素左边缘的距离

  android:layout_marginRight 离某元素右边缘的距离

  android:layout_marginTop 离某元素上边缘的距离

RelativeLayout 允许子元素指定他们相对于其它元素或父元素的位置(通过ID 指定)。因此,你可以以右对齐,或上下,或置于屏幕中央的形式来排列两个元素。元素按顺序排列,因此如果第一个元素在屏幕的中央,那么相对于这个元素的其它元素将以屏幕中央的相对位置来排列。如果使用XML 来指定这个 layout ,在你定义它之前,被关联的元素必须定义。 

让我们看一下效果图:

13

其中Main.xml 代码如下: 

<?xml version="1.0" encoding="utf-8"?>  
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent">  
    <TextView  
        android:id="@+id/label"  
        android:layout_width="fill_parent"  
       android:layout_height="wrap_content"  
        android:text="Welcome to Mr Wei's blog:"/>  
    <EditText  
        android:id="@+id/entry"  
        android:layout_width="fill_parent"  
        android:layout_height="wrap_content"  
        android:layout_below="@id/label"/>  
    <Button  
        android:id="@+id/ok"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:layout_below="@id/entry"  
        android:layout_alignParentRight="true"  
        android:layout_marginLeft="10dip"  
        android:text="OK" />  
    <Button  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:layout_toLeftOf="@id/ok"  
        android:layout_alignTop="@id/ok"  
        android:text="Cancel" />  
</RelativeLayout>  
   

  3.TableLayout ( 表格布局 ) : (这个要和TableRow配合使用,很像html里面的table)

       这个表格布局不像HTML中的表格那样灵活,只能通过 TableRow 属性来控制它的行而列的话里面有几个控件就是几列(一般情况)。 如: 

  表示两行两列的一个表格。

  android:gravity="center" 书面解释是权重比。其时就是让它居中显示。它还可以动态添加里面的每行每列。如下代码所示:

  /*根据id查找表格对象*/

  TableLayout tableLayout = (TableLayout) findViewById(R.id.table01);

  /*创建列对象*/

  TableRow tableRow = new TableRow(this);

  /*文本框对象*/

  TextView temp = new TextView(this);

  temp.setText("text的值");

  /*将此文本添加到列中*/

  tableRow.addView(temp);

  android:stretchColumns="1,2,3,4" 它的意思就是自动拉伸1,2,3,4列。

TableLayout 将子元素的位置分配到行或列中。一个TableLayout 由许多的TableRow 组成,每个TableRow 都会定义一个 row (事实上,你可以定义其它的子对象,这在下面会解释到)。TableLayout 容器不会显示row 、cloumns 或cell 的边框线。每个 row 拥有0个或多个的cell ;每个cell 拥有一个View 对象。表格由列和行组成许多的单元格。表格允许单元格为空。单元格不能跨列,这与HTML 中的不一样。 

下面让我们看一下效果图:

14

其中Main.xml 代码如下: 

<?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..." />  
        <TextView android:text="Ctrl-O" android:gravity="right" />  
    </TableRow>  
    <TableRow>  
        <TextView android:layout_column="1" android:text="Save..." />  
        <TextView android:text="Ctrl-S" android:gravity="right" />  
    </TableRow>  
    <View android:layout_height="2dip" android:background="#FF909090" /> //这里是上图

中的分隔线  
    <TableRow>  
        <TextView android:text="X" />  
        <TextView android:text="Export..." />  
        <TextView android:text="Ctrl-E" android:gravity="right " />  
    </TableRow>  
    <View android:layout_height="2dip" android:background="#FF909090" />  
    <TableRow>  
        <TextView android:layout_column="1" android:text="Quit"  
            android:padding="3dip" />  
    </TableRow>  
</TableLayout>   

  4.AbsoluteLayout ( 绝对布局 ) : (里面可以放多个控件,并且可以自己定义控件的x,y的位置)

AbsoluteLayout 可以让子元素指定准确的x/y坐标值,并显示在屏幕上。(0, 0)为左上角,当向下或向右移动时,坐标值将变大。AbsoluteLayout 没有页边框,允许元素之间互相重叠(尽管不推荐)。我们通常不推荐使用 AbsoluteLayout ,除非你有正当理由要使用它,因为它使界面代码太过刚性,以至于在不同的设备上可能不能很好地工作。 
我们看一下效果图:

15

其中Main.xm l代码如下:

01.<?xml version="1.0" encoding="utf-8"?>  
02.<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"  
03.    android:orientation="vertical"  
04.    android:layout_width="fill_parent"  
05.    android:layout_height="fill_parent"  
06.    >  
07.<EditText  
08.    android:text="Welcome to Mr Wei's blog"  
09.    android:layout_width="fill_parent"  
10.    android:layout_height="wrap_content"  
11./>  
12.<Button  
13.    android:layout_x="250px" //设置按钮的X坐标  
14.    android:layout_y="40px" //设置按钮的Y坐标  
15.    android:layout_width="70px" //设置按钮的宽度  
16.    android:layout_height="wrap_content"  
17.    android:text="Button"  
18./>  
19.</AbsoluteLayout>  

  5.FrameLayout ( 帧布局 ) :(里面可以放多个控件,不过控件的位置都是相对位置)

FrameLayout是最简单的一个布局对象。它被定制为你屏幕上的一个空白备用区域,之后你可以在其中填充一个单一对象 — 比如,一张你要发布的图片。所有的子元素将会固定在屏幕的左上角;你不能为FrameLayout中的一个子元素指定一个位置。后一个子元素将会直接在前一个子元素之上进行覆盖填充,把它们部份或全部挡住(除非后一个子元素是透明的)。 

  在它里面的控件都是按后面的一个控件叠加在前一个控件上来显示的,所有元素都被放置在最左上角。 如:

  
  android:layout_height="wrap_content" android:layout_weight="1">

  
  android:layout_height="wrap_content" android:visibility="invisible"

  android:src="http://android.tgbus.com/Android/androidnews/201204/@drawable/lotusleaf">

  
  android:layout_height="wrap_content" android:src="http://android.tgbus.com/Android/androidnews/201204/@drawable/frog_right"

  android:visibility="invisible">

  表示的是id为f1的控件叠加在id为iv1的控件上面显示

  (LinearLayout 和 RelativeLayout 应该又是其中用的较多的两种。AbsoluteLayout 比较少用,因为它是按屏幕的绝对位置来布局的如果屏幕大小发生改变的话控件的位置也发生了改变。这个就相当于HTML中的绝对布局一样,一般不推荐使用 )

  注意事项:

  1 、各布局不要乱用各自的属性。比如把属于 AbsoluteLayout 布局的android:layout_x和android:layout_y用到 LinearLayout 布局或 RelativeLayout 布局,或者把 RelativeLayout 布局的 below , rightof 等属性应用到其他布局中。这样做虽然不会报错,

但这是白浪费感情的工作,根本达不到我们需要的效果。

  2 、关于android:layout_width="fill_parent" 和 android:layout_height="wrap_content" ,这是对每个布局宽和高的设置。 wrap_content 可表示随着其中控件的不同而改变这个布局的宽度或高度,类似于自动设置宽和高, fill_parent 使布局填充整个屏幕

,另外还有一种 match_parent ,它本质上和 fill_parent 一样,并从 API Level8 开始替代 fill_parent 。

  TextView 的属性 :

  android:autoLink //设置是否当文本为URL链接/email/电话号码/map时,文本显示为可点击的链接。可选值(none/web /email/phone/map/all)

  android:autoText //如果设置,将自动执行输入值的拼写纠正。此处无效果,在显示输入法并输入的时候起作用

  android:bufferType //指定getText()方式取得的文本类别。选项editable 类似于StringBuilder可追加字符,也就是说getText后可调用append方法设置文本内容。spannable 则可在给定的字符区域使用样式

  android:capitalize //设置英文字母大写类型。此处无效果,需要弹出输入法才能看得到,参见EditView此属性说明

  android:cursorVisible //设定光标为显示/隐藏,默认显示

  android:digits //设置允许输入哪些字符。如“1234567890.+-*/% ()”

  android:drawableBottom //在text的下方输出一个drawable,如图片。如果指定一个颜色的话会把text的背景设为该颜色,并且同时和background使用时覆盖后者

  android:drawableLeft //在text的左边输出一个drawable,如图片

  android:drawablePadding //设置text与drawable(图片)的间隔,与drawableLeft、 drawableRight、drawableTop、drawableBottom一起使用,可设置为负数,单独使用没有效果

  android:drawableRight //在text的右边输出一个drawable

  android:drawableTop //在text的正上方输出一个drawable

  android:editable //设置是否可编辑

  android:editorExtras //设置文本的额外的输入数据

  android:ellipsize //设置当文字过长时,该控件该如何显示。有如下值设置:”start”—?省略号显示在开头;”end” ——省略号显示在结尾;”middle”—-省略号显示在中间;”marquee” ——以跑马灯的方式显示(动画横向移动)

  android:freezesText //设置保存文本的内容以及光标的位置

  android:gravity //设置文本位置,如设置成“center”,文本将居中显示

  android:hintText //为空时显示的文字提示信息,可通过textColorHint设置提示信息的颜色。此属性在 EditView中使用,但是这里也可以用

        Drawable文件夹里面的图片命名是不能大写的。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值