手机平台应用开发课件：第二章 UI介绍

1、教师：教师： 金星金星办公室：逸夫楼办公室：逸夫楼C326C326电话：电话18971142771 QQQQ：6514926465149264 学习目标学习目标3 国际化重点了解掌握2样式和主题布局的类型 程序调试1 在Android应用中，UIUI（User InterfaceUser Interface）界面是人与手机之间数据传递、交互信息的重要媒介和对话接口接口。 Android程序开发最重要的一个环节就是界面处理，界面的美观度直接影响用户的第一印象，因此，开发一个整齐、美观的界面是至关重要的。2.1 UI2.1 UI概述概述2.1 UI2.1 UI概述概述 A

2、ndroid应用的界面是由ViewView和ViewGroupViewGroup对象构建而成的。View类是Android系统平台上用户界面表示的基本单元，View的一些子类被统称为Widgets（工具），它们提供了诸如文本输入框和按钮之类的UI对象的完整实现。 ViewGroup是View的一个扩展，它可以容纳多个View，通过ViewGroup类可以创建有联系的子View组成的复合控件。2.2 2.2 布局文件的创建布局文件的创建 在Android应用程序中，界面界面是通过布局文件布局文件设定的。 布局文件采用XMLXML格式，每个应用程序默认包含一个主界面布局文件，该文件位于项目的“re

3、s/layoutres/layout”目录中。 Android中中有几种布局？有几种布局？2.3 2.3 布局的类型布局的类型 Android中的布局如下：LinearLayoutRelativeLayoutTableLayoutGridLayoutFrameLayoutAbsoluteLayout2.3 2.3 布局的类型布局的类型控件盒子模型控件盒子模型一般控件属性一般控件属性 margin android:layout_marginTop android:layout_marginBottom android:layout_marginLeft android:layout_margin

4、Right 如果四面是相同的 android:layout_margin padding android:paddingTop android:paddingBottom android:paddingLeft android:paddingRight android:background #aa0000 drawable/some 如果四面是相同的 android:padding增强编程环境的自动提示功能增强编程环境的自动提示功能 XML 粘贴到里面：=:.abcdefghijklmnopqrstuvwxyz(, Alt+/：自动补全快捷键 java 粘贴到里面：.abcdefghijklm

5、nopqrstuvwxyz(, Ctrl+1：快速修复AndroidAndroid有没有有没有Border ?Border ? 没有提供。 使用background android:background 只要是drawable均可 drawable包括图片和长方形等矢量图案。 单位单位 px: 1个像素，不建议使用这个单位 PPI (DPI): Pixels (Dots) per inch，屏幕上每英寸有多少个像素。 dp: Density-independent pixels，dp*ppi/160 = px sp: Scale-independent pixels，安卓的字体单位不同屏幕分辨

6、率不同屏幕分辨率 ldpi 低分辨率 120dpi 1dp=0.75px mdpi 标准分辨率 160dpi 1dp=1px hdpi 高分辨率 240dpi 1dp=1.5px xhdpi 超高分辨率 320dpi 1dp=2px真实手机的真实手机的DPIDPI计算计算屏幕分辨率屏幕分辨率测试测试shapeshape ImageView、ImageButton等控件 android:src 设置View的drawable(如图片，也可以是颜色，但是需要指定View的大小) TextView等控件 android:background Shape的子节点 gradient - 对应颜色渐变。

7、solid - 填充。 stroke - 描边。 corners - 圆角。 padding - 定义内容离边界的距离。圆角按钮背景圆角按钮背景shapeshape代码节选代码节选 其他控件属性其他控件属性 android:gravity top, bottom, left, right, center, center_vertical, center_horizontal android:ignoreGravity android:layout_gravity 区别 前两者是对内容的限定 后者是相对父元素限定 android:scaleType 设置图片适配控件尺寸的不同方式。 2.3.1

8、相对布局（相对布局（RelativeLayout）。 在Eclipse中开发Android程序时，默认默认采用的就是相对相对布局布局。 相对布局通常有两种形式，一种是相对于容器相对于容器而言的，一种是相相对于控件对于控件而言的。2.3 2.3 布局的类型布局的类型第一类第一类: :属性值为属性值为truetrue或或false false android:layout_centerHorizontal 水平居中 android:layout_centerVertical 垂直居中 android:layout_centerInparent 相对于父元素完全居中 android:layout_a

9、lignWithParentIfMissing 如果对应的兄弟元素找不到的话就以父元素做参照物 android:layout_alignParentBottom 贴紧父元素的下边缘 android:layout_alignParentLeft 贴紧父元素的左边缘 android:layout_alignParentRight 贴紧父元素的右边缘 android:layout_alignParentTop 贴紧父元素的上边缘 第二类：属性值必须为第二类：属性值必须为idid的引用名的引用名“id/id-nameid/id-name” android:layout_below 在某元素的下方 an

10、droid:layout_above 在某元素的上方 android:layout_toLeftOf 在某元素的左边 android:layout_toRightOf 在某元素的右边 android:layout_alignTop 本元素的上边缘和某元素的的上边缘对齐 android:layout_alignLeft 本元素的左边缘和某元素的的左边缘对齐 android:layout_alignBottom 本元素的下边缘和某元素的的下边缘对齐 android:layout_alignRight 本元素的右边缘和某元素的的右边缘对齐2.3 2.3 布局的类型布局的类型 2.3.2 线性布局（线

11、性布局（LinearLayout） 线性布局是Android中较为常用的布局方式，它使用标签表示。 线性布局有两种方式指定控件位置，一种是水平方向水平方向，一种是竖直竖直方向方向。 属性属性 android:orientation 布局的方向 layout_weight 相对大小 取值：一个非负整数值 线性布局会根据该控件layout_weight值与其所处布局中所有控件layout_weight值之和的比值为该控件分配占用的区域。 注意： 如果layout_weight指为0，控件会按原大小显示，不会被拉伸。2.3 2.3 布局的类型布局的类型 2.3.3 表格布局（表格布局（TableLa

12、yout） 表格布局就是让控件以表格以表格的形式来排列组件的，只要将组件或信息放在单元格中，控件就可以整齐整齐的排列排列。 在TableLayout中，行行数由TableRow对象控制的，即布局中有多少TableRow对象，就有多少行。2.3 2.3 布局的类型布局的类型 2.3.4 网格布局（网格布局（GridLayout） 网格布局是Android4.0Android4.0新增的布局，它实现了控件的交错显示交错显示，能够避免因布局嵌套对设备性能的影响，更利于自由布局的开发。 网格布局用一组无限细无限细的直线直线将绘图区域分成行行、列列和单元单元，并指定控件的显示区域和控件在该区域的显示方式

13、。2.3 2.3 布局的类型布局的类型 脚下留心：脚下留心： 由于GridLayout是Android4.0之后有的新功能，如果要在项目中使用这种布局，需要把SDK的最低版本指定为Android4.0（API14）以上。 AndroidManifest.xml中，配置SDK兼容的最低版本和最高版本示例代码如下： uses-sdk android:targetSdkVersion=17 /2.3 2.3 布局的类型布局的类型 2.3.5 帧帧布局布局 （FrameLayout) 帧布局为每个加入其中的控件创建一个空白区域空白区域（称为一帧，每个控件占据一帧）。 采用帧布局设计界面时，只能在屏幕左

14、上角显示左上角显示一个控件，如果添加多个控件，这些控件会按照顺序在屏幕的左上角重叠显示重叠显示，且会透明透明显示之前控件的文本文本。 2.3 2.3 布局的类型布局的类型 2.3.6 绝对布局绝对布局 AbsoluteLayout 绝对布局需要通过指定x、y坐标坐标来控制每一个控件的位置，放入该布局的组件需要通过android:layout_x和android:layout_y两个属性指定其准确的坐标值，并显示在屏幕上。2.3 2.3 布局的类型布局的类型 2.3.6 绝对绝对布局布局 （AbsoluteLayout）绝对布局多用于游戏开发中，由于多分辨率兼容麻烦，绝对布局在Android1.

15、5后被Google弃用，因此应用开发一般情况下不推荐使用绝对布局。2.3 2.3 布局的类型布局的类型 2.3.7 案例案例用户注册用户注册 接下来通过一个用户注册的案例演示相对布局和线性布局的使用。2.4 2.4 样式和主题样式和主题 2.4.1 样式和主题的使用样式和主题的使用 Android系统中，包含了很多定义好的样式和主题，这些样式和主题用于定义定义布局显示在界面上的风格风格。 下图就是一幅设置了窗口化主题的应用。2.4 2.4 样式和主题样式和主题 2.4.2 案例案例自定义样式和主题自定义样式和主题 尽管Android系统提供了很多样式和主题，但有时这些效果并不能满足实际需求，此

16、时还可以自定义自定义样式样式或者主题主题。 自定义样式和主题的步骤如下： 1）在res/values 目录创建样式文件style.xml，添加 根节点。 2）在节点中添加一个节点，并在该节点中为样式或 主题定义一个名称。 3）在节点中声明一个或多个，每个节点需要定义一 个属性名，并在元素内部设置这个属性的值。 2.4 2.4 样式和主题样式和主题 2.4.2 案例案例自定义样式和主题自定义样式和主题 接下来通过一个具体的案例来演示如何自定义样式和主题。2.5 2.5 国际化国际化 2.5 国际化国际化 国际化国际化是指软件开发时，应该具备支持多种语言和地区的功能，为不同国家和地区的用户，提供符

17、合来访者阅读习惯的页面或数据。 由于国际化InternationalizationInternationalization这个单词的首字母“I”和尾字母“N”之间有18个字符，因此国际化被简称为I18NI18N。 为了提供不同语言版本，开发者只需要在res目录下新建对应的values文件夹。2.5 2.5 国际化国际化 2.5 国际化国际化 接下来通过一个案例I18N来展示图片、文字的国际化。I18N实现了在系统设置页面切换不同国家语言，在程序界面展示不同国家的国花以及文字。2.6 2.6 程序调试程序调试 2.6.1 Junit单元测试单元测试 JUnit是一个测试框架，它是Android

18、SDK1.5加入的自动化测试自动化测试功能。在完成某个功能后对该功能进行单独测试，而不需要把程序安装到手机或模拟器中进行测试，这样会大大提高程序开发的准确性。 JUnit单元测试既可以嵌入到项目中，也可以作为一个单独的项目，针对某个项目进行测试。具体步骤如下： 1）配置JUnit环境 2）创建测试类 3）运行测试2.6 2.6 程序调试程序调试 2.6.2 LogCat使用使用 LogCat用于输出Android程序中的日志信息。它支持五种输出方式，级别由低到高分别是：Verbose（V）： 显示全部信息，黑色Debug（D）： 显示调试信息，蓝色Info（I）： 显示一般信息，绿色Warming（W）：显示警告信息，橙色Error（E）： 显示错误信息，红色2.6 2.6 程序调试程序调试 2.6.2 LogCat使用使用 由于LogCat中输出的信息多而繁杂，找到所需要