上QQ阅读APP看本书，新人免费读10天
设备和账号都新为新人
2.4 FrameLayout——帧布局的应用
本节通过FrameLayout帧布局的应用构建了一个饮食介绍的界面，并通过本程序的实现介绍FrameLayout帧布局的具体应用。
1.实例概述
本节构建了一个饮食介绍的小程序，在本程序中可以显示需要的信息。在网页的右下角有一个“退出”按钮，单击“退出”按钮即可退出网页。
2.运行效果
本案例的运行效果图如图2-4所示。
图2-4 饮食介绍小网页
提示：本程序功能是显示信息到主界面，并且可以单击“退出”按钮退出本程序，如图2-4所示。
3. 技术概要
本程序的开发主要运用了FrameLayout帧布局的相关知识。帧布局是最简单的布局之一，采用帧布局的容器中无论放入多少个控件，控件默认情况下左上角都对齐到容器的左上角。如果控件一样大，同一时刻只能见到最上面的。
4. 核心代码
首先介绍的是本程序的主界面main.xml的开发，代码如下。
代码位置：见随书光盘中源代码/第2章/Sample2_4/res/layout目录下的main.xml。
1 <?xml version="1.0" encoding="utf-8"?>
2 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
3 android:layout_width="fill_parent"
4 android:layout_height="fill_parent"
5 android:background="#edab4a"
6 android:id="@+id/fl">
7 <LinearLayout
8 android:orientation="vertical"
9 android:layout_width="fill_parent"
10 android:layout_height="fill_parent"
11 android:id="@+id/cc">
12 <LinearLayout
13 android:orientation="horizontal"
14 android:layout_width="fill_parent"
15 android:layout_height="40dip"
16 android:id="@+id/tt"
17 android:background="@drawable/title">
18 <TextView
19 android:text=
20 "土豆白菜汤的做法 … …"
21 android:layout_width="fill_parent"
22 android:layout_height="wrap_content"
23 android:id="@+id/t"
24 android:textColor="#FF0000"
25 android:gravity="center"
26 android:textSize="30dip">
27 </TextView> <!--TextView控件-->
28 </LinearLayout>
<!--LinearLayout-->
29 <LinearLayout
30 android:orientation="horizontal"
31 android:gravity="center_horizontal"
32 android:layout_width="fill_parent"
33 android:layout_height="wrap_content"
34 android:id="@+id/tt">
35 <TextView
36 android:text="... ..."
37 android:layout_width="fill_parent"
38 android:layout_height="wrap_content"
39 android:id="@+id/t"
40 android:textColor="#FF0000">
41 </TextView> <!--TextView控件-->
42 </LinearLayout>
<!--LinearLayout-->
43 </LinearLayout>
<!--LinearLayout-->
44 <LinearLayout
45 android:layout_width="fill_parent"
46 android:layout_height="fill_parent"
47 android:id="@+id/lllll"
48 android:gravity="bottom|right">
49 <Button
50 android:text="退出"
51 android:id="@+id/b"
52 android:layout_width="wrap_content"
53 android:layout_height="wrap_content">
54 </Button> <!--Button控件-->
55 </LinearLayout>
<!--LinearLayout-->
56 </FrameLayout>
提示：在该XML文件中实现了布局的设置。总的布局为FrameLayout布局，其中包括一个垂直模式的LinearLayout线性布局,以及一个gravity设置为bottom和right的LinearLayout线性布局。通过对各个控件的属性设置，实现了该小软件的界面效果。
上面已经介绍了本程序的主界面main.xml的开发，接下来介绍的是本程序的具体功能的实现，代码如下。
代码位置：见随书光盘中源代码/第2章/Sample2_4/src/com/bn/ex2d目录下的Sample2_4_Activity.class。
1 package com.bn. ex2d; //包名
2 import android.app.Activity; //包引用声明，该处有所省略，读者可自行查看源代码
3 public class Sample2_4_Activity extends Activity { //该类继承自Activity类
4 public void onCreate(Bundle savedInstanceState) { //onCreate方法
5 super.onCreate(savedInstanceState); //继承父类的onCreate方法
6 setContentView(R.layout.main); //界面跳转到main.xml界面
7 Button b=(Button)this.findViewById(R.id.b); //获取Button按钮
8 b.setOnClickListener( //为Button按钮添加监听器
9 new OnClickListener(){
10 public void onClick(View v) {
11 System.exit(0); //当单击按钮时，退出程序
12 }}
13 );
14 }}
提示：在Activity类中，获取了按钮对象，并对其添加了按钮监听器，实现了单击按钮后退出程序的功能。