首页 > Android > Activity之常见布局初步

Activity之常见布局初步

前一篇博客记录了在activity中有哪些控件可供我们使用,既然牵涉到控件,那么肯定会牵涉到控件的布局,也就是在activity中怎么摆放这些东西,我们先看看activity的布局方式有哪些:LinearLayout线性布局、TableLayout表格布局、RelativeLayout相对布局、AbsoluteLayout绝对布局、FrameLayout帧布局等五种,各有各的用途和用法,其中老夫认为最常用的是前三种,最最常用的应该就是前两种了,今天我们就介绍一下前三种的用法。

首先看第一个也是非常常见的也是非常简单的LinearLayout线性布局方式,布局文件为:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

<!--
        android:id                  为控件指定相应的ID
        android:text                指定控件中显示的文字,需要注意的是:这里最好使用strings.xml
        android:gravity             指定控件中内容的基本位置,比如居中、靠左等
        android:textSize            指定控件中字体的大小
        android:background          指定控件的背景色,使用RGB命名法
        android:width               指定控件的宽度
        android:height              指定控件的高度
        android:layout_width        和父控件的关系,例如是匹配内容还是在水平方向上填满父控件
        android:layout_height       和父控件的关系,例如是匹配内容还是在垂直方向上填满父控件
        android:padding*            指定控件的内边距,也就是说控件中内容
        android:singleLine=         布尔值,如果为真,则控件中的内容将在一行中显示
-->

    <TextView
        android:id="@+id/firstTextView"
        android:text="第一行"
        android:gravity="center_vertical"
        android:textSize="20pt"
        android:background="#ff0000"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="10dip"
        android:paddingTop="20dip"
        android:paddingRight="30dip"
        android:paddingBottom="40dip"
        android:singleLine="false"
		/>
    <TextView
        android:id="@+id/secondTextView"
        android:text="第二行"
        android:gravity="center_vertical"
        android:textSize="30pt"
        android:background="#00ff00"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
		/>
</LinearLayout>

其中LinearLayout表示采用线性布局方式,第五行:android:orientation=”vertical”表示是在水平方向还是在垂直方向上线性布局,注释中为该元素设置样式的各种含义。
需要说明的是,LinearLayout是可以嵌套的,下面给出一个例子:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:layout_weight="1" >

        <TextView
            android:id="@+id/firstTextView"
            android:text="第一行"
            android:gravity="center_vertical"
            android:textSize="20pt"
            android:background="#ff0000"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="10dip"
            android:paddingTop="20dip"
            android:paddingRight="30dip"
            android:paddingBottom="40dip"
            android:singleLine="false"
            />
        <TextView
            android:id="@+id/secondTextView"
            android:text="第二行"
            android:gravity="center_vertical"
            android:textSize="30pt"
            android:background="#00ff00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:layout_weight="1" >
    
        <TextView
            android:id="@+id/firstTextView"
            android:text="第一行"
            android:gravity="center_vertical"
            android:textSize="20pt"
            android:background="#ff0000"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="10dip"
            android:paddingTop="20dip"
            android:paddingRight="30dip"
            android:paddingBottom="40dip"
            android:singleLine="false"
            />
        <TextView
            android:id="@+id/secondTextView"
            android:text="第二行"
            android:gravity="center_vertical"
            android:textSize="30pt"
            android:background="#00ff00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    </LinearLayout>
</LinearLayout>

关于嵌套需要说明的是,1. 最外层的android:orientation=”vertical”表示内部所有的LinearLayout的布局方式,当然每一个LinearLayout的android:orientation=”vertical”表明自己内部每一个元素的布局方式;2. 每一个LinearLayout的android:layout_weight=”1″表示该LinearLayout的权重,即该LinearLayout在所有空间中所占的比例。最后需要说明的是,这个我是把第一个文件直接拷过去的,所以ID有重复,大家记得改一下
下面我们看第二种布局方式:TableLayout表格布局,其中我个人感觉这种布局方式用的应该不是很多,下面我们看看其布局文件:

<TableLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
	android:stretchColumns="0" >

    <TableRow >
        <TextView
            android:text="第一列"
            android:padding="3dip" />
        <TextView
            android:text="第二列"
            android:gravity="right"
            android:padding="3dip" />
    </TableRow>
    
    <TableRow >
        <TextView
            android:text="第一列"
            android:padding="3dip" />
        <TextView
            android:text="第一列"
            android:gravity="right"
            android:padding="3dip" />
    </TableRow>
    
</TableLayout>

这个布局文件看着也比较容易明白,因为设置样式的方法和LinearLayout几乎一样,所以就没写,需要说明的是:
1. 这个布局文件的第五行 android:stretchColumns=”0″ 表示如果一行中所有的列不能把activity的宽度全部占完的话,把那一列拉伸,也就是把剩余的控件分给哪一列,计数从 0 开始;2. 一个TableRow表示一行,每一个TableRow的一个元素表示一列,其余的和线性布局几乎一样。
下面我们看我认为应该是使用最多的一个布局方式:RelativeLayout相对布局,说这个布局方式使用的比较多,主要是因为这种布局方式比较灵活,他是一个控件的位置相对于另一个控件的位置,所以无论手机屏幕怎么变,他们的相对位置永远不会变,好,同样是看一个布局的例子:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    
<!-- 
        android:layout_above                该控件的底部置于给定ID的控件之上
        android:layout_below                该控件的顶部置于给定ID的控件之下
        android:layout_toLeftOf             该控件的右边缘和给定ID的控件的左边缘对齐
        android:layout_toRightOf            该控件的左边缘和给定ID的控件的右边缘对齐
        
        android:layout_alignBaseline        该控件的baseline和给定ID的控件baseline对齐
        android:layout_alignLeft            将该控件的左边缘和给定ID的控件的左边缘对齐
        android:layout_alignTop             将该控件的顶部边缘和给定ID的控件的顶部边缘对齐
        android:layout_alignRight           将该控件的右边缘和给定ID的控件的右边缘对齐
        android:layout_alignBottom          将该控件的底部边缘和给定ID的控件的底部边缘对齐
        
        android:layout_alignStart           将该控件的头部和给定ID的控件的头部对齐
        android:layout_alignEnd             将该控件的尾部和给定ID的控件的尾部对齐
        android:layout_alignParentStart     如果该值为true,将该控件的头部和父控件的头部对齐
        android:layout_alignParentEnd       如果该值为true,将该控件的头部和父控件的底部对齐
        
        android:layout_alignParentLeft      如果该值为true,则将该控件的左边和父控件的左边对齐
        android:layout_alignParentTop       如果该值为true,则将该控件的顶部和父控件的顶部对齐
        android:layout_alignParentRight     如果该值为true,则将该控件的右边和父控件的右边对齐
        android:layout_alignParentBottom    如果该值为true,则将该控件的底部和父控件的底部对齐
        
        android:layout_centerHorizontal     如果该值为true,则将该控件置于水平方向的中央
        android:layout_centerInParent       如果该值为true,则将该控件置于父控件的正中央
        android:layout_centerVertical       如果该值为true,则将该控件置于垂直方向的中央
-->
    <TextView
        android:id="@+id/textView"
        android:text="第一行"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />
    <EditText
        android:id="@+id/entry"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:drawable/editbox_background"
        android:layout_below="@id/textView"
        />
    <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="10px"
        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>

我相信看了这些布局文件,大家对布局有了一定的认识,再做一些实验,就知道怎么用了,尤其是从J2EE转过来的程序猿,理解起来这些可以说没有一点压力,需要说明的:老夫任务布局的嵌套其实用的应该是非常非常多的,但是在这篇文章里面,老夫只举了一个例子,还是LinearLayout的自身嵌套,并不是说明只有LinearLayout可以嵌套,而是所有的布局类型都可以相互嵌套,这样的话我们就可以灵活的做出各种各种的样式。
另外需要说明的一点是:这些属性并不是我们只能在布局文件中设定,我们同时也可以在Java代码中灵活的设置!

PS:第一次写Android的东西,既是初学还是自学,也没做过项目,所以不免有错误的地方和有点抓不住重点,还请大家能留言交流,谢谢

全文完,如果本文对您有所帮助,请花 1 秒钟帮忙点击一下广告,谢谢。

作 者: BridgeLi,https://www.bridgeli.cn
原文链接:http://www.bridgeli.cn/archives/139
版权声明:非特殊声明均为本站原创作品,转载时请注明作者和原文链接。
分类: Android 标签: ,
  1. 本文目前尚无任何评论.
  1. 本文目前尚无任何 trackbacks 和 pingbacks.

请输入正确的验证码