Android中的布局方式(一)
【1】FrameLayout帧布局
FrameLayout是最简单的布局方式。它基本上就是用单个物件,例如一幅图片,来填充你屏幕上的一片空白区域。FrameLayout上所有的子元素都重叠在屏幕的左上角;你不能为子元素指定一个不同的位置。因此,子view就会简单地在之前的子view上重画,部分或者全部覆盖(除非新的物件是透明的)。
示例截图:
XML布局文件如下:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<!-- dip 表示与密度无关的像素,各个TextView标签沉底显示 -->
<TextView android:id="@+id/tv1"
android:layout_width="120dip"
android:layout_height="180dip"
android:gravity="bottom"
android:textColor="#FFFFFF"
android:background="#CC0000"
android:text="第 1 个TextView"/>
<TextView android:id="@+id/tv2"
android:layout_width="150dip"
android:layout_height="150dip"
android:gravity="bottom"
android:textColor="#FFFFFF"
android:background="#00CC00"
android:text="第 2 个TextView"/>
<TextView android:id="@+id/tv3"
android:layout_width="180dip"
android:layout_height="120dip"
android:gravity="bottom"
android:textColor="#FFFFFF"
android:background="#0000CC"
android:text="第 3 个TextView"/>
<Button android:id="@+id/btn"
android:layout_width="fill_parent"
android:layout_height="40dip"
android:text="后来者居上"/>
</FrameLayout>
【2】LinearLayout线性布局
线性布局使所有子控件在某水平或竖直方向上自成一行,具体的方向取决于你怎么定义orientation属性。所有的子控件都一个紧挨着一个,所以一个竖直的序列每行都只能拥有一个子控件,不管它们有多宽,同样的,一个水平的序列将只拥有一个行高度(最高的子控件的高度加上控件周边的填充)。一个线性布局会为每一个子控件处理它们之间的空隙及摆放位置(靠右,居中,或者左对齐)。
线性布局也支持为每一个独立的自控件赋上权值(weight)。这个属性为一个view控件赋上一个“重要度”,并且允许它自动扩展来填满父view的剩余空间。子view们可以设置一个整型的权值,然后在布局中任何剩余的空间将被按照子view的权值来进行分配。默认权值是0。具体这么理解好了,假如只有两个控件,然后一个控件的权值是1,另一个是2,那么剩余空间的分配情况就是第一个占1/3,第二个占2/3。
具体见如下示例:
XML布局文件如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:id="@+id/tv1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="label1"
android:background="#CC0000"
android:layout_weight="1"/>
<TextView android:id="@+id/tv2"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="label2"
android:background="#00CC00"
android:layout_weight="2"/>
<TextView android:id="@+id/tv3"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="label3"
android:background="#0000CC"
android:layout_weight="3"/>
</LinearLayout>
需要说明的是,布局之间可以嵌套,也就是说在LinearLayout布局中可以嵌套LinearLayout或者是其他布局。实际上若是能够用好LinearLayout的话,也能实现较好的界面效果了。下面这个例子就是用LinearLayout搭建了一个简单的登录窗口:
XML布局文件如下:
<?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:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView android:id="@+id/tv1"
android:layout_width="90dip"
android:layout_height="wrap_content"
android:text="用户名:"
android:gravity="left"/>
<EditText android:id="@+id/et1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:maxLines="1"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView android:id="@+id/tv2"
android:layout_width="90dip"
android:layout_height="wrap_content"
android:text="密码:"
android:gravity="left"/>
<EditText android:id="@+id/et2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:maxLines="1"
android:password="true"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dip"
android:orientation="horizontal">
<Button android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" 登录 "
android:layout_marginLeft="160dip"/>
<Button android:id="@+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" 取消 "
android:layout_marginLeft="27dip"/>
</LinearLayout>
</LinearLayout>
说明:在使用LinearLayout布局时,要注意与layout_marginxxx、padding属性设置的配合。