android用户界面

《android用户界面》由会员分享，可在线阅读，更多相关《android用户界面（91页珍藏版）》请在金锄头文库上搜索。

1、ANDROID 用户界面 英蓓特培训中心 2012. 07 主要内容 n用户界面基础 n用户界面初探 n用户界面布局 n用户界面控件 n用户界面菜单 用户界面基础 内容一 用户界面 n界面如同人的面孔，具有吸引用户的直接优势 用户界面 n用户界面（User Interface，UI）是系统和用户之间进 行信息交换的媒介，实现信息的内部形式与人类可以接 受形式之间的转换 n在计算机出现早期，批处理界面（1945-1968）和命令行界面 （1969-1983）得到广泛的使用 n目前，流行图形用户界面（Graphical User Interface，GUI） ，采用图形方式与用户进行交互的界面 n

2、未来的用户界面将更多的运用虚拟现实技术，使用户能够摆脱 键盘与鼠标的交互方式，而通过动作、语言，甚至是脑电波来 控制计算机 手机用户界面 n设计手机用户界面应解决的问题: n需要界面设计与程序逻辑完全分离，这样不仅有利于他们的并 行开发，而且在后期修改界面时，也不用再次修改程序的逻辑 代码 n根据不同型号手机的屏幕解析度、尺寸和纵横比各不相同，自 动调整界面上部分控件的位置和尺寸，避免因为屏幕信息的变 化而出现显示错误 n能够合理利用较小的屏幕显示空间，构造出符合人机交互规律 的用户界面，避免出现凌乱、拥挤的用户界面 nAndroid已经解决了前两个问题： n使用XML文件（布局文件）描述用户

3、界面；资源资源文件独立 保存在资源文件夹中； n对界用户面描述非常灵活，允许不明确定义界面元素的位置和 尺寸，仅声明界面元素的相对位置和粗略尺寸 手机用户界面 n设计手机用户界面应特别注意的问题: n手机的显示区域小，不能有太丰富的展示效果，因此要求设计 精简而不失表达能力。 n手机的操作主要依赖拇指，所以交互过程不能设计得太复杂， 交互步骤不能太多，尽量设计多点快捷方式。 n不同型号的手机支持的图片格式、声音格式、动画格式不一样 ，需要选择尽可能通用的格式，或者针对不同的型号进行配置 选择。 n不同型号的手机屏幕大小不一致，设置形状不一致，因此需要 考虑图片的自适应问题和界面元素的布局问题。

4、 ANDROID用户界面 nAndroid用户界面框架采 用MVC（Model-View- Controller）模型 n提供了处理用户输入的控 制器（Controller） n显示用户界面和图像的视 图（View），以及保存数 据和代码的模型（Model ） ANDROID用户界面 nMVC模型 nMVC模型中的控制器能够接受并响应程序的外部动作，如按键 动作或触摸屏动作等 n控制器使用队列处理外部动作，每个外部动作作为一个独立的 事件被加入队列中，然后Android用户界面框架按照“先进先出” 的规则从队列中获取事件，并将这个事件分配给所对应的事件 处理函数 事件1 事件2 事件3 事件N

5、 消息队列 View Controller Model ANDROID用户界面框架 nAndroid用户界面框架采用视图树（View Tree）模型 nAndroid用户界面框架中的界面元素以一种树型结构组织在一 起，称为视图树 nAndroid系统会依据视图树的结构从上至下绘制每一个界面元 素。每个元素负责对自身的绘制，如果元素包含子元素，该 元素会通知其下所有子元素进行绘制 ANDROID视图树 n视图树 n视图树由View和ViewGroup构成 nView是界面的最基本的可视单元，存储了屏幕上特定矩形区域 内所显示内容的数据结构，并能够实现所占据区域的界面绘制 、焦点变化、用户输入和界

6、面事件处理等功能 nView也是一个重要的基类，所有在界面上的可见元素都是View 的子类 nViewGroup是一种能够承载含多个View的显示单元 nViewGroup功能：一个是承载界面布局；另一个是承载具有原 子特性的重构模块 单线程用户界面 n单线程用户界面 n在单线程用户界面中，控制器从队列中获取事件和视图在屏幕 上绘制用户界面，使用的都是同一个线程 n优点：处理函数具有顺序性，能够降低应用程序的复杂程度， 同时也能减低开发的难度 n缺点：如果事件处理函数过于复杂，可能会导致用户界面失去 响应 用户界面初探 内容二 ANDROID应用程序模型 ANDROID 应用程序 资源 源代码

7、 Activity 控件布局（Layout ） 图片（Drawable ） 值（Values） R.java Activity 如何实现ANDROID界面 nAndroid界面布局Layout定义了界面中所有的元素、 结构和相互关系： n使用XML文件描述界面布局 n在程序运行时动态添加或修改界面布局 n布局对象在程序中的调用： nsetContentView() 从布局文件加载布局及控件 nfindViewById() 从资源中找到控件 布局Activity 加载 setContentView 使用 findViewByID ANDROID XML布局文件 n使用XML文件声明界面布局的特点

8、 n将程序的表现层和控制层分离 n在后期修改用户界面时，无需更改程序的源代码 n用户还能够通过可视化工具直接看到所设计的用户界面， 有利于加快界面设计的过程，并且为界面设计与开发带来 极大的便利性 简单的XML布局文件 线性布局 布局方向 控件 命名空间 控件资源ID 控件大小 控件显示内容 nandroid:id属性：声明了控件对象的ID，这个ID主要 用于在代码中引用这个控件对象 n“+id/button1”表示所设置的ID值 n表示后面的字符串是ID资源 n加号（+）表示需要建立新资源名称，并添加到R.java文件 中 n斜杠后面的字符串（button1）表示新资源的名称 n如果资源不是

9、新添加的，或属于Android框架的ID资源，则 不需要使用加号（+），但必须添加Android包的命名空间 ，例如android:id=“android:id/empty“ 界面对象的常规属性 android:id=“+id/button1“ nandroid:layout_width属性：用来设置控件对象的宽 度， fill_parent表示控件对象的宽度将等于父控件的 宽度 nandroid:layout_height属性：用来设置控件对象的高 度， wrap_content表示控件对象的宽度只要能够包 含所显示的字符串即可 界面对象的常规属性 android:layout_width=

10、“fill_parent“ android:layout_height=“wrap_content“ 界面对象的常规属性 nAndroid中使用的单位(在布局文件中使用ddxx) npx：表示屏幕实际的像素数。例如，320*480的屏幕在横向 有320个象素，在纵向有480个象素。 nin：表示英寸，是屏幕的物理尺寸。每英寸等于2.54厘米, 形容手机屏幕大小用的是屏幕的对角线长度。 nmm：表示毫米，是屏幕的物理尺寸。 npt：表示一个点，是屏幕的物理尺寸, 大小为1英寸的1/72。 ndp（密度独立像素）:也作dip, 是一种基于屏幕密度的抽象 单位。基本密度是160dpi，如果屏幕密度提

11、高，则dp对应 的实际px数也会相应的提高。 nsp（scale独立像素）：用于字体的一种基于屏幕密度的抽 象单位。 android:layout_width=“120dp“ 界面对象的常规属性 nandroid:text属性：用来设置控件对象上显示的文字 内容 android:text=“Button“ 引入资源 n引入资源： n将download.png文件拷贝 到/res/drawable文件夹下 n在/res目录上选择Refresh n新添加的文件将显示在 /res/drawable文件夹下 nR.java文件内容也得到了更 新 n否则提示无法找到资源的错 误 程序加载XML资源 n通

12、过调用方法：setContentView() 可以实现对 Layout布局资源的调用： public void onCreate(Bundle savedInstanceState) super.onCreate(savedInstanceState); setContentView(R.layout.main); 程序创建对象及引用 n通过调用方法：findViewById() 可以实现对控件对象 的引用： Button myButton = (Button) findViewById(R.id.button1); myButton.setText(“test“); 可视化编辑器 作业：在界

13、面中添加一个按钮，并且在程序中调用该按钮资源，显示文字“test” 用户界面布局 内容三 ANDROID界面布局 nAndroid界面布局Layout定义了界面中所有的元素、 结构和相互关系。 常用的布局对象 nAndroid操作系统提供下列5种窗体布局： u线性布局（Linear Layout） u框架布局（Frame Layout） u表格布局（Table Layout） u相对布局（Relative Layout） u绝对布局（Absolute Layout） 线性布局 - Linear Layout n线性布局LinearLayout n在线性布局中，所有的子元素都按照垂直或水平的顺序

14、在界 面上排列 n如果垂直排列，则每行仅包含一个界面元素 n如果水平排列，则每列仅包含一个界面元素 Android:orientation=“vertical”或Android:orientation=“horizontal” 线性布局实例 线性布局控件常用属性 属性功能 android:id 为控件指定相应的ID android:text 指定控件当中显示的文字，需要注意的是，这里尽量使 用strings.xml文件当中的字符串 android:gravity指定控件的基本位置，比如说居中，居右等位置 android:textSize指定控件当中字体的大小 android:backgroun

15、d指定该控件所使用的背景色,RGB命名法 android:width指定控件的宽度 android:height 指定控件的高度 android:padding指定控件的内边距，也就是说控件当中的内容 android:sigleLine 如果设置为真的话，则将控件的内容在同一行当中进 行显示,屏幕宽度不够时,将显示省略号 android:layout_weight控件的权重,以父控件为整体单位来计算 框架布局 - Frame Layout n框架布局FrameLayout n框架布局（FrameLayout）是最简单的界面布局，是用来存 放一个元素的空白空间，且子元素的位置是不能够指定的 ，只

16、能够放置在空白空间的左上角 n如果有多个子元素，后放置的子元素将遮挡先放置的子元 素 n使用Android SDK中提供的层级观察器（Hierarchy Viewer ）进一步分析界面布局, 能够对用户界面进行分析和调试， 并以图形化的方式展示树形结构的界面布局 框架布局 - Frame Layout n在层级观察器中获得示例界面布局的树形结构图 框架布局实例 表格布局 - Table Layout n表格布局TableLayout n表格布局（TableLayout）也是一种常用的界面布局，它将 屏幕划分网格，通过指定行和列可以将界面元素添加的网 格中 n网格的边界对用户是不可见的 n表格布局还支持嵌套，可以将另一个表格布局放置在前一 个表格布局的网格中，也可以在表格布局中添加其他界面 布局，例如线性布局、相对布局等等 表格布局 - Table Layout n表格布局TableLayout TextViewEditTextRow 1 ButtonButtonRow 2 表格布局 表格布局示意图 表格布局效果图 表格布局实例 表格布局常用属性 属性功能