<4D F736F F D20B5DA35D5C220D3C3BBA7BDE7C3E6BFAAB7A22E646F6378>

Transcription

1 Android 应用程序开发与典型案例 作者 : 华清远见 第 5 章用户界面开发 本章简介 在上一章的学习中, 主要了解了 Android 系统的进程优先级排序 不同优先级 进程之间的变化方式,Android 系统的 4 大基本组件及其用途,Activity 的生命周期 中各个状态及状态间的变化关系 Android 应用程序的调试方法和工具 在此基础 上, 本章将对 Android 程序界面开发的学习, 包括用户界面基础 用户界面的控件 的使用 界面布局的特点及使用方法 菜单的使用方法 界面事件的处理方法等

2 5.1 用户界面基础 用户界面 (User Interface,UI) 是系统和用户之间进行信息交换的媒介, 实现信息的内部形式与用户可以接收形式之间的转换 在 Android 系统中,Android 自带有许多要求, 预示着其用户界面的复杂性 : 它是一个支持多个并发应用程序的多处理系统, 接受多种形式的输入, 有着高交互性, 必须具有足够的灵活性, 以支持现在和未来广泛的设备 令人印象深刻的是丰富的用户界面及其易用性, 实现了所有给定的功能 但为了使用应用程序在不同的设备上正常的显示以及运行, 避免对系统性能造成过大的负担, 应该明白其工作原理 Android 使用 XML 文件描述用户界面 ; 资源文件独立保存在资源文件夹中 ; 对用户界面描述非常灵活, 允许不明确定义界面元素的位置和尺寸, 仅声明界面元素的相对位置和粗略尺寸 以下就来介绍一下 Android 的用户界面框架 Android 是在 Java 环境中增加了一个图形用户界面 (GUI) 工具包, 联合了 AWT,Swing,SWT, 和 J2ME( 撇开 Web UI 的工具包 ) Android 框架和他们一样, 它是单线程的, 事件驱动的, 并建立一个嵌套的组件库 Android 用户界面框架 (Android UI Framework ), 像其他的 UI 框架一样, 采用了 MVC (Model-View-Controller) 模型, 提供了处理用户输入的控制器 (Controller), 显示用户界面和图像的视图 (View), 以及保存数据和代码的模型 (Model) 图 5-1 Android 用户界面框架 MVC 模型其中 Model 是应用程序的核心 虽然特定应用程序的视图 (View) 和控制器 (Controller) 必然反映他们操纵的 Model, 但一个 Model 可能是由几个不同的应用使用 想想看, 例如, 一个 MP3 播放器的应用程序以及一个将 MP3 文件转换成 WAV MP3 文件的程序, 对于这两个应用程序,Model 包括它的 MP3 文件格式和编解码器 然而, 前者的应用程序, 有熟悉的停止, 启动和暂停控制等操作 后者可能不会产生任何声音 ; 相反, 它会设置比特率的控制等 此时, 他们的 Model 都是对所有的文件数据 其中的控制器 (Controller) 能够接收并响应程序的外部动作, 如按键动作或触摸屏动作等 控制器使用队列处理外部动作, 每个外部动作作为一个对应的事件被加入队列中, 然后 Android 用户界面框架按照 先进先出 的规则从队列中获取事件, 并将这个事件分配给所对应的事件处理方法 例如, 当用户按下他的手机上的键,Android 系统生成的 KeyEvent, 并将其添加到事件队列中 最后, 在之前已排队的事件被处理后,KeyEvent 是从队列中删除的, 并作为当前选择 View 的 dispatchkeyevent 方法的调用参数传递 一旦事件被分派到的焦点组件, 该组件可能会采取适当的行动来改变程序的内部状态 例如, 在 MP3 播放器应用程序中, 当用户点击屏幕上的播放 / 暂停按钮时, 触发该按钮的事件, 处理方法可能更新 Model, 恢复播放一些先前所选乐曲 2

3 视图 (View) 是应用程序给用户的反馈 它负责应用程序的部分渲染显示, 发送音频扬声器, 产生触觉反馈等 视图部分应用视图树 (View Tree) 模型 视图树是由 Android 用户界面框架中的界面元素以一种树形结构组织在一起的,Android 系统会依据视图树的结构从上至下绘制每一个界面元素 每个元素负责对自身的绘制, 如果元素包含子元素, 该元素会通知其下所有子元素进行绘制 下面就来详细介绍一下视图树 Android 当中的可视化界面单元, 可分为 容器 与 非容器 两类, 容器类继承 ViewGroup, 非容器类则从 View 衍生出来, 如图 5-2 所示 图 5-2 Android 视图树 (View Tree) 视图树由 View 和 ViewGroup 构成 其中,View 是界面的最基本的可视单元, 存储了屏幕上特定矩形区域内所显示内容的数据结构, 并能够实现所占据区域的界面绘制 焦点变化 用户输入和界面事件处理等功能 同时 View 也是一个重要的基类, 所有在界面上的可见元素都是 View 的子类 ViewGroup 是一种能够承载含多个 View 的显示单元, 它承载了界面布局, 同时还承载了具有原子特性的重构模块 如图 5-3 所示, 这些 Layout 可以套叠式地组成一棵视图树 其中, 父节点的 Layout 与子节点的 LayoutParams 之间有控制关系, 例如, 若父节点是 RelativeLayout, 则子节点的单元中可以指定 RelativeLayout.LayoutParams 中的属性, 以控制子节点在父节点中的排列状况 图 5-3 ViewGroup 树形层次结构在单线程用户界面中, 控制器从队列中获取事件和视图在屏幕上绘制用户界面, 使用的都是同一个线程 这样的单线程用户界面使得处理方法具有顺序性, 能够降低应用程序的复杂程度, 同时也能降低开发的难度 问 : 单线程用户界面有什么缺点呢? 答 : 如果事件处理方法过于复杂, 可能会导致用户界面失去响应 5.2 界面布局 界面布局 (Layout) 是用户界面结构的描述, 定义了界面中所有的元素 结构和相互关系 3

4 界面布局 (Layout) 是为了适应多种 Android 设备上的屏幕而设计的解决方案 : 它们可以有不同的像素密度 尺寸和不同的纵横比 典型的 Android 设备, 如 HTC G1 手机, 甚至允许应用程序运行时改变屏幕的方向 ( 纵向或横向 ), 因此布局的基础设施需要能够应对这种情况 布局的目的是为开发人员提供一种方式来表示 View 之间的物理关系, 因为它们是在屏幕上绘制 作为 Android 的界面布局, 它使用开发需求来满足与开发要求最接近的屏幕布局 Android 开发者使用术语 布局, 指的是两种含意中的一种 布局的两种定义如下 一种资源, 它定义了在屏幕上画什么 布局资源存储在应用程序的 /res/layout 资源目录下的 XML 文件中 布局资源简单地说就是一个用于用户界面屏幕, 或屏幕的一部分, 以及内容的模板 一种视图类, 它主要是组织其他控件 这些布局类 (LinearLayout,RelativeLayout,TableLayout 等 ) 用于在屏幕上显示子控件, 如文本控件 按钮或图片 Eclipse 的 Android 开发插件包含了一个很方便的用于设计和预览布局资源的布局资源设计器 这个工具包括两个标签视图 : 布局视图允许你预览在不同的屏幕下及对于每一个方向控件会如何展现 ;XML 视图告诉你资源的 XML 定义 这里有一些关于在 Eclipse 中使用布局资源编辑器的技巧 使用概要 (Outline) 窗格在你的布局资源中添加和删除控件 选择特定的控件 ( 在预览或概要窗口 ) 并使用属性窗格来调整特定控件的属性 使用 XML 标签来直接编辑 XML 定义 很重要的是要记住一点,Eclipse 布局资源编辑器不能完全精确的模拟出布局在最终用户设备上的呈现形式 对此, 必须在适当配置的模拟器中测试, 更重要的是在目标设备上测试 而且一些 复杂 控件, 包括标签或视频查看器, 也不能在 Eclipse 中预览 声明 Android 程序的界面布局有两种方法 使用 XML 文件描述界面布局 在程序运行时动态添加或修改界面布局 用户既可以独立使用任何一种声明界面布局的方式, 也可以同时使用两种方式 使用 XML 文件声明界面布局有以下 3 个特点 : 将程序的表现层和控制层分离 ; 在后期修改用户界面时, 无须更改程序的源代码 ; 用户还能够通过可视化工具直接看到所设计的用户界面, 有利于加快界面设计的过程, 并且为界面设计与开发带来极大的便利性 设计程序用户界面最方便且可维护的方式是创建 XML 布局资源 这个方法极大地简化了 UI 设计过程, 将许多用户界面控件的布局, 以及控件属性定义移到 XML 中, 代替了写代码 它适应了 UI 设计师 ( 更关心布局 ) 和开发者 ( 了解 Java 和实现应用程序功能 ) 潜在的区别 开发者依然可以在必要时动态地改变屏幕内容 复杂控件, 像 ListView 或 GridView, 通常用程序动态地处理数据 XML 布局资源必须存放在项目目录的 /res/layout 下 对于每一屏 ( 与某个活动紧密关联 ) 都创建一个 XML 布局资源是一个通用的做法, 但这并不是必需的 理论上来说, 可以创建一个 XML 布局资源并在不同的活动中使用它, 为屏幕提供不同的数据 如果需要的话, 也可以分散布局资源并用另外一个文件包含它们 现在把注意力转向对组织其他控件很有用的布局控件 Android 中 Layout 的列表, 如表 5-1 所示 表 5-1 Layout 分类表 Layout 类别线性布局 LinearLayout 框架布局 FrameLayout 表格布局 TableLayout 相对布局 RelativeLayout 绝对布局 AbsoluteLayout 说明线性 ( 水平或垂直 ) 排版的容器单一界面的容器以表格方式排版的容器以相对坐标排版的容器以绝对坐标排版的容器, 不推荐使用 线性布局 (LinearLayout) 4

5 线性布局是最简单的布局之一, 它提供了控件水平或者垂直排列的模型 如图 5-4 所示, 线性布局中, 所有的子元素如果垂直排列, 则每行仅包含一个界面元素 ; 如果水平排列, 则每列仅包含一个界面元素 图 5-4 线性布局 (LinearLayout) 效果图同时, 使用此布局时可以通过设置控件的 Weight 参数控制各个控件在容器中的相对大小 LinearLayout 布局的属性既可以在布局文件 (XML) 中设置, 也可以通过成员方法进行设置 表 5-2 给出了 LinearLayout 常用的属性及这些属性的对应设置方法 表 5-2 LinearLayout 常用属性及对应方法属性名称对应方法描述 android:orientation setorientation(int) 设置线性布局的朝向, 可取 horizontal android:gravity setgravity(int) 设置线性布局的内部元素的布局方式在线性布局中可使用 gravity 属性来设置控件的对齐方式,gravity 可取的值及说明如表 5-3 所示 提示 : 当需要为 gravity 设置多个值时, 用 分隔即可 表 5-3 gravity 可取的属性及说明 属性 说明 top bottom left right center_vertical center-horizontal center fill_vertical fill_horizontal fill 不改变控件大小, 对齐到容器顶部不改变控件大小, 对齐到容器底部不改变控件大小, 对齐到容器左侧不改变控件大小, 对齐到容器右侧不改变控件大小, 对齐到容器纵向中央位置不改变控件大小, 对齐到容器横向中央位置不改变控件大小, 对齐到容器中央位置若有可能, 纵向拉伸以填满容器若有可能, 横向拉伸以填满容器若有可能, 纵向横向同时拉伸以填满容器 以下用一个线性布局的例子来加深对线性布局的理解 1. 创建一个名为 LinearLayout 的 Android 工程包名称是 edu.hrbeu.linearlayout,activity 名称为 LinearLayout 为了能够完整体验创建线性布局的过程, 我们需要删除 Eclipse 自动建立的 /res/layout/main.xml 文件, 之后我们将手动创建一个 XML 布局文件 2. 建立 XML 线性布局文件首先, 删除 Eclipse 自动建立的 /res/layout/main.xml 文件 ; 其次, 建立用于显示垂直排列线性布局的 XML 文件 : 右击 /res/layout 文件夹, 选择 New File 命令打开新文件建立向导, 文件名为 main_vertical.xml, 保存位置为 LinearLayout/res/layout, 如图 5-5 所示 5

6 图 5-5 新建线性布局 XML 文件 3. 编辑 XML 线性布局文件 打开 XML 文件编辑器, 对 main_vertical.xml 文件的代码做如代码清单 5-1 所示的修改 <?xml version="1.0" encoding="utf-8"?> <LinearLayout 代码清单 5-1 main_vertical.xml xmlns:android=" android:layout_width="match_parent" android:orientation="vertical"> </LinearLayout> 第 2 行代码是声明 XML 文件的根元素为线性布局 ; 第 行代码是在属性编辑器中修改过的宽度 高度和排列方式的属性 同样地, 用户可以在可视化编辑器和属性编辑器中对页面布局进行修改, 这些修改会同步地反映在 XML 文件中 4. 添加控件 将四个界面控件 TextView EditText Button Button 先后拖曳到可视化编辑器中, 所有控件都自动获取控件名称, 并把该名称显示在控件上, 如 TextView01 EditText01 Button01 和 Button02 修改界面控件的属性如表 5-4 所示 图 5-6 线性布局添加控件 表 5-4 线性布局控件属性 编号类型属性值 1 TextView text 用户名 : 2 EditText 3 Button 4 Button id Layout_width text id text match_parent 6

7 打开 XML 文件编辑器查看 main_vertical.xml 文件代码, 发现在属性编辑器内填入的文字已经正常写入 XML 文件中, 如代码清单 5-2 中第 行代码 <?xml version="1.0" encoding="utf-8"?> 代码清单 5-2 main_vertical.xml <LinearLayout xmlns:android=" android:layout_width="match_parent" android:orientation="vertical"> <TextView android:text=" 用户名 : " > </TextView> <EditText android:id="@+id/entry" android:layout_width="match_parent"> </EditText> <Button android:id="@+id/ok" android:text=" 确认 "> </Button> <Button android:id="@+id/cancel" android:text=" 取消 " > </Button> </LinearLayout> 5. 修改 LinearLayout.java 文件 将 LinearLayout.java 文件中的 setcontentview(r.layout.main), 更改为 setcontentview (R.layout.main_vertical) 同理, 按照以上步骤, 可以得到横向线性布局 建立 main_ horizontal.xml 文件 线性布局的 Orientation 属性的值设置为 horizontal 将 EditText 的 Layout width 属性的值设置为 wrap_content 将 LinearLayout.java 文件中的 setcontentview(r.layout.main_vertical) 修改为 setcontentview(r.layout.main_ horizontal) 框架布局 (FrameLayout) 框架布局 (FrameLayout) 是最简单的界面布局, 它在屏幕上开辟出了一块区域, 在这块区域中可以添 加多个子控件, 但是所有的子控件都被对齐到屏幕的左上角 框架布局的大小由子控件中尺寸最大的那个 子控件来决定 如果子控件一样大, 同一时刻只能看到最上面的子控件 FrameLayout 继承自 ViewGroup, 除了继承自父类的属性和方法,FrameLayout 类中包含了自己特有 的属性和方法, 如表 5-5 所示 表 5-5 FrameLayout 常用属性及对应方法 属性名称 对应方法 描述 android:foreground setforeground(drawable) 设置绘制在所有子控件之上的内容 android:foregroundgravity setforegroundgravity(int) 设置绘制在所有子控件之上内容的 gravity 提示 : 7

8 在 FrameLayout 中, 子控件是通过栈来绘制的, 所以后添加的子控件会被绘制在上层 以下用一个 FrameLayout 的例子来加深对 FrameLayout 的理解 (1) 在 Eclipse 中新建一个项目 FrameLayout 打开其 res/values 目录下的 strings.xml, 在其中输入如代码清单 5-3 所示代码 在该段代码中声明了应用程序总会用到的字符串资源 <?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">frameexample</string> <string name="big"> 大的 </string> <string name="middle"> 中的 </string> <string name="small"> 小的 </string> </resources> 代码清单 5-3 strings.xml (2) 在项目 rers/values 目录下新建一个 colors.xml, 在其中输入如代码清单 5-4 所示代码 该段代码声明了应用程序中将会用到的颜色资源 这样将所有颜色资源统一管理有助于提高程序的可读性及可维护性 <?xml version="1.0" encoding="utf-8"?> <resources> <color name="red">#ff0000</color> <color name="green">#00ff00</color> <color name="blue">#0000ff</color> <color name="white">#ffffff</color> </resources> 代码清单 5-4 colors.xml (3) 打开项目 res/layout 目录下的 main.xml 文件, 将其中已有的代码替换为如代码清单 5-5 所示代码 <?xml version="1.0" encoding="utf-8"?> 代码清单 5-5 main.xml <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent" xmlns:android=" <TextView android:textsize="60px" > <!-- 声明一个 TextView 控件 --> </TextView> <TextView android:textsize="40px" > <!-- 声明一个 TextView 控件 --> </TextView> <TextView android:textsize="20px" > <!-- 声明一个 TextView 控件 --> 8

9 </TextView> </FrameLayout> 代码第 2~7 行声明了一个框架布局, 并设置其在父控件中的显示方式及自身的背景颜色 ; 代码第 8~16 行声明了一个 TextView 控件, 该控件 ID 为 TextView01, 第 13 行定义了其显示内容的字号为 60px, 第 14 行定义了所显示内容的字体颜色为绿色 ; 代码第 17~25 行声明了一个 TextView 控件, 该控件 ID 为 TextView02, 第 22 行定义了其显示内容的字号为 40px, 第 23 行定义了所显示内容的字体颜色为红色 ; 代码第 26~34 行声明了一个 TextView 控件, 该控件 id 为 TextView03, 第 22 行定义了其显示内容的字号为 20px, 第 23 行定义了所显示内容的字体颜色为蓝色 运行程序, 在图 5-7 所示的运行效果图中可以看到, 程序运行时所有的子控件都自动地对齐到容器的左上角, 由于子控件的 TextView 是按照字号从大到小排列的, 所以字号小的在最上层 图 5-7 框架布局运行效果图 表格布局 (TableLayout) TableLayout 类以行和列的形式管理控件, 每行为一个 TableRow 对象, 也可以为一个 View 对象, 当为 View 对象时, 该 View 对象将跨越该行的所有列 在 TableRow 中可以添加子控件, 每添加一个子控件为一列 TableLayout 布局中并不会为每一行 每一列或每个单元格绘制边框, 每一行可以有 0 或多个单元格, 每个单元格为一个 View 对象 TableLayout 中可以有空的单元格, 单元格也可以像 HTML 中那样跨越多个列 图 5-8 是表格布局的示意图 图 5-8 表格布局示意图在表格布局中, 一个列的宽度由该列中最宽的那个单元格指定, 而表格的宽度是由父容器指定的 在 TableLayout 中, 可以为列设置 3 种属性 Shrinkable, 如果一个列被标识为 shrinkable, 则该列的宽度可以进行收缩, 以使表格能够适应其父容器的大小 Stretchable, 如果一个列被标识为 stretchable, 则该列的宽度可以进行拉伸, 以填满表格中空闲的空间 Collapsed, 如果一个列被标识为 collapsed, 则该列将会被隐藏 注意 : 一个列可以同时具有 Shrinkable 和 Stretchable 属性, 在这种情况下, 该列的宽度将任意拉伸或收缩以适应父容器 TableLayout 继承自 LinearLayout 类, 除了继承来自父类的属性和方法,TableLayout 类中还包含表格布局所特有的属性和方法 这些属性和方法说明如表 5-6 所示 表 5-6 TableLayout 类常用属性及对应方法说明 9

10 属性名称对应方法描述 android:collapsecolumns setcolumncollapsed(int,boolean) 设置指定列号的列为 Collapsed, 列号从 0 android:shrinkcolumns setshrinkallcolumns(boolean) 设置指定列号的列为 Shrinkable, 列号 从 0 android:stretchcolumns setstretchallcolumns(boolean) 设置指定列号的列为 Stretchable, 列号 从 0 以下我们用一个表格布局的例子来加深对表格布局的理解 首先, 建立表格布局要注意以下几点 (1) 向界面中添加一个表格布局, 无须修改布局的属性值 其中,ID 属性为 TableLayout01,Layout width 和 Layout height 属性都为 wrap_content (2) 向 TableLayout01 中添加两个 TableRow TableRow 代表一个单独的行, 每行被划分为几个小的单元, 单元中可以添加一个界面控件 其中,ID 属性分别为 TableRow01 和 TableRow02,Layout width 和 Layout height 属性都为 wrap_content (3) 通过 Outline, 向 TableRow01 中添加 TextView 和 EditText; 向 TableRow02 中添加两个 Button 图 5-9 向 TableRow01 中添加 TextView 和 EditText 参考表 5-7 设置 TableRow 中 4 个界面控件的属性值 表 5-7 表格布局控件属性编号类型属性值 text 用户名 : 1 TextView 2 EditText 3 Button 4 Button gravity padding Layout_width id text padding Layout_width id text padding id text right 3dip [null] 3dip 确认 取消 10

11 (4)main.xml 完整代码如代码清单 5-6 所示 <?xml version="1.0" encoding="utf-8"?> 代码清单 5-6 main.xml <TableLayout android:layout_width="match_parent" android:layout_height="match_parent" xmlns:android=" <TableRow > <TextView android:layout_width="160dip" android:gravity="right" android:text=" 用户名 :" android:padding="3dip" > </TextView> <EditText android:layout_width="160dip" android:padding="3dip" > </EditText> </TableRow> <TableRow > <Button android:padding="3dip" android:text=" 确认 "> </Button> <Button android:padding="3dip" android:text=" 取消 "> </Button> </TableRow> </TableLayout> 代码中, 第 3 行代码使用了 <TableLayout> 标签声明表格布局 ; 第 7 行和第 23 行代码声明了两个 TableRow 元素 ; 第 12 行设定宽度属性 android:layout_width:160dip; 第 13 行设定属性 android:gravity, 指定文字为右对齐 ; 第 15 行使用属性 android:padding, 声明 TextView 元素与其他元素的间隔距离为 3dip (5) 表格布局运行效果如图 5-10 所示 11

12 图 5-10 表格布局运行图 相对布局 (RelativeLayout) 相对布局 (RelativeLayout) 是一种非常灵活的布局方式, 能够通过指定界面元素与其他元素的相对位置关系, 确定界面中所有元素的布局位置, 能够最大限度保证在各种屏幕类型的手机上正确显示界面布局 在相对布局中, 子控件的位置是相对兄弟控件或父容器而决定的 出于性能考虑, 在设计相对布局时要按照控件之间的依赖关系排列, 如 View A 的位置相对于 View B 来决定, 则需要保证在布局文件中 View B 在 View A 的前面 在进行相对布局时用到的属性很多, 首先来看属性值只为 true 或 false 的属性, 如表 5-8 所示 表 5-8 相对布局中只取 true 或 false 的属性及说明 属性名称 android:layout_centerhorizontal android:layout_centervertical android:layout_centerinparent android:layout_alignparentbottom 属性说明当前控件位于父控件的横向中间位置当前控件位于父控件的纵向中间位置当前控件位于父控件的中央位置当前控件底端与父控件底端对齐 接下来看属性值为其他控件 ID 的属性, 如表 5-9 所示 表 5-9 相对布局中取值为其他控件 ID 的属性及说明 属性名称 android:layout_torightof android:layout_toleftof android:layout_above android:layout_below 属性说明使当前控件位于给出 ID 使当前控件位于给出 ID 使当前控件位于给出 ID 使当前控件位于给出 ID 续表 属性名称 android:layout_aligntop android:layout_alignbottom android:layout_alignleft android:layout_alignright 属性说明使当前控件的上边界位于给出 ID 使当前控件的下边界位于给出 ID 使当前控件的左边界位于给出 ID 使当前控件的右边界位于给出 ID 最后要介绍的是属性值以像素为单位的属性及说明, 如表 5-10 所示 表 5-10 相对布局中取值为像素的属性及说明 属性名称 属性说明 android:layout_marginleft android:layout_marginright android:layout_margintop android:layout_marginbottom 当前控件左侧的留白当前控件右侧的留白当前控件上方的留白当前控件下方的留白 需要注意的是在进行相对布局时要避免出现循环依赖, 例如, 设置相对布局在父容器中的排列方式为 WRAP_CONTENT, 就不能再将相对布局的子控件设置为 ALIGN_PARENT_BOTTOM 因为这样会造成子控件和父控件相互依赖和参照的错误 以下用一个相对布局的例子来加深对线性布局的理解 首先来看一下相对布局的效果图, 如图 5-11 所示 12

13 图 5-11 相对布局效果图为达到以上效果, 按以下步骤进行操作 (1) 添加 TextView 控件 ( 用户名 ), 相对布局会将 TextView 控件放置在屏幕的最上方 (2) 添加 EditText 控件 ( 输入框 ), 并声明该控件的位置在 TextView 控件的下方, 相对布局会根据 TextView 的位置确定 EditText 控件的位置 (3) 添加第一个 Button 控件 ( 取消 按钮 ), 声明在 EditText 控件的下方, 且在父控件的最右边 (4) 添加第二个 Button 控件 ( 确认 按钮 ), 声明该控件在第一个 Button 控件的左方, 且与第一个 Button 控件处于相同的水平位置 相对布局在 main.xml 文件的完整代码如代码清单 5-7 所示 代码清单 5-7 main.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout android:id="@+id/relativelayout01" android:layout_width="match_parent" android:layout_height="match_parent" xmlns:android=" <TextView android:id="@+id/label" android:layout_width="match_parent" android:text=" 用户名 :"> </TextView> <EditText android:id="@+id/entry" android:layout_width="match_parent" android:layout_below="@id/label"> </EditText> <Button android:id="@+id/cancel" android:layout_alignparentright="true" android:layout_marginleft="10dip" android:layout_below="@id/entry" android:text=" 取消 " > </Button> <Button android:id="@+id/ok" android:layout_toleftof="@id/cancel" android:layout_aligntop="@id/cancel" android:text=" 确认 "> </Button> </RelativeLayout> 在代码中, 第 3 行使用了 <RelativeLayout> 标签声明一个相对布局 ; 第 15 行使用位置属性 android:layout_below, 确定 EditText 控件在 ID 为 label 的元素下方 ; 第 20 行使用属性 android:layout_alignparentright, 声明该元素在其父元素的右边边界对齐 ; 第 21 行设定属性 android:layout_marginleft, 左移 10dip; 第 22 行声明该元素在 ID 为 entry 的元素下方 ; 第 28 行声明使用属性 android:layout_toleftof, 声明该元素在 ID 为 cancel 元素的左边 ; 第 29 行使用属性 android:layout_aligntop, 声明该元素与 ID 为 cancel 的元素在相同的水平位置 13

14 5.2.5 绝对布局 (AbsoluteLayout) 绝对布局 (AbsoluteLayout) 能通过指定界面元素的坐标位置, 来确定用户界面的整体布局 所谓绝对布局, 是指屏幕中所有控件的摆放由开发人员通过设置控件的坐标来指定, 控件容器不再负责管理其子控件的位置 由于子控件的位置和布局都通过坐标来指定, 因此 AbsoluteLayout 类中并没有开发特有的属性和方法 绝对布局是一种不推荐使用的界面布局, 因为通过 X 轴和 Y 轴确定界面元素位置后,Android 系统不能够根据不同屏幕对界面元素的位置进行调整, 降低了界面布局对不同类型和尺寸屏幕的适应能力 每一个界面控件都必须指定坐标 (X,Y), 例如图 5-12 中, 确认 按钮的坐标是 (40,120), 取消 按钮的坐标是 (120,120) 坐标原点(0,0) 在屏幕的左上角 图 5-12 绝对布局效果图绝对布局示例在 main.xml 文件的完整代码如代码清单 5-8 所示 代码清单 5-8 main.xml <?xml version="1.0" encoding="utf-8"?> <AbsoluteLayout android:id="@+id/absolutelayout01" android:layout_width="match_parent" android:layout_height="match_parent" xmlns:android=" <TextView android:id="@+id/label" android:layout_x="40dip" android:layout_y="40dip" android:text=" 用户名 :"> </TextView> <EditText android:id="@+id/entry" android:layout_x="40dip" android:layout_y="60dip" android:layout_width="150dip"> </EditText> <Button android:id="@+id/ok" android:layout_width="70dip" android:layout_x="40dip" android:layout_y="120dip" android:text=" 确认 "> </Button> <Button android:id="@+id/cancel" android:layout_width="70dip" android:layout_x="120dip" 14

15 android:layout_y="120dip" android:text=" 取消 "> </Button> </AbsoluteLayout> 上述涉及的界面布局 (LinearLayout,TableLayout,RelativeLayout 等 ) 像其他控件一样也是一个控件 这意味着布局控件可以被嵌套 比如, 为了组织屏幕上的控件你可以在一个 LinearLayout 中使用一个 RelativeLayout, 反过来也行 但是需注意在界面设计过程中, 尽量保证屏幕相对简单, 复杂布局加载很慢并且可能引起性能问题 同时, 在设计程序布局资源时需要考虑设备的差异性 通常情况下是可能设计出在各种不同设备上看着都不错的灵活布局的, 不管是竖屏还是模屏模式 必要时可以引入可选布局资源来处理特殊情况 例如, 可以根据设备的方向或设备是不是有超大屏幕 ( 如网络平板 ) 来提供不同的布局供加载 Android SDK 提供了几个可以帮助我们设计 调试和优化布局资源的工具 除了 Eclipse 的 Android 插件中内置的布局资源设计器, 还可以使用 Android SDK 提供的 Hierarchy Viewer( 层次结构查看器 ) 和 layoutopt 这些工具在 Android SDK 的 /tools 目录下可以找到 可以使用 Hierarchy Viewer 来查看布局运行时的详细情况 ; 可以使用 layoutopt( 布局优化 ) 命令行工具来优化你的布局文件 优化布局非常重要, 因为复杂的布局文件加载很慢 layoutopt 工具简单地扫描 XML 布局文件并找出不必要的控件 在 Android 开发者网站的 layoutopt 部分查看更多信息 5.3 界面控件 Android 系统的界面控件分为定制控件和系统控件 定制控件是用户独立开发的控件, 或通过继承并修改系统控件后所产生的新控件 能够为用户提供特殊的功能或与众不同的显示需求方式 ; 系统控件是 Android 系统提供给用户已经封装的界面控件, 它提供应用程序开发过程中常见功能控件 同时, 系统控件更有利于帮助用户进行快速开发, 能够使 Android 系统中应用程序的界面保持一致性 这里着重讲解一下系统控件的使用 常见的系统控件包括 TextView EditText Button ImageButton Checkbox RadioButton Spinner ListView 和 TabHost TextView 和 EditText TextView 是一种用于显示字符串的控件 ;EditText 则是用来输入和编辑字符串的控件, 它是一个具有编辑功能的 TextView 每个 TextView 期望的这样一个组件的属性 : 可以改变它的高度 宽度 字体 文字颜色 背景颜色等 TextView 也有一些有用的独特属性, 如表 5-11 所示 表 5-11 TextView 也有一些有用的独特属性 属性名称 autolink autotext editable 属性说明 如果设置 (TRUE), 发现文本中所显示的 URL, 并自动将它们转换为可点击链接 如果设置 (TRUE), 发现并纠正在文本简单的拼写错误 如果设置 (TRUE), 表示程序已定义的输入方法来接收输入文字 ( 对 TextView 来说默认是 false, 对 EditText 来说默认是 true) inputmethod 标识的输入法 (EditText 上定义一个通用文本 ) 下面就通过一个例子来加深对这两个控件的理解 15

16 图 5-13 TextView 与 EditView 效果图 首先, 建立一个 TextViewDemo 的程序, 包含 TextView 和 EditText 两个控件, 如图 5-13 所示 上方 用户名 部分使用的是 TextView, 下方的文字输入框使用的是 EditText TextViewDemo 在 XML 文件中的代码如代码清单 5-9 所示 <TextView android:text="textview01" > </TextView> <EditText android:layout_width="match_parent" android:text="edittext01" > </EditText> 代码清单 5-9 main.xml 在上述代码中, 第 1 行 android:id 属性声明了 TextView 的 ID, 这个 ID 主要用于在代码中引用这个 TextView 对象 表示所设置的 ID 值 ;@ 表示后面的字符串是 ID 资源 ; 加号 (+) 表示需要建立新资源名称, 并添加到 R.java 文件中 ; 斜杠后面的字符串 (TextView01) 表示新资源的名称 ; 如果资源不是新添加的, 或属于 Android 框架的 ID 资源, 则不需要使用加号 (+), 对于 Android 框架中的 ID 资源, 还必须添加 Android 包的命名空间, 如 android:id="@android:id/empty" 第 2 行的 android:layout_width 属性用来设置 TextView 的宽度,wrap_content 表示 TextView 的宽度只要能够包含所显示的字符串即可 第 3 行的 android:layout_height 属性用来设置 TextView 的高度 第 4 行表示 TextView 所显示的字符串, 在后面将通过代码更改 TextView 的显示内容 第 7 行中 fill_content 表示 EditText 的宽度将等于父控件的宽度 在上述步骤之后, 修改 TextViewDemo.java 文件中代码为代码清单 5-10 所示的代码 : 代码清单 5-10 TextViewDemo.java TextView textview = (TextView)findViewById(R.id.TextView01); EditText edittext = (EditText)findViewById(R.id.EditText01); textview.settext(" 用户名 :"); edittext.settext(""); 第 1 行代码的 findviewbyid() 方法能够通过 ID 引用界面上的任何控件, 只要该控件在 XML 文件中定义过 ID 即可 第 3 行代码的 settext() 方法用来设置 TextView 所显示的内容 Button 和 ImageButton Button 是一种按钮控件, 用户能够在该控件上点击, 并后引发相应的事件处理方法 ;ImageButton 用以实现能够显示图像功能的控件按钮 下面通过一个例子来加深对这两个控件的理解 1. 建立一个 ButtonDemo 的程序 16

17 程序包含 Button 和 ImageButton 两个按钮, 上方是 Button 按钮, 下方是一个 ImageButton 控件, 如图 5-14 所示 图 5-14 Button 与 ImageButton 效果图 ButtonDemo 在 XML 文件中的代码如代码清单 5-11 所示 <Button android:text="button01" > </Button> <ImageButton > </ImageButton> 代码清单 5-11 main.xml 在上述代码中, 定义 Button 控件的高度 宽度和内容及 ImageButton 控件的高度和宽度, 但是没定义显示的图像, 在后面的代码中进行定义 2. 引入资源 将 download.png 文件复制到 /res/drawable 文件夹下, 在 /res 目录上选择 Refresh, 就可以看到新添加的文件显示在 /res/drawable 文件夹下, 同时 R.java 文件内容也得到了更新, 否则提示无法找到资源的错误 3. 更改 Button 和 ImageButton 内容 在 ButtonDemo.java 中引入 android.widget.button 和 android.widget.imagebutton, 并修改其代码如代码清单 5-12 所示 代码清单 5-12 ButtonDemo.java Button button = (Button)findViewById(R.id.Button01); ImageButton imagebutton = (ImageButton)findViewById(R.id.ImageButton01); button.settext("button 按钮 "); imagebutton.setimageresource(r.drawable.download); 上述代码中, 第 1 行代码用于引用在 XML 文件中定义的 Button 控件 第 2 行代码用于引用在 XML 文件中定义的 ImageButton 控件 第 3 行代码将 Button 的显示内容更改为 Button 按钮 第 4 行代码利用 setimageresource() 方法, 将新加入的 png 文件 R.drawable.download 传递给 ImageButton 4. 按钮响应点击事件 : 添加点击事件的监听器 在 ButtonDemo.java 中添加代码清单 5-13 所示的代码 代码清单 5-13 ButtonDemo.java final TextView textview = (TextView)findViewById(R.id.TextView01); button.setonclicklistener(new View.OnClickListener() { public void onclick(view view) { ); textview.settext("button 按钮 "); 17

18 imagebutton.setonclicklistener(new View.OnClickListener() { public void onclick(view view) { textview.settext("imagebutton 按钮 "); ); 在本段代码中, 第 2 行代码中 button 对象通过调用 setonclicklistener() 方法, 注册一个点击 (Click) 事件的监听器 View.OnClickListener() 第 3 行代码是点击事件的回调方法 第 4 行代码将 TextView 的显示内容更改为 Button 按钮 这里我们来了解一下 View.OnClickListener() View.OnClickListener() 是 View 定义的点击事件的监听器接口, 并在接口中仅定义了 onclick() 方法 当 Button 从 Android 界面框架中接收到事件后, 首先检查这个事件是否是点击事件, 如果是点击事件, 同时 Button 又注册了监听器, 则会调用该监听器中的 onclick() 方法 每个 View 仅可以注册一个点击事件的监听器, 如果使用 setonclicklistener() 方法注册第二个点击事件的监听器, 之前注册的监听器将被自动注销 多个按钮注册到同一个点击事件的监听器上, 代码如代码清单 5-14 所示 代码清单 5-14 多个按钮注册到一个点击事件的监听器上 Button.OnClickListener buttonlistener = new public void onclick(view v) { ; switch(v.getid()){ case R.id.Button01: textview.settext("button 按钮 "); return; case R.id.ImageButton01: textview.settext("imagebutton 按钮 "); return; Button.setOnClickListener(buttonListener); ImageButton.setOnClickListener(buttonListener); 该段代码中, 第 1 行至第 12 行代码定义了一个名为 buttonlistener 的点击事件监听器 ; 第 13 行代码将该监听器注册到 Button 上 ; 第 14 行代码将该监听器注册到 ImageButton 上 CheckBox 和 RadioButton CheckBox 是一个同时可以选择多个选项的控件 ; 而 RadioButton 则是仅可以选择一个选项的控件 ; RadioGroup 是 RadioButton 的承载体, 程序运行时不可见, 应用程序中可能包含一个或多个 RadioGroup, 一个 RadioGroup 包含多个 RadioButton, 在每个 RadioGroup 中, 用户仅能够选择其中一个 RadioButton 下面就通过一个例子来加深对这两个控件的理解, 其效果如图 5-15 所示 图 5-15 CheckBox 与 RadioButton 效果图 1. 建立一个 CheckboxRadiobuttonDemo 程序 18

19 程序包含 5 个控件, 从上至下分别是 TextView01 CheckBox01 CheckBox02 RadioButton01 RadioButton02, 当选择 RadioButton01 时,RadioButton02 则无法选择 CheckboxRadiobuttonDemo 在 XML 文件中的代码如代码清单 5-15 所示 <TextView android:id="@+id/textview01 android:layout_width="match_parent" android:text="@string/hello"/> <CheckBox android:id="@+id/checkbox01" android:text="checkbox01" > </CheckBox> <CheckBox android:id="@+id/checkbox02" android:text="checkbox02" > </CheckBox> <RadioGroup android:id="@+id/radiogroup01" 代码清单 5-15 main.xml > <RadioButton android:id="@+id/radiobutton01" android:text="radiobutton01" > </RadioButton> <RadioButton android:id="@+id/radiobutton02" android:text="radiobutton02" > </RadioButton> </RadioGroup> 上述代码中, 第 15 行 <RadioGroup> 标签声明了一个 RadioGroup; 在第 18 行和第 23 行分别声明了两个 RadioButton, 这两个 RadioButton 是 RadioGroup 的子元素 2. 引用 CheckBox 和 RadioButton 引用 CheckBox 和 RadioButton 的方法参考代码清单 5-16 所示的代码 代码清单 5-16 引用 CheckBox 和 RadioButton CheckBox checkbox1= (CheckBox)findViewById(R.id.CheckBox01); RadioButton radiobutton1 =(RadioButton)findViewById(R.id.RadioButton01); 3. 响应点击事件 : 添加点击事件的监听器 CheckBox 设置点击事件监听器的方法与 Button 设置点击事件监听器中介绍的方法相似, 唯一不同在于将 Button.OnClickListener 换成了 CheckBox.OnClickListener 代码清单 5-17 设置 CheckBox 点击事件监听器 CheckBox.OnClickListener checkboxlistener = new public void onclick(view v) { // 过程代码 ; checkbox1.setonclicklistener(checkboxlistener); checkbox2.setonclicklistener(checkboxlistener); RadioButton 设置点击事件监听器的方法如代码清单 5-18 所示 代码清单 5-18 设置 RadioButton 点击事件监听器 RadioButton.OnClickListener radiobuttonlistener = new RadioButton.OnClickListener(){ 19

20 @Override public void onclick(view v) { // 过程代码 ; radiobutton1.setonclicklistener(radiobuttonlistener); radiobutton2.setonclicklistener(radiobuttonlistener); 通过上述的讲解, 可以得出这样的结论 :CheckBox 是可以选择多个选项的复选框控件, 当其中选项被选中时, 显示相应的 checkmark 这时, 需要创建一个 OnClickListener 捕获点击事件, 并可以添加所需的功能代码 RadioGroup 是一个包含一些 RadioButton 的 ViewGroup 用户可选择一个按钮, 通过对每一个 RadioButton 设置监听 OnClickListeners 来获取其选择 这里需注意, 点击 RadioButton 并不触发 RadioGroup 的 Click 事件 Spinner Spinner 是一种能够从多个选项中选择选项的控件, 类似于桌面程序的组合框 (ComboBox), 但没有组合框的下拉菜单, 而是使用浮动菜单为用户提供选择, 如图 5-16 所示 下面就通过一个例子来加深对 Spinner 的理解 1. 建立一个程序 SpinnerDemo 图 5-16 Spinner 效果图 程序包含 3 个子项,Spinner 控件在 XML 文件中的代码如代码清单 5-19 所示 <TextView android:id="@+id/textview01" android:layout_width="match_parent" android:text="@string/hello"/> <Spinner android:id="@+id/spinner01" android:layout_width="300dip" > </Spinner> 代码清单 5-19 main.xml 在上述代码中, 第 5 行使用 <Spinner> 标签声明了一个 Spinner 控件 ; 第 6 行代码中指定了该控件的宽度为 300dip 2. 修改 SpinnerDemo.java 文件 在 SpinnerDemo.java 文件中, 定义一个 ArrayAdapter 适配器, 在 ArrayAdapter 中添加 Spinner 的内容, 需要在代码中引入 android.widget.arrayadapter 和 android.widget.spinner 代码清单 5-20 SpinnerDemo.java Spinner spinner = (Spinner) findviewbyid(r.id.spinner01); List<String> list = new ArrayList<String>(); 20

21 list.add("spinner 子项 1"); list.add("spinner 子项 2"); list.add("spinner 子项 3"); ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.r.layout.simple_spinner_item, list ); adapter.setdropdownviewresource(android.r.layout.simple_spinner_dropdown_item); spinner.setadapter(adapter); 本段代码中, 第 2 行代码建立了一个字符串数组列表 (ArrayList), 这种数组列表可以根据需要进行增减,<String> 表示数组列表中保存的是字符串类型的数据 在代码的第 行中, 使用 add() 方法分别向数组列表中添加 3 个字符串 第 6 行代码建立了一个 ArrayAdapter 的数组适配器, 数组适配器能够将界面控件和底层数据绑定在一起 第 7 行代码设定了 Spinner 的浮动菜单的显示方式, 其中,android.R.layout.simple_ spinner_dropdown_item 是 Android 系统内置的一种浮动菜单 第 8 行代码实现绑定过程, 所有 ArrayList 中的数据, 将显示在 Spinner 的浮动菜单中 利用该段代码, 适配器绑定界面控件和底层数据, 如果底层数据更改了, 用户界面也相应修改显示内容, 因此不需要应用程序再监视, 从而极大地简化了代码的复杂性 由上述例子可以得出结论 : 与上一小节中的 CheckBox 和 RadioButton 相比,Sipnner 需要的工作量最大, 但可以为用户提供相对来说较好的屏幕显示 如上所示,Spinner 显示当前选中的选项, 当单击右侧的下拉列表时, 弹出一个可供选择的选项列表 为了实现该功能需满足以下条件 (1) 创建一个可供选择的选项列表 ( 该列表可以是动态创建并被应用程序修改 ) (2) 为 Spinner 的列表创建一个 ArrayAdapter 以实现其下拉列表的显示 这里需注意 ArrayAdapter 的格式 (simple_spinner_item 和 simple_spinner_dropdown_item) 是由 Android 系统定义的, 它们不会出现在资源 XML 文件中 (3) 创建 onitemselectedlistener 来捕捉 Spinner 的选择事件 监听 onitemselected Listener 包含 onitemselected() 方法和 onnothingselected() 方法 ListView ListView 是一种用于垂直显示的列表控件, 如果显示内容过多, 则会出现垂直滚动条 ListView 能够通过适配器将数据和自身绑定, 在有限的屏幕上提供大量内容供用户选择, 所以是经常使用的用户界面控件 同时,ListView 支持点击事件处理, 用户可以用少量的代码实现复杂的选择功能 例如, 调用 setadapter() 提供的数据和 View 子项, 并通过 setonitemselectedlistener() 方法监听 ListView 上子项选择事件 若 Activity 由一个单一的列表控制, 则 Activity 需继承 ListActivity 类而不是之前介绍的常规的 Activity 类 如果主视图仅仅只是列表, 甚至不需要建立一个 layout,listactivity 会为用户构建一个全屏幕的列表 如果想自定义布局, 则需要确定 ListView 的 id 以便 ListActivity 知道其 Activity 的主要清单 下面就通过一个例子来加深对 ListView 的理解, 如图 5-17 所示 21

22 图 5-17 ListView 效果图 1. 建立一个 ListViewDemo 程序 XML 文件中的代码如代码清单 5-21 所示 <?xml version="1.0" encoding="utf-8"?> 代码清单 5-21 main.xml <LinearLayout xmlns:android=" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" > <TextView android:layout_width="match_parent" /> <ListView android:layout_width="match_parent" android:layout_height="match_parent" android:drawselectorontop="false" /> </LinearLayout> 2. 修改 ListViewDemo.java 文件 在 ListViewDemo.java 文件中, 首先需要为 ListView 创建适配器, 配置和连接列表, 添加 ListView 中所显示的内容 public class ListViewDemo extends ListActivity { TextView selection; 代码清单 5-22 ListViewDemo.java String[] items={"lorem", "ipsum", "dolor", "sit", "amet", "consectetuer", "adipiscing", "elit", "morbi", "vel", "ligula", "vitae", "arcu", "aliquet", public void oncreate(bundle icicle) { super.oncreate(icicle); setcontentview(r.layout.main); "etiam", "vel", "erat", "placerat", "ante", "porttitor", "sodales", "pellentesque", "augue", "purus"; setlistadapter(new ArrayAdapter<String>(this, android.r.layout.simple_list_item_1,items)); selection=(textview)findviewbyid(r.id.selection); public void onlistitemclick(listview parent, View v, int position,long id) { selection.settext(items[position]); 继承 ListActivity 后, 可以通过 setlistadapter() 方法设置列表 这种情况下, 提供了一个 ArrayAdapter 包装的字符串数组 其中 ArrayAdapter 的第二个参数 android.r.layout.simple_ list_item_1 控制了 ListView 中行的显示, 上例中 android.r.layout.simple_list_item_1 该值提供了标准的 Android 清单行 : 大字体 很多的填充 文本和白色 重写 onlistitemclick 方法以在列表上子项的选择发生变化时及时更新其文本 在默认情况下,ListView 只对列表子项的点击事件进行监听 但 ListView 也跟踪用户的选择, 或多个可能的选择列表, 但它需要一些变化 在 Java 代码中调用 ListView 的 setchoicemode() 方法来设置选择模式, 可供选择的模式有 : CHOICE_MODE_SINGLE 和 CHOICE_MODE_MULTIPLE 两种 可以通过 getlistview() 方法在 ListActivity 中获取 ListView 22

23 在构造 ArrayAdapter 时, 第二个参数选择使用以下两种参数可以使列表上子项单选或是复选 : android.r.layout.simple_list_item_single_choice 和 android.r.layout. simple_list_item_multiple_choice, 如图 5-18 所示 图 5-18 单选 复选模式 通过调用 getcheckeditempositions() 方法来判断用户选择的子项 TabHost Tab 标签页是界面设计时经常使用的界面控件, 可以实现多个分页之间的快速切换, 每个分页可以显示不同的内容 对 Tab 标签页的使用, 首先要设计所有的分页的界面布局, 在分页设计完成后, 使用代码建立 Tab 标签页, 并给每个分页添加标识和标题, 最后确定每个分页所显示的界面布局 其中, 每个分页建立一个 XML 文件, 用以编辑和保存分页的界面布局, 使用的方法与设计普通用户界面一样 下面就通过一个例子来加深对 Tab 标签页的理解, 如图 5-19 所示的效果图 1. 建立一个 TabDemo 程序 图 5-19 Tab 标签页效果图 程序包含两个 XML 文件, 分别为 tab1.xml 和 tab2.xml, 这两个文件分别使用线性布局 相对布局和绝对布局示例中的 main.xml 的代码, 并将布局的 ID 分别定义为 layout01 和 layout02 其中,tab1.xml 文件代码如代码清单 5-23 所示 <?xml version="1.0" encoding="utf-8"?> <LinearLayout android:id = "@+id/layout01" </LinearLayout> tab2.xml 文件代码如代码清单 5-24 所示 代码清单 5-23 tab1.xml 代码清单 5-24 tab2.xml 23

24 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout </RelativeLayout> 2. 修改 TabDemo.java 文件 在 TabDemo.java 文件中输入代码清单 5-25 所示的代码, 创建 Tab 标签页, 并建立子页与界面布局直接的关联关系 package com.example.tabdemo; 代码清单 5-25 TabDemo.java import android.app.tabactivity; import android.os.bundle; import android.widget.tabhost; import android.view.layoutinflater; public class TabDemo extends TabActivity public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); TabHost tabhost = gettabhost(); LayoutInflater.from(this).inflate(R.layout.tab1, tabhost.gettabcontentview(),true); LayoutInflater.from(this).inflate(R.layout.tab2, tabhost.gettabcontentview(),true); tabhost.addtab(tabhost.newtabspec("tab1").setindicator(" 线性布局 ").setcontent(r.id.layout01)); tabhost.addtab(tabhost.newtabspec("tab2").setindicator(" 相对布局 ").setcontent(r.id.layout02)); 该段代码中, 第 8 行代码 public class TabDemo extends TabActivity 的声明 TabDemo 类继承于 TabActivity, 与以往继承 Activity 不同,TabActivity 支持内嵌多个 Activity 或 View 第 12 行代码 TabHost tabhost = gettabhost(); 通过 gettabhost() 方法获得 Tab 标签页的容器, 用以承载可以点击的 Tab 标签和分页的界面布局 第 13 行代码 LayoutInflater.from(this).inflate(R.layout.tab1, tabhost. gettabcontent View(),true); 通过 LayoutInflater 将 tab1.xml 文件中的布局转换为 Tab 标签页可以使用的 View 对象 第 14 行代码 tabhost.addtab(tabhost.newtabspec("tab1").setindicator(" 线性布局 ").setcontent(r.id.layout01)); 使用 addtab() 方法添加了第 1 个分页,tabHost.newTabSpec ("TAB1") 表明在第 12 行代码中建立的 tabhost 上, 添加一个标识为 TAB1 的 Tab 分页, 同时使用 setindicator() 方法设定分页显示的标题, 使用 setcontent() 方法设定分页所关联的界面布局 问 : 在使用 Tab 标签页时, 只能像上述例子中一样将不同分页的界面布局保存在不同的 XML 文件中吗? 答 : 除了像上述中将不同分页的界面布局保存在不同的 XML 文件中外, 也可以将所有分页的布局保存在同一个 XML 文件中 两者有不同的利弊 : 第一种方法有利于在 Eclipse 开发环境中进行可视化设计, 并且不同分页的界面布局在不同的文件中更加易于管理 第二种方法则可以产生较少的 XML 文件, 同时编码时的代码也会更加简洁 5.4 菜单 24

25 菜单是应用程序中非常重要的组成部分, 能够在不占用界面空间的前提下, 为应用程序提供统一的功能和设置界面, 并为程序开发人员提供了易于使用的编程接口 Android 系统支持 3 种菜单 : 选项菜单 (Option Menu) 子菜单(Submenu) 快捷菜单(Context Menu) 选项菜单 选项菜单是一种经常被使用的 Android 系统菜单, 可以分为图标菜单 (Icon Menu) 和扩展菜单 (Expanded Menu) 两类, 可通过 菜单键 (Menu key) 打开 图标菜单能够同时显示文字和图标, 最多支持 6 个子项, 但图标菜单不支持单选框和复选框 扩展菜单在图标菜单子项多余 6 个时才出现, 通过点击图标菜单最后的子项 More 才能打开 扩展菜单是垂直的列表型菜单, 不能够显示图标, 但支持单选框和复选框 图 5-20 图标菜单 图 5-21 扩展菜单 1. 重写 oncreateoptionmenu() 方法 在 Android 应用程序中使用选项菜单, 需重载 Activity 的 oncreateoptionmenu() 方法 初次使用选项菜单时, 会调用 oncreateoptionmenu() 方法, 用来初始化菜单子项的相关内容, 因此这里需要设置菜单子项自身的子项 ID 和组 ID 菜单子项显示的文字和图片等 代码如代码清单 5-26 所示 final static int MENU_DOWNLOAD = Menu.FIRST; final static int MENU_UPLOAD = public boolean oncreateoptionsmenu(menu menu){ 代码清单 5-26 重载 oncreateoptionmenu() 方法 menu.add(0,menu_download,0," 下载设置 "); menu.add(0,menu_upload,1," 上传设置 "); return true; 第 1 行和第 2 行代码将菜单子项 ID 定义成静态常量, 并使用静态常量 Menu.FIRST( 整数类型, 值为 1) 定义第一个菜单子项, 以后的菜单子项仅需在 Menu.FIRST 增加相应的数值即可 第 4 行代码 Menu 对象作为一个参数被传递到方法内部, 因此在 oncreateoptionsmenu() 方法中, 用户可以使用 Menu 对象的 add() 方法添加菜单子项 其中 add() 方法的语法如下 MenuItem android.view.menu.add(int groupid, int itemid, int order, CharSequence title) 第 1 个参数 groupid 是组 ID, 用以批量的对菜单子项进行处理和排序 ; 第 2 个参数 itemid 是子项 ID, 是每一个菜单子项的唯一标识, 通过子项 ID 使应用程序能够定位到用户所选择的菜单子项 ; 第 3 个参数 order 是定义菜单子项在选项菜单中的排列顺序 ; 第 4 个参数 title 是菜单子项所显示的标题 第 7 行代码是 oncreateoptionsmenu() 方法返回值, 方法的返回值类型为布尔型 : 返回 true 将显示方法中设置的菜单, 否则不能够显示菜单 做完以上步骤后, 使用 seticon() 方法和 setshortcut() 方法, 添加菜单子项的图标和快捷键, 如代码清单 5-27 所示 25

26 menu.add(0,menu_download,0," 下载设置 ").seticon(r.drawable.download);.setshortcut(','d'); 代码清单 5-27 添加菜单子项的图标和快捷键 代码中, 利用 MENU_DOWNLOAD 菜单设置图标和快捷键的代码 ; 第 2 行代码中使用了新的图像资源, 用户将需要使用的图像文件复制到 /res/drawable 目录下 ;setshortcut() 方法第一个参数是为数字键盘设定的快捷键, 第二个参数是为全键盘设定的快捷键, 且不区分字母的大小写 2. 重写 onprepareoptionsmenu() 方法 重载 onprepareoptionsmenu() 方法, 能够动态地添加 删除菜单子项, 或修改菜单的标题 图标和可见性等内容 onprepareoptionsmenu() 方法的返回值的含义与 oncreateoptions Menu() 方法相同 : 返回 true 则显示菜单, 返回 false 则不显示菜单 代码清单 5-28 所示的代码是在用户每次打开选项菜单时, 在菜单子项中显示用户打开该子项的次数 static int MenuUploadCounter = public boolean onprepareoptionsmenu(menu menu){ 代码清单 5-28 菜单子项中显示用户打开该子项的次数 MenuItem uploaditem = menu.finditem(menu_upload); uploaditem.settitle(" 上传设置 :" +String.valueOf(MenuUploadCounter)); return true; 第 1 行代码设置一个菜单子项的计数器, 用来统计用户打开 上传设置 子项的次数 ; 第 4 行代码是通过将菜单子项的 ID 传递给 menu.finditem() 方法, 获取到菜单子项的对象 ; 第 5 行代码是通过 MenuItem 的 settitle() 方法修改菜单标题 问 :oncreateoptionmenu() 方法和 onprepareoptionsmenu() 方法有什么区别? 答 :oncreateoptionmenu() 方法在 Menu 显示之前只调用一次 ; 而 onprepareoptionsmenu() 方法在每次显示 Menu 之前都会调用, 一般用它执行 Menu 的更新操作 3.onOptionsItemSelected () 方法 onoptionsitemselected () 方法能够处理菜单选择事件, 且该方法在每次单击菜单子项时都会被调用 下面的代码说明了如何通过菜单子项的 ID 执行不同的操作 代码清单 5-29 public boolean onoptionsitemselected(menuitem item){ switch(item.getitemid()){ case MENU_DOWNLOAD: MenuDownlaodCounter++; return true; case MENU_UPLOAD: MenuUploadCounter++; return true; return false; onoptionsitemselected () 的返回值表示是否对菜单的选择事件进行处理, 如果已经处理过则返回 true, 否则返回 false; 第 3 行的 MenuItem.getItemId() 方法可以获取到被选择菜单子项的 ID 程序运行后, 通过单击 菜单键 可以调出程序设计的两个菜单子项, 如图 5-22 所示 26

27 图 5-22 运行效果图 子菜单 子菜单是能够显示更加详细信息的菜单子项, 如图 5-23 所示 其中, 菜单子项使用了浮动窗体的显示形式, 能够更好地适应小屏幕的显示方式 图 5-23 菜单子项 Android 系统的子菜单使用非常灵活, 可以在选项菜单或快捷菜单中使用子菜单, 有利于将相同或相似的菜单子项组织在一起, 便于显示和分类 但是, 子菜单不支持嵌套 子菜单的添加使用 addsubmenu() 方法实现, 代码如代码清单 5-30 所示 SubMenu uploadmenu = (SubMenu) menu.addsubmenu 代码清单 5-30 onoptionsitemselected() (0,MENU_UPLOAD,1," 上传设置 ").seticon(r.drawable.upload); uploadmenu.setheadericon(r.drawable.upload); uploadmenu.setheadertitle(" 上传参数设置 "); uploadmenu.add(0,sub_menu_upload_a,0," 上传参数 A"); uploadmenu.add(0,sub_menu_upload_b,0," 上传参数 B"); 第 1 行代码在 oncreateoptionsmenu() 方法传递的 menu 对象上调用 addsubmenu() 方法, 在选项菜单中添加一个菜单子项, 用户单击后可以打开子菜单 ;addsubmenu() 方法与选项菜单中使用过的 add() 方法支持相同的参数, 同样可以指定菜单子项的 ID 组 ID 和标题等参数, 并且能够通过 seticon() 方法显示菜单的图标 第 2 行代码使用 setheadericon () 方法, 定义子菜单的图标 第 3 行定义子菜单的标题, 若不规定子菜单的标题, 子菜单将显示父菜单子项标题, 即第 1 行代码中 上传设置 第 4 行和第 5 行在子菜单中添加了两个菜单子项, 菜单子项的更新方法和选择事件处理方法, 仍然使用 onprepareoptionsmenu() 方法和 onoptionsitemselected () 方法 以上一小节的代码为基础, 将 上传设置 改为子菜单, 并在子菜单中添加 上传参数 A 和 上传参数 B 两个菜单子项 运行结果如图 5-24 所示 27

28 图 5-24 运行效果图 上下文菜单 (Context Menu) 快捷菜单同样采用了浮动窗体的显示方式, 与子菜单的实现方式相同, 但两种菜单的启动方式却截然不同 启动方式 : 快捷菜单类似于普通桌面程序中的 右键菜单, 当用户点击界面元素超过 2 秒后, 将启动注册到该界面元素的快捷菜单 使用方法 : 与使用选项菜单的方法非常相似, 需要重载 oncreatecontextmenu() 方法和 oncontextitemselected() 方法 1.onCreateContextMenu() 方法 oncreatecontextmenu() 方法主要用来添加快捷菜单所显示的标题 图标和菜单子项等内容, 选项菜单中的 oncreateoptionsmenu() 方法仅在选项菜单第一次启动时被调用一次, 而快捷菜单的 oncreatecontextmenu() 方法每次启动时都会被调用一次 final static int CONTEXT_MENU_1 = Menu.FIRST; final static int CONTEXT_MENU_2 = Menu.FIRST+1; final static int CONTEXT_MENU_3 = 代码清单 5-31 oncreatecontextmenu () public void oncreatecontextmenu(contextmenu menu, View v, ContextMenuInfo menuinfo){ menu.setheadertitle(" 快捷菜单标题 "); menu.add(0, CONTEXT_MENU_1, 0," 菜单子项 1"); menu.add(0, CONTEXT_MENU_2, 1," 菜单子项 2"); menu.add(0, CONTEXT_MENU_3, 2," 菜单子项 3"); ContextMenu 类支持 add() 方法 ( 代码第 7 行 ) 和 addsubmenu() 方法, 可以在快捷菜单中添加菜单子项和子菜单 第 5 行代码的 oncreatecontextmenu() 方法中的参数 : 第 1 个参数 menu 是需要显示的快捷菜单 ; 第 2 个参数 v 是用户选择的界面元素 ; 第 3 个参数 menuinfo 是所选择界面元素的额外信息 2.onContextItemSelected () 方法 菜单选择事件的处理需要重载 oncontextitemselected() 方法, 该方法在用户选择快捷菜单中的菜单子项后被调用, 与 onoptionsitemselected () 代码清单 5-32 oncontextitemselected() public oolean oncontextitemselected(menuitem item){ switch(item.getitemid()){ case CONTEXT_MENU_1: LabelView.setText(" 菜单子项 1"); return true; case CONTEXT_MENU_2: 28

29 LabelView.setText(" 菜单子项 2"); return true; case CONTEXT_MENU_3: LabelView.setText(" 菜单子项 3"); return true; return false; 3.registerForContextMenu() 方法 使用 registerforcontextmenu() 方法, 将快捷菜单注册到界面控件上 ( 代码清单 5-33 中第 7 行 ) 这样, 用户在长时间点击该界面控件时, 便会启动快捷菜单 为了能够在界面上直接显示用户所选择快捷菜单的菜单子项, 在代码中引用了界面元素 TextView( 代码清单 5-33 中第 6 行 ), 通过更改 TextView 的显示内容, 显示用户所选择的菜单子项 TextView LabelView = 代码清单 5-33 registerforcontextmenu () public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); LabelView = (TextView)findViewById(R.id.label); registerforcontextmenu(labelview); 4.main.xml <TextView /> android:id="@+id/label" android:layout_width="match_parent" android:layout_height="match_parent" android:text="@string/hello" 代码清单 5-34 main.xml 上述代码为 /src/layout/main.xml 文件的部分内容, 第 1 行声明了 TextView 的 ID 为 label, 在代码清单 5-33 的第 6 行中, 通过 R.id.label 将 ID 传递给 findviewbyid() 方法, 这样用户便能够引用该界面元素, 并能够修改该界面元素的显示内容 需要注意的一点, 代码清单 5-34 的第 2 行, 将 android:layout_width 设置为 match_parent, 这样 TextView 将填充满父节点的所有剩余屏幕空间, 用户点击屏幕 TextView 下方任何位置都可以启动快捷菜单 如果将 android:layout_width 设置为 wrap_content, 则用户必须准确单击 TextView 才能启动快捷菜单 图 5-25 为快捷菜单的运行效果图 图 5-25 运行效果图 问 : 菜单可不可以像界面布局一样在 XML 文件中进行定义? 29

30 答 : 菜单可以像界面布局一样在 XML 文件中进行定义 使用 XML 文件定义界面菜单, 将代码与界面设计分类, 有助于简化代码的复杂程度, 并且更有利于界面的可视化 下面将快捷菜单的示例程序 MyContextMenu 改用 XML 实现, 新程序的工程名称为 MyXLMContoxtMenu 首先需要创建保存菜单内容的 XML 文件 : 在 /src 目录下建立子目录 menu, 并在 menu 下建立 context_menu.xml 文件, 代码如代码清单 5-35 所示 代码清单 5-35 context_menu.xml <menu xmlns:android=" <item android:id="@+id/contextmenu1" android:title=" 菜单子项 1"/> <item android:id="@+id/contextmenu2" android:title=" 菜单子项 2"/> <item android:id="@+id/contextmenu3" android:title=" 菜单子项 3"/> </menu> 在描述菜单的 XML 文件中, 必须以 <menu> 标签 ( 代码第 1 行 ) 作为根节点,<item> 标签 ( 代码第 2 行 ) 用来描述菜单中的子项,<item> 标签可以通过嵌套实现子菜单的功能 XML 菜单的显示结果如图 5-26 所示 图 5-26 XML 菜单的显示结果 在 XML 文件中定义菜单后, 在 oncreatecontextmenu() 方法中调用 inflater.inflate() 方法, 将 XML 资源文件传递给菜单对象, 代码如代码清单 5-36 代码清单 5-36 oncreatecontextmenu() public void oncreatecontextmenu(contextmenu menu, View v, ContextMenuInfo menuinfo){ MenuInflater inflater = getmenuinflater(); inflater.inflate(r.menu.context_menu, menu); 第 4 行代码中的 getmenuinflater() 为当前的 Activity 返回 MenuInflater; 第 5 行代码将 XML 资源文件 R.menu.context_menu, 传递给 menu 这个快捷菜单对象 5.5 界面事件 在 Android 系统中, 存在多种界面事件, 如点击事件 触摸事件 焦点事件和菜单事件等, 在这些界面事件发生时,Android 界面框架调用界面控件的事件处理方法对事件进行处理 Android 系统界面事件的传递和处理遵循以下规则 如果界面控件设置了事件监听器, 则事件将先传递给事件监听器 如果界面控件没有设置事件监听器, 界面事件则会直接传递给界面控件的其他事件处理方法 即使界面控件设置了事件监听器, 界面事件也可以再次传递给其他事件处理方法 是否继续传递事件给其他处理方法是由事件监听器处理方法的返回值决定的 30

31 如果监听器处理方法的返回值为 true, 表示该事件已经完成处理过程, 不需要其他处理方法参与处理过程, 这样事件就不会再继续进行传递 如果监听器处理方法的返回值为 false, 则表示该事件没有完成处理过程, 或需要其他处理方法捕获到该事件, 事件会被传递给其他的事件处理方法 在 MVC 模型中, 控制器根据界面事件 (UI Event) 类型不同, 将事件传递给界面控件不同的事件处理方法 按键事件 (KeyEvent) 将传递给 onkey() 方法进行处理 触摸事件 (TouchEvent) 将传递给 ontouch() 方法进行处理 按键事件 下面以 EditText 控件中的按键事件为例, 说明 Android 系统界面事件传递和处理过程 假设 EditText 控件已经设置了按键事件监听器, 当用户按下键盘上的某个按键时, 控制器将产生 KeyEvent 按键事件 Android 系统会首先判断 EditText 控件是否设置了按键事件监听器, 因为 EditText 控件已经设置按键事件监听器 OnKeyListener, 所以按键事件先传递到监听器的事件处理方法 onkey() 中, 事件能够继续传递给 EditText 控件的其他事件处理方法, 完全根据 onkey() 方法的返回值来确定 : 如果 onkey() 方法返回 false, 事件将继续传递, 这样 EditText 控件就可以捕获到该事件, 将按键的内容显示在 EditText 控件中 ; 如果 onkey() 方法返回 true, 将阻止按键事件的继续传递, 这样 EditText 控件就不能够捕获到按键事件, 也就不能够将按键内容显示在 EditText 控件中 Android 界面框架支持对按键事件的监听, 并能够将按键事件的详细信息传递给处理方法 为了处理控件的按键事件, 先需要设置按键事件的监听器, 并重载 onkey() 方法, 示例代码如代码清单 5-37 所示 代码清单 5-37 设置按键事件的监听器, 并重载 onkey() 方法 entrytext.setonkeylistener(new public boolean onkey(view view, int keycode, KeyEvent keyevent) { // 过程代码 return true/false; 第 1 行代码是设置控件的按键事件监听器 第 3 行代码的 onkey () 方法中的参数 : 第 1 个参数 View 表示产生按键事件的界面控件 ; 第 2 个参数 keycode 表示按键代码 ; 第 3 个参数 KeyEvent 则包含了事件的详细信息, 如按键的重复次数 硬件编码和按键标志等 第 5 行代码是 onkey() 方法的返回值 : 返回 true, 阻止事件传递 ; 返回 false, 允许继续传递按键事件 KeyEventDemo 是一个说明如何处理按键事件的示例 KeyEventDemo 用户界面如图 5-27 所示 图 5-27 KeyEventDemo 用户界面 31

32 从图 5-27 中可以看出, 最上方的 EditText 控件是输入字符的区域, 中间的 CheckBox 控件用来控制 onkey() 方法的返回值, 最下方的 TextView 控件用来显示按键事件的详细信息, 包括按键动作 按键代码 按键字符 UNICODE 编码 重复次数 功能键状态 硬件编码和按键标志 界面的 XML 文件的代码如代码清单 5-38 所示 <EditText android:layout_width="match_parent" > </EditText> <CheckBox 代码清单 5-38 界面 XML 文件 android:text=" 返回 true, 阻止将按键事件传递给界面元素 " > </CheckBox> <TextView android:text=" 按键事件信息 " > </TextView> 在 EditText 中, 当任何一个键按下或抬起时, 都会引发按键事件 为了能够使 EditText 处理按键事件, 需要使用 setonkeylistener () 方法在代码中设置按键事件监听器, 并在 onkey() 方法中添加按键事件的处理过程, 代码如代码清单 5-39 所示 代码清单 5-39 setonkeylistener() entrytext.setonkeylistener(new public boolean onkey(view view, int keycode, KeyEvent keyevent) { int metastate = keyevent.getmetastate(); int unicodechar = keyevent.getunicodechar(); String msg = ""; msg +=" 按键动作 :" + String.valueOf(keyEvent.getAction())+"\n"; msg +=" 按键代码 :" + String.valueOf(keyCode)+"\n"; msg +=" 按键字符 :" + (char)unicodechar+"\n"; msg +="UNICODE:" + String.valueOf(unicodeChar)+"\n"; msg +=" 重复次数 :" + String.valueOf(keyEvent.getRepeatCount())+"\n"; msg +=" 功能键状态 :" + String.valueOf(metaState)+"\n"; msg +=" 硬件编码 :" + String.valueOf(keyEvent.getScanCode())+"\n"; msg +=" 按键标志 :" + String.valueOf(keyEvent.getFlags())+"\n"; labelview.settext(msg); if (checkbox.ischecked()) return true; else return false; 在上述代码中, 第 4 行代码用来获取功能键状态 功能键包括左 Alt 键 右 Alt 键和 Shift 键, 当这 3 个功能键被按下时, 功能键代码 metastate 值分别为 和 65; 但没有功能键被按下时, 功能键代码 metastate 值分别为 0 第 5 行代码获取了按键的 Unicode 值, 而在第 9 行中, 将 Unicode 转换为了字符, 显示在 TextView 中 第 7 行代码获取了按键动作,0 表示按下按键,1 表示抬起按键 第 7 行代码获取按键的重复次数, 但当按键被长时间按下时, 则会产生这个属性值 第 13 行代码获取了按键的硬件编码, 各硬件设备的按键硬件编码都不相同, 因此该值一般用于调试 第 14 行获取了按键事件的标志符 触摸事件 32

33 Android 界面框架支持对触摸事件的监听, 并能够将触摸事件的详细信息传递给处理方法, 不过需要设置触摸事件的监听器, 并重载 ontouch () 方法 设置触摸事件的监听器, 并重载 ontouch () 方法的代码如代码清单 5-40 所示 代码清单 5-40 设置触摸事件的监听器, 并重载 ontouch () 方法 touchview.setontouchlistener(new public boolean ontouch(view v, MotionEvent event) { // 过程代码 return true/false; 在上述代码中, 第 1 行代码是设置控件的触摸事件监听器 ; 在第 3 行的 ontouch() 方法中, 第 1 个参数 View 表示产生触摸事件的界面控件 ; 第 2 个参数 MontionEvent 表示触摸事件的详细信息, 如产生时间 坐标和触点压力等 ; 第 5 行是 ontouch() 方法的返回值 TouchEventDemo 是一个说明如何处理触摸事件的示例 TouchEventDemo 用户界面如图 5-28 所示 图 5-28 TouchEventDemo 用户界面 由图 5-28 可以看出, 上半部分的浅蓝色区域是可以接受触摸事件的区域, 用户可以在 Android 模拟器中使用鼠标点击屏幕用以模拟触摸手机屏幕 ; 下方黑色区域是显示区域, 用来显示触摸事件类型 相对坐标 绝对坐标 触点压力 触点尺寸和历史数据量等信息 在用户界面中使用了线性布局, 并加入了 3 个 TextView 控件 : 第 1 个 TextView(ID 为 touch_area) 用来标识触摸事件的测试区域 ; 第 2 个 TextView(ID 为 history_label) 用来显示触摸事件的历史数据量 ; 第 3 个 TextView(ID 为 event_label) 用来显示触摸事件的详细信息, 包括类型 相对坐标 绝对坐标 触点压力和触点尺寸 XML 文件的代码如代码清单 5-41 所示 代码清单 5-41 XML 文件 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/touch_area" android:layout_width="match_parent" android:layout_height="300dip" android:background="#80a0ff " android:textcolor="#ffffff" android:text=" 触摸事件测试区域 "> </TextView> <TextView android:id="@+id/history_label" 33

34 android:text=" 历史数据量 :" > </TextView> <TextView android:text=" 触摸事件 :" > </TextView> </LinearLayout> 在上述代码中, 第 9 行代码定义了 TextView 的背景颜色,#80A0FF 是颜色代码 ; 第 10 行代码定义了 TextView 的字体颜色 在代码中为了能够引用 XML 文件中声明的界面元素, 使用了代码清单 5-42 所示的代码 代码清单 5-42 在代码中引用 XML 文件中声明的界面元素 TextView labelview = null; labelview = (TextView)findViewById(R.id.event_label); TextView touchview = (TextView)findViewById(R.id.touch_area); final TextView historyview = (TextView)findViewById(R.id.history_label); 当手指接触到触摸屏 在触摸屏上移动或离开触摸屏时, 分别会引发 ACTION_DOWN ACTION_UP 和 ACTION_MOVE 触摸事件, 而无论是哪种触摸事件, 都会调用 ontouch() 方法进行处理 事件类型包含在 ontouch() 方法的 MotionEvent 参数中, 可以通过 getaction() 方法获取到触摸事件的类型, 然后根据触摸事件的不同类型进行不同的处理 为了能够使屏幕最上方的 TextView 处理触摸事件, 需要使用 setontouchlistener() 方法在代码中设置触摸事件监听器, 并在 ontouch() 方法添加触摸事件的处理过程 代码如代码清单 5-43 所示 代码清单 5-43 ontouch() touchview.setontouchlistener(new public boolean ontouch(view v, MotionEvent event) { ); int action = event.getaction(); switch (action) { case (MotionEvent.ACTION_DOWN): Display("ACTION_DOWN",event); break; case (MotionEvent.ACTION_UP): int historysize = ProcessHistory(event); historyview.settext(" 历史数据量 :"+historysize); Display("ACTION_UP",event); break; case (MotionEvent.ACTION_MOVE): Display("ACTION_MOVE",event); break; return true; 第 7 行代码的 Display() 是一个自定义方法, 主要用来显示触摸事件的详细信息, 方法的代码和含义将在后面进行介绍 ; 第 10 行代码的 ProcessHistory() 也是一个自定义方法, 用来处理触摸事件的历史数据 ; 第 11 行代码是使用 TextView 显示历史数据的数量 MotionEvent 参数中不仅有触摸事件的类型信息, 还有触点的坐标信息, 获取方式是使用 getx() 和 gety() 方法, 这两个方法获取到的是触点相对于父界面元素的坐标信息 如果需要获取绝对坐标信息, 则可使用 getrawx() 和 getrawy() 方法 触点压力是一个介于 0 和 1 之间的浮点数, 用来表示用户对触摸屏施加压力的大小, 接近 0 表示压力较小, 接近 1 表示压力较大, 获取触摸事件触点压力的方式是调用 getpressure() 方法 触点尺寸指用户接触触摸屏的接触点大小, 也是一个介于 0 和 1 之间的浮点数, 接近 0 表示尺寸较小, 接近 1 表示尺寸较大, 可以使用 getsize() 方法获取 34

35 Display() 将 MotionEvent 参数中的事件信息提取出来, 并显示在用户界面上 代码如代码清单 5-44 所示 代码清单 5-44 Display() private void Display(String eventtype, MotionEvent event){ int x = (int)event.getx(); int y = (int)event.gety(); float pressure = event.getpressure(); float size = event.getsize(); int RawX = (int)event.getrawx(); int RawY = (int)event.getrawy(); String msg = ""; msg += " 事件类型 :" + eventtype + "\n"; msg += " 相对坐标 :"+String.valueOf(x)+","+String.valueOf(y)+"\n"; msg += " 绝对坐标 :"+String.valueOf(RawX)+","+String.valueOf(RawY)+"\n"; msg += " 触点压力 :"+String.valueOf(pressure)+", "; msg += " 触点尺寸 :"+String.valueOf(size)+"\n"; labelview.settext(msg); 一般情况下, 如果用户将手指放在触摸屏上, 但不移动, 然后抬起手指, 应先后产生 ACTION_DOWN 和 ACTION_UP 两个触摸事件 但如果用户在屏幕上移动手指, 然后再抬起手指, 则会产生这样的事件序列 :ACTION_DOWN ACTION_MOVE ACTION_MOVE ACTION_MOVE ACTION_UP 在手机上运行的应用程序, 效率是非常重要的 如果 Android 界面框架不能产生足够多的触摸事件, 则应用程序就不能够很精确地描绘触摸屏上的触摸轨迹 如果 Android 界面框架产生了过多的触摸事件, 虽然能够满足精度的要求, 但也降低了应用程序效率 针对以上问题 Android 界面框架使用了 打包 的解决方法 在触点移动速度较快时会产生大量的数据, 每经过一定的时间间隔便会产生一个 ACTION_MOVE 事件, 在这个事件中, 除了有当前触点的相关信息外, 还包含这段时间间隔内触点轨迹的历史数据信息, 这样既能够保持精度, 又不至于产生过多的触摸事件 通常情况下, 在 ACTION_MOVE 的事件处理方法中, 都先处理历史数据, 然后再处理当前数据, 代码如代码清单 5-45 所示 private int ProcessHistory(MotionEvent event) { int historysize = event.gethistorysize(); for (int i = 0; i < historysize; i++) { 代码清单 5-45 ProcessHistory(MotionEvent event) long time = event.gethistoricaleventtime(i); float pressure = event.gethistoricalpressure(i); float x = event.gethistoricalx(i); float y = event.gethistoricaly(i); float size = event.gethistoricalsize(i); // 处理过程 return historysize; 在上述代码中, 第 3 行代码获取了历史数据的数量 ; 然后在第 4 行至 12 行中循环处理这些历史数据 ; 第 5 行代码获取了历史事件的发生时间 ; 第 6 行代码获取历史事件的触点压力 ; 第 7 行和第 8 行代码获取历史事件的相对坐标 ; 第 9 行获取历史事件的触点尺寸 ; 在第 14 行返回历史数据的数量, 主要是用于界面显示 问 :Android 模拟器支持触点压力和触点尺寸的模拟吗? 35

36 答 :Android 模拟器并不支持触点压力和触点尺寸的模拟, 所有触点压力恒为 1.0, 触点尺寸恒为 0.0 同时,Android 模拟器上也无法产生历史数据, 因此历史数据量一直显示为 自定义样式和主题 Android 也可以像 HTML/CSS 中的 style 一样, 使用自定义的 style 样式 Android 一般通过 value 文件夹下面新建一个 styles.xml 文件来设置自定义样式 这里开发者可以设置高度 填充字体颜色 字体大小 背景颜色等描述一个 View 或者一个窗口的显示属性 这就像 Web 开发中的 CSS 样式表, 使我们的样式独立于内容进行设计开发 主题和样式都是通过在 xml 文件中预定义一系列属性值, 通过这些属性值来形成统一的显示风格 不同的是, 样式只能应用于某种类型的 View; 而主题刚好相反, 不能应用于特定的 View, 而只能作用于一个或多个 Activity, 或是整个应用 下面通过代码学习一下如何自定义样式与主题, 并在程序中应用 首先是自定义样式和主题 在项目的 res/values/ 目录下添加 styles.xml 如代码清单 5-46 所示 <?xml version="1.0" encoding="utf-8"?> <resources> <!-- 定义 my_style_1, 没有指定 parent, 用系统默认的 --> <style name="my_style_1"> <!-- 定义与指定 View 相关的若干属性 --> 代码清单 5-46 styles.xml <item name="android:hint">load from style 1</item> </style> <!-- 定义 my_style_2, 用自定义的 my_style_1 作为 parent --> <style name="my_style_2" parent="@style/my_style_1"> <!-- 定义与指定 View 相关的若干属性 --> <item name="android:textsize">30sp</item> <item name="android:textcolor">#ffff0000</item> <item name="android:hint">load from style 2</item> </style> <!-- 定义 my_style_3, 用 android 的 EditText 作为 parent --> <style name="my_style_3" parent="@android:style/widget.edittext"> <!-- 定义与指定 View 相关的若干属性 --> <item name="android:hint">"load from style 3"</item> <item name="android:textstyle">bold italic</item> <item name="android:typeface">monospace</item> <item name="android:background">@drawable/mybackground</item> </style> <!-- 定义 MyTheme, 用 android 的 Theme 作为 parent --> <style name="mytheme" parent="@android:style/theme"> <item name="android:textsize">20sp</item> <item name="android:textcolor">#ff0000ff</item> <item name="android:hint">"load from style 3"</item> <item name="android:textstyle">bold italic</item> <item name="android:typeface">monospace</item> <item name="android:background">@drawable/gallery_selected_pressed</item> <item name="mystyle">@style/my_style_3</item> </style> </resources> 由上述代码可以看出, 主题和样式都可以通过在 <style> 下添加多个 <item> 来完成其定义 下面来介绍一下 <style> 的属性, 如表 5-12 所示 36

37 表 5-12 <style> 的属性 属性名称 描述 name parent style 的名字, 引用该 style 时使用此名字 一些在自定义的 style 中没有指定的属性会继承 parent style 中的值 parent 可以是 android 预定义的 resource, 也可以是自己定义的 style 为可选项 在 <item> 中定义需要改变的属性值, 例如, 可以定义颜色 高度等 Android 中能使用的属性可以在 <sdk>/docs/reference/android/r.styleable.html 中查到 ; 也可以用自己定义的属性值 下面讲解如何在程序中使用样式 : 一方面可以在 layout 的布局文件中指定自定义的样式 ; 另一方面可以在 java 代码中指定 具体代码如代码清单 所示 <EditText android:id="@+id/edittext03" </EditText> style="@style/my_style_3" android:layout_width="fill_parent" > public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); 代码清单 5-47 在布局文件中指定自定义样式 代码清单 5-48 在 java 代码中指定自定义样式 setcontentview(r.layout.main); LinearLayout ll = (LinearLayout)findViewById(R.id.main); EditText et = new EditText(this, null, R.attr.myStyle);// 指定样式 ll.addview(et); 如何在程序中使用自定义主题呢? 这与使用自定义样式相似, 都可以通过两个方法指定, 不同的是主题除了可以在 java 代码中指定以外, 还可以在 AndroidManifest 中被指定 具体代码如代码清单 所示 代码清单 5-49 在 AndroidManifest.xml 中指定自定义主题 应用于整个程序 <application android:theme="@style/mytheme"> 代码清单 5-50 在 AndroidManifest.xml 中指定自定义主题 应用于 Activity <activity android:theme="@style/mytheme"> public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); settheme(r.style.mytheme);// 设置主题 setcontentview(r.layout.main); 代码清单 5-51 在 java 代码中指定自定义主题 注意 : settheme 必须在 setcontentview(),addcontentview() 或 inflate() 等实例化 View 的函数之前调用 5.7 9Patch 9Patch 是一个对 png 图片做处理的工具 经 9Patch 处理过的图片以 *.9.png 结尾, 和普通图片相比, 四周多了一个边框, 如图 5-29 所示 37

38 图 Patch 处理过的图片 *.9.png *.9.png 是一种被 Android os 所支持的特殊图片格式, 是经过 9Patch 特殊处理过的图片 用它可以实现部分拉伸而不出现拉伸以后图片失真等不良现象 为将普通的 PNG 图片编辑转化为 9Patch 图片, 可以使用 Android SDK/tools 目录下提供的 draw9patch.bat 编辑器 draw9patch.bat 编辑器界面如图 5-30 所示 图 5-30 draw9patch.bat 编辑器界面在 draw9patch.bat 编辑器中, 可以对导入的 png 图片进行以下操作来达到想要的图片目标 Zoom: 缩放左边编辑区域的大小 Patch scale: 缩放右边预览区域的大小 Show lock: 当鼠标在图片区域时, 显示不可编辑区域 Show patches: 在编辑区域显示图片拉伸的区域 Show content: 在预览区域显示图片的内容区域 Show bad patches: 在拉伸区域周围用显示可能会对拉伸后的图片产生变形的区域 ; 根据图片的颜色值来区分是否为 bad patch 5.8 本章小结 本章主要对 Android 程序界面开发的学习, 包括用户界面基础, 界面布局特点及使用方法, 用户界面控件的使用, 选项菜单 子菜单和快捷菜单的使用方法, 界面事件的处理方法等 关键知识点测评 1. 以下有关 Android 用户界面的说法, 不正确的一个是 ( ) A.Android 用户界面框架按照 先进后出 的规则从队列中获取事件 B.Android 系统的资源文件独立保存在资源文件夹中 C.Android 系统允许不明确定义界面元素的位置和尺寸 D.Android 系统使用 XML 文件描述用户界面 2. 以下有关 Android 组件的叙述, 正确的一个是 ( ) A. 在程序运行时动态添加或修改界面布局使得在后期修改用户界面时, 无须更改程序的源代码 B. 绝对布局能够最大程度保证在各种屏幕类型的手机上正确显示界面布局 C. 框架布局中, 如果有多个子元素, 后放置的子元素将遮挡先放置的子元素 D. 在程序运行时动态添加或修改界面布局可以使得程序的表现层和控制层分离 3. 以下有关 Android 系统控件的描述, 不正确的是 ( ) 38