消费电子中的平板电脑会死吗？

先来扒一扒平板电脑的历史，真正意义上的第一台用作商业的平板电脑是1989年9月上市的GRiD Systems制造的GRiDPad,它的操作系统基于MS-DOS。没想到吧，第一台上也平板电脑竟然采用的是DOS操作系统。 　　平板电脑（Tablet PC）这一命名真正出现的时间是2002年秋季，当时微软公司大力推广Windows XP Tablet PC Edition而渐渐变得流行起来，它的出现让平板电脑走向了大众，让平板电脑开始逐渐出现在了电脑消费者的视线内。 　　但真正引爆是，2010年1月27日，苹果公司发布旗下平板电脑产品--iPad.据乔布斯在2011年新品发布会上公布的资料显示，

TI平板解决方案

main却要我做“原始”的模块，我仅有的在(固体电子学) （国内的垃圾杂志）发过的一篇论文就是轨到轨(rail-to-rail)放大器。 做的过程中很郁闷，非常羡慕我同学的项目，但是感觉李老师和郑老师讲的总有他们道理，所以我就专门看JSSC运放方面的文章，基本上近20多年的全看了。当时以为很懂这个了，后来工作后才发现其实还没懂。 所谓懂，是要真正融会贯通，否则塞在脑袋里的知识再多，也是死的。但是运算放大器是模拟电路的基石，只有根基扎实方能枝繁叶茂，两位老师的良苦用心工作以后才明白。总的来说，在复旦，我感触最深的就是郑老师的严谨治学之风和李老师的这句话。 硕士毕业，去找工作，当时有几个offer。 我师兄孙立平， 李老师的关门弟子，推荐我去新涛科技，他说里面有个常仲元，鲁汶天主教大学博士，很厉害。我听从师兄建议就去了。新涛当时已经被IDT以8500万美金收购了，成为国内第一家成功的芯片公司。面试我的是公司创始人之一的总经理Howard. C. Yang（杨崇和）。 Howard是Oregon State University 的博士，锁相

福布斯中文网：Windows8壮志未酬身先死?

Windows8,一直以来，微软忙前忙后为Windows,8这款主要是针对平板市场的系统宣传造势。平板电脑眼下已经在挖台式电脑和笔记本电脑的墙角。就像世界上的其他人一样，微软认为有朝一日平板将主导个人电脑市场。

Web的无声杀手——智能手机

由于年轻的下一代人绝大多数都选择智能手机，因此下一个大事件是：2014年，使用智能手机的用户将超过传统计算机用户，从而进一步推动我们进入应用为先的世界。届时，我们也会将重点从PC、平板慢慢转移到智能手机上。PC已经死亡、PC万岁……伴随着笔记本和台式机的销量不断下滑，类似于上面的这些标题已经存在很多年。与此同时，随着苹果和微软等许多公司开始将重心转向平板为先的世界，平板电脑也被大家视为PC的替代者，虽然这一过程仍然需要好几年。是的，这样的看法并没有什么问题。由于平板电脑不断侵蚀PC的市场份额，传统PC出货量开始明显下滑，再加上对PC不再看好，不少公司也开始退出PC市场。然而直到苹果在财报电话会

软件工程教程

软件工程ppt 建议没有基础或者兴趣的同学别下载 因为软件工程理解需要耐心和能力 主讲：邱焕耀 经历 华南理工大学，博士，计算机控制 曾任职以下公司： 中国民航信息广州公司（香港上市）技术总监 广州金鹏集团（电子百强）项目总监 广东金宇恒（佛山最大软企）技术总监 曾获国家创新基金、广州科学技术奖 中联通炫铃广东/湖南/广西项目负责人(用户800万) 长期移动、民航、政府、互联网行业软件研发 项目一 软件工程概述 任务1 软件工程任务2 软件生命周期与软件开发模型任务3 建模工具 最富哲理的软件工程 UML是“三人帮”“捣”出来的 迭代开发过程这样流转 软件工程水平是这样提高的 敏捷开发过程－Scrum 送餐管理系统－－用例图 送餐管理系统－－类图 送餐管理系统－－顺序图 任务1 软件工程 软件的定义及其特点 软件危机 软件工程概念 软件的定义及其特点 软件的定义 软件是计算机系统中与硬件相互依存的部分，它是包括程序、数据及相关文档的完整集合。 软件的定义及其特点 软件危机 软件危机 软件危机 在软件开发和维护过程中所遇到的一系列严重问题 软件危机的表现 对软件开发成本和进度的估算很不准确 用户很不满意 质量很不可靠 没有适当的文档 软件成本比重上升 供不应求：软件开发生产率跟不上计算机应用迅速深入的趋势 软件危机 原因 客观：软件本身特点 逻辑部件 规模庞大 主观：不正确的开发方法 忽视需求分析 错误认为：软件开发=程序编写 轻视软件维护 软件危机 产生的原因（软件开发人员的错误观点）： “有一个对目标的概括描述就足以着手编写程序了，许多细节可以在以后再补充” “所谓软件开发就是编写程序并设法使它运行” “用户对软件的要求不断变化，然而软件是柔软而灵活的，可以轻易地改动” “软件投入生产性运行以后需要的维护工作并不多，而且维护是一件很容易做的简单工作” 软件危机的解决 解决途径 组织管理 工程项目管理方法 技术措施 软件开发技术与方法 软件工具 软件工程概念 软件工程的概念 应用计算机科学、数学及管理科学等原理，以工程化的原则和方法来解决软件问题，指导计算机软件开发和维护的一门工程学科。  软件工程的原则 任务2 软件生命周期与软件开发模型 软件生命周期 软件开发模型 软件生命周期 软件定义 阶段 软件开发阶段 软件的使用和维护阶段 退役 软件开发模型 瀑布模型 软件开发模型 演化模型 螺旋模型 喷泉模型 任务3 建模工具 两种典型的建模工具 : 1．IBM Rational Rose 2．Microsoft Office Visio IBM Rational Rose Microsoft Office Visio Visio是一个图表绘制程序，可以帮助用户描述复杂设想以及系统的业务和技术图表。使用Visio创建图表可以使信息形象化，能够以更为直观有效的方式进行信息交流，这是单纯的文字和数字无法比拟的。 软件工程课程设计 考核方式: 课程设计(附设计说明文档,正文字数不少于1000字)(60%)+平时作业及实验(30%)+平时表现(10%),按优秀、良好、中、及格、不及格五级评定成绩 通过演示及讲述，讲解课程设计的整体情况，针对其设计提出一些技术及细节问题确认是否真正理解课程设计中的要点、是否掌握了进行系统设计的知识和能力、是否本人完成。如通发现没有真正设计或者不清楚技术细节，则课程设计不及格。 答辩部分: 40分（没有课程设计说明文档不予参加答辩） 设计部分: 60分 选题：创新性, 实用性, 界面美观友好（15分） 难度：设计包含的难度（15分） 设计的完整性（30分） 迭代和增量开发方式 迭代过程的优势 复杂系统－分解－>多个简单系统 提高软件项目可控性 降低软件开发风险 有效地应对需求变更 何时使用迭代开发？ 只对希望成功的项目使用 项目二 统一建模语言UML 任务1 UML概述任务2 UML静态建模任务3 UML动态建模 任务1 UML概述 UML的概念 UML的发展 UML的主要内容 UML与OO（面向对象） UML的概念 UML的概念 UML Unified Modeling Language 统一建模语言 统一建模语言是一种通用的可视化建模语言，用于对软件系统的制品进行规范化、可视化处理，然后构造它们并建立它们的文档。 UML的发展过程 图 与 语言 谁一级棒？ UML的优势 过去数十种面向对象的建模语言各自为战，而UML可以消除一些潜在差异，一统江湖 通过统一语义和符号表示，提高面向对象技术 使项目建立在一个成熟的标准建模语言基础之上 便于沟通和交流，统一的理解 UML主要内容 精确的元模型定义 UML表示法 UML表示符 UML可视化的图形建模语言 UML提供了五类图形 任务2 UML的概念模型 UML基本的构造块 事物 关系 图 UML 公共机制 规格说明 UML模型： 使用图和图标可视化模型 各种建模元素的规格说明所组成 规格说明 模型元素的特征和语义的文本描述—模型的“肉” 形成了承载模型的语义背板，赋予模型意义，各种图仅仅是该背板的视图或者可视化投影 修饰 修饰：图中建模元素上暴露的信息项 任何UML图仅是模型的视图， 只有在修饰增强了图的整体清晰性和可读性或者突出模型的某些重要特征时，才应该表示那些修饰 公共分类 描述认识世界的特殊方法 类和实例 类元：一类事物的抽象概念；如“银行帐户” 实例：一类事物的特定实例；如“张三丰帐户” 接口和实现 接口：说明事物行为的契约（做什么） 实现：事物是如何工作的特殊细节（如何做） 扩展机制 约 束：允许对模型元素添加新的规则 构造型：基于已有的建模元素引入新的建模元素 标记值：允许为模型元素添加新的特性，是带有相关值得关键字 JAVA开发平台体系结构 构架是一个系统的组织结构包括： 1. 系统分解成的各个部分 2. 它们的连接性 3. 交互机制 4. 通知系统设计的向导规则 JAVA开发平台架构 构架是一个系统的组织结构包括： 1. 系统分解成的各个部分 2. 它们的连接性 3. 交互机制 4. 通知系统设计的向导规则 架构 构架是一个系统的组织结构包括： 1. 系统分解成的各个部分 2. 它们的连接性 3. 交互机制 4. 通知系统设计的向导规则 4+1视图 UML小结 任务3 UML静态建模机制 用例图 类图 对象图 包 使用类图的建议 用例图 用例“捕获需求” 用例图从系统外部、从用户角度出发描述系统的功能集 用例图所描述的系统功能依靠外部用户或另一个系统激活，为用户或另一个系统提供服务 用例表达“做什么” 用例图中可以包含若干个用例，用例表达了系统的功能 用例只描述参与者和系统在交互过程中做些什么，并不描述怎么做。 用例图 关联关系 用例图 泛化关系 用例图 泛化关系 用例图 用例图 用例图 用例用于什么情况？ 不知道什么情况不用用例 如果没有用到用例，闭门反省 实例：监听器用例 实例：监听器用例 功能需求 监听删除操作,保证数据的安全。 场景 监听删除操作 删除操作一旦执行，立即被监听器捕获到，进而在执行 删除操作前执行自定义的函数体，即判断实体有无undeletable标签，有则中断删除操作，无则正常删除。 用例图 关系 关联关系 ；依赖关系 ；泛化关系；关系的扩展 类图 类 名称；属性；操作 关联关系 泛化 依赖关系 约束 类图 类 名称；属性；操作 类图 类图 类图 类图 类图 何时用 类图？ 类图是面向对象方法的支柱 如果没用到类图？？ 找电杆撞下，看是否用面向对象方法 用 类图 的危险！ 类图用滥了，建狗屋画了10页类图 类图没分清粗细层次： 概念类图 规约类图 实现类图 鸟类图 鸟类图 鸟类图 实例：监听器类图 使用类图的建议 不要试图使用所有的符号 根据项目开发的不同阶段，用正确的观点来画类图 不要为每个事物都画一个模型，应该把精力放在关键的领域 对象图 对象图 表示在某一时刻类的具体实例和这些实例之间的具体连接关系 类 与 对象 关系 类 与 对象 关系 类图和对象图的区别 包 包 一种分组机制，把各种各样的模型元素通过内在的语义连在一起成为一个整体就叫做包 包的关系 包－－软件比赛作品 架构图－－包图的变形 任务4 UML动态建模机制 对象之间的交互 状态图 交互图 活动图 四种图的运用 软件模型与现实 模型与现实要匹配 对象之间的交互 简单消息 同步消息 异步消息 同步且立即返回消息 什么是状态图？ 状态图 用来建模对象是如何改变其状态以响应事件，展示对象从创建到删除的生命周期 状态图 状态标记符 状态图 实例：打电话 状态图 状态和转移 事件 状态图 如果你太喜欢 状态图 详细状态 状态图 子状态 状态图 子状态 状态图 子状态 航班状态 放松下 交互图 顺序图 交互图 顺序图 实例：监听器顺序图 电影动画－软件模型 电影大量使用3D动画 交互图 协作图：交互关系 和 链接关系 链接；消息流；对象生命周期 交互图 协作图：交互关系 和 链接关系 交互图 协作图 链接；消息流；对象生命周期 顺序图与协作图 相同点 描述对象间的交互关系 不同点 顺序图：交互的时间顺序 协作图：交互的静态链接关系 3D电影动态建模 活动图 －状态变种 活动图 －状态变种 活动图 活动和转移 泳道 对象 信号 活动图 活动和转移 泳道 对象 信号 四种图的运用 动态建模 目的、侧重不同 状态图只有极少关键对象 顺序图、协作图：单用例中几个对象的行为 顺序图突出顺序，协作图着重对象间链接关系 项目三　项目市场调研 任务1. 系统的研发背景 任务2. 软件开发计划 油画创作背景 波洛克 《1948年第五号》 1.4亿$，最昂贵画作 这幅画在一副优雅的4x8英尺画布上以画家特有的滴溅泼洒的艺术手法来进行风暴式设计并拨开油彩。 任务1 系统的研发背景 追问：为什么呢？ 你好，这里是梦幻家园售楼处，我是蔡小姐。 我是张总，我严重警告你。 为什么呢？ 试用期2月了，你有业绩吗？你卖出去过一套房子吗？ 为什么呢？ 问你自己！ 哦……为什么呢？ 今天下班之前你要再不卖出一套房子去，你就给我卷铺盖走人！ （电话挂了） 为什么呢？ 项目背景－－钢琴练奏师 问：为什么开发这个软件？ 答： 传统的音乐播放器功能单一 用户对音乐缺少参与感 问：开发这个软件目标是什么？ 答： 提高用户对音乐的学习和娱乐 参与创作音乐 项目背景－－钢琴练奏师 问：为什么传统音乐程序不好？ 答： 传统音乐程序功能单一，容易令人感到枯燥无味，没有吸引力； 传统音乐程序强调单方向，用户没有参与感； 传统音乐程序设计不够灵活，扩展性差。 项目背景－－钢琴练奏师 问：开发内容包括什么？ 答： 本项目从Android的声音处理入手，实现音乐功能，根据用户的兴趣，提高用户参与度。 问：有什么应用价值？ 答： 本项目是一个能提高用户参与和娱乐程序的项目，具有一定的使用价值。 追求的结果－－钢琴练奏师 1.2 项目背景 传统的音乐播放器功能单一，用户对音乐缺少参与感，本项目志在提高用户对音乐的学习和娱乐，参与创作音乐： （1）传统音乐程序功能单一，容易令人感到枯燥无味，没有吸引力； （2）传统音乐程序强调单方向，用户没有参与感； （3）传统音乐程序设计不够灵活，扩展性差。 本项目从Android的声音处理入手，实现音乐功能，根据用户的兴趣，提高用户参与度。本项目是一个能提高用户参与和娱乐程序的项目，具有一定的使用价值。 系统的研发背景 1.图书馆系统的提出 传统的手工方式对图书信息的管理已越来越不能适应社会发展的需要，尤其是随着计算机网络和Internet的普及，运用先进的信息管理系统对信息进行科学化和网络化管理，已成为图书信息管理系统发展的趋势。 系统的研发背景 2.国内外研发现状 图书管理系统的发展历史 国内外应用的图书管理系统调研 （1）开发方式 （2）开发方法 （3）结构形式 （4）开发平台 （5）系统使用的范围 （6）按照系统开发主体面向的对象 国内图书管理系统应用情况 国内Android开发行业市场现状 国内的Android开发还是以应用开发为主，主要分成3类： 为企业开发应用 开发通用应用（Android Market或者其他App Market销售） 游戏开发（Android Market或者其他App Market销售）。 国内Android开发行业市场现状 第一类开发者 在较大的公司，为自有品牌或者其他品牌设计手机或者平板电脑的总体方案。 根据需求对系统进行定制外，为系统编写定制的应用。 第二类开发者 在创业型公司或者是独立开发者，盈利方式主要2种： 为国外公司外包开发，或者通过Google的移动广告（AdMob）点击分成。 通过付费下载的形式来盈利的，现在国内鲜见成功者。 第三类开发者 和第二类开发者类似。开发者提交的应用开发数目远超游戏开发。 任务2 软件开发计划 任务2 软件开发计划 软件开发计划 软件开发计划 问题定义－案例 项目可行性 软件开发计划 软件开发计划 可行性分析－案例1 炫铃项目的可行性 无人 无积累（技术） 环境（有市场前景） 资金（1年） 可行性分析－案例2 华为任正非早期冒险： 人不够（一边开发，一边找人） 无积累（无技术－－红宝书） 资金（前期约1年，后欠工资） 环境（有市场，政策无支持） 一拍脑袋：“豁出去，干！” 可行性分析－案例3 联想集团柳传志 没钱赚的事我们不干； 有钱赚但投不起钱的事不干； 有钱赚也投得起钱但没有可靠的人选，这样的事也不干。 成本收益分析 成本： （1）办公室房租。 （2）办公用品，如桌、椅、书柜、电器、空调。 （3）计算机、打印机、网络等硬件设备。 （4）电话、传真等通讯设备以及通讯费用。 （5）资料费。 （6）办公消耗，如水电费、打印复印费等。 （7）软件开发人员与行政人员工资。 （8）系统软件费用，如数据库、开发工具等。 （9）市场调查、可行性分析、需求分析的费用。 （10）公司人员培训费用。 （11）产品宣传费用。 （12）如果客户攻关费，吃喝玩乐的费用。 （13）管理费。每戳一个公章都要化一把钞票。 收入： 项目收入（合同） 技术可行性 技术可行性可以表述为： 做得了吗？ 做得好吗？ 做得快吗？ 社会环境的可行性 社会环境的可行性: 市场 未成熟的市场 成熟的市场 将消亡的市场 政策 例： 民航收费 电信收费 人才可行性 有人吗？ 手上的人 挖掘一下 够用吗？ 要多少才够 成本超支 可找吗？ 挖得到 给得起￥ 软件开发计划 软件开发计划 软件开发计划 软件开发计划 小结 项目四 软件项目需求分析 项目四 软件项目需求分析 任务1. 调查系统的需求 任务2. 模型 任务3. 事件 任务4. 事物 任务5. 实体—联系图 任务6. 类图 任务1. 调查系统的需求 1. 调查系统的需求 功能需求和技术需求 系统相关者 建立系统需求原型 需求分析的困难！ （1）客户说不清楚需求； （2）需求自身经常变动； （3）分析人员或客户理解有误。 需求分析的困难！ （1）客户说不清楚需求 例：买鞋子 脚 大小 形状 需求分析的困难！ （2）需求自身经常变动 没有一个软件的需求改动少于三次 唯一改动需求两次的 在去第三次改动需求的路上去世了 例：时装 需求分析的困难！ （3）分析人员或客户理解有误 调查系统的需求 1.功能需求和技术需求 功能需求 系统必须完成的活动，是系统将要投入的业务应用 技术需求 和企业的环境、硬件和软件有关的所有可操作目标 调查系统的需求 树上有10只鸟，打了1只，还有几只？ “是无声手枪或别的无声的枪吗？” “不是。” “枪声有多大？” “80-100分贝。” “那就是说会震的耳朵疼？” “是。” “在这个城市里打鸟犯不犯法？” “不犯。” “您确定那只鸟真的被打死啦？” “确定。”偶已经不耐烦了“拜托，你告诉我还剩几只就行了，ok” “ok，树上的鸟里有没有聋子？” “没有。” “有没有关在笼子里的？” “没有。” “边上还有没有其他的树，树上还有没有其他鸟？” “没有。” “有没有残疾的或饿的飞不动的鸟？” “没有。” “算不算怀孕肚子里的小鸟？” “不算。” “打鸟的人眼有没有花？保证是十只？” “没有花，就十只。” 偶已经满脑门是汗，且下课铃响，但他继续问, “有没有傻的不怕死的？” “都怕死。” “会不会一枪打死两只？” “不会。” “所有的鸟都可以自由活动吗？” “完全可以。” 学生满怀信心的说，“打死的鸟要是挂在树上没掉下来,那么就剩一只，如果掉下来，就一只不剩。” 调查系统的需求 2. 系统相关者 用户：实际使用系统处理日常事务的人 客户：那些购买和拥有系统的人 技术人员：确保系统运行的人 外部实体：例如公司的顾客 调查系统的需求 需求调查方法： 直接与客户交谈 足球评论员“大嘴” 侃出需求 有些需求客户讲不清楚 请教行家 “听君一席言，胜读十年书。” 客户与分析人员想都没有想过 分析同类软件，优点、缺点 坐享其成 调查系统的需求 3.建立系统需求原型 （1）确定现有系统的物理过程和活动 （2）从现有物理过程中提取出业务逻辑功能 （3）为将在新系统中使用的方法开发出业务逻辑功能（删） （4）定义新系统的物理处理需求 （物理改为业务） 任务2 模型 2. 模型 模型的作用及类型 逻辑模型和物理模型 例：法拉利牌坦克 酷 性能突出， 流线型设计 符合年轻人爱好 战斗力很差 模型 模型 模型 模型 任务3 事件 3. 事件 事件的概念和类型 事件定义 图书馆管理系统中的事件 事件 事件 事件 《金刚》－3D软件建模 2.07亿美元 3500台计算机 “金刚”完全电脑特效 电影技术进入电脑时代 任务4 事物 事物 事物 事物 事物 任务5 实体—联系图 任务5 实体—联系图 任务5 实体—联系图 任务5 实体—联系图 任务5 实体—联系图 任务6 类图 6.类图 用面向对象的方法分析事物 类图的符号 建模的目标 需求分析规格说明书编写提纲 类图 1.用面向对象的方法分析事物 分类分析方法（概括－具体） 继承 类图 1.用面向对象的方法分析事物 分类分析方法（概括－具体） 继承 类图 1.用面向对象的方法分析事物 整体—局部分析方法 聚合 合成 类图 2.类图的符号 基于统一建模语言（UML） 面向对象系统开发中建立模型的实际标准 类图 2.类图的符号 基于统一建模语言（UML） 面向对象系统开发中建立模型的实际标准 类图 3. 建模的目标 结构化方法：－－错误的！ 事件表－>数据流图（DFD） 面向对象方法： 事件表－>用例图－>类图－>顺序图/状态图 类图 3. 建模的目标 结构化方法--错误的！ 面向对象方法 需求分析规格说明书 仅仅建模还是不够的 需求分析成果－>需求分析说明书 需求分析规格说明书提纲 1．引言 2．任务概述 3．需求规定 4．运行环境设定 5．缩写词表 6．参考文献 送餐管理系统－－需求分析过程 分析员：“在你们打理生意时，哪些事情促使你们决定采用计算机管理？告诉我通常这些业务是如何进行的。” 客户：“是这样，当客户打电话订餐时，我需要把它记下来，然后通知给相应的餐馆。我需要决定派哪一个司机去送货，因此要司机打电话告诉我他们什么时间有空。有时，客户会又打电话更改订单内容，因此我必须找到原始订单，然后通知餐馆更改。” 分析员：“好的，那你们又怎么管理现金呢？” 客户：“司机取饭菜时会从餐馆直接拿到账单的副本，账单和我们的计算应该是一致的，然后司机送货时收取相应的现金并加上服务费。在下班时，司机报账，我们把司机收到的现金汇总起来，和我们的记录进行比较，所有的司机都交完账后，我们需要开张银行存款单，存入当天的现金总收入。每周末，我们按提前约定的批发价来计算欠餐馆多少钱，把结算单和支票寄给他们。” 送餐管理系统－－需求分析过程 分析员： “那你们还想从这个系统中获取别的信息吗？” 客户：“如果每周末能统计出每个餐馆有多少订单、城里每个区有多少订单等信息就更好了。这能帮助我们制定广告策略及与餐馆的合同，而且我们还需要每月财务状况统计结果。” 在客户说话时，分析员记下了几个要点，画了几张草图。之后，他花了一些时间仔细考虑，总结出“送餐管理”的需求状况。 送餐管理系统－－需求分析过程 1.在发生如下事件时，系统可以进行处理： 客户打电话下订餐订单 客户打电话修改订单 送货司机汇报工作情况 送货司机上交一天的收入 2.在特定时间内系统产生所需信息： 生成日结算存款单 生成周末餐馆支付帐单 生成周销售报表 生成月财务报表 3.需要建立业务实体： 餐馆 菜单 客户 订单 订单支付帐单 司机（送餐员） 送餐管理系统－－用例图 送餐管理系统－－类图 送餐管理系统－－顺序图 小结 面向对象分析方法（掌握） 用例图 类图 顺序图 状态图/协作图（可选） 结构化分析方法（了解） 实体－联系图 数据流图 项目五　软件项目总体设计 软件项目总体设计 1.总体设计基本内容 2. 结构化软件设计 3. 面向对象软件设计 任务1 软件总体设计 1.总体设计的基本内容 软件设计定义 总体设计的目标与步骤 总体设计的基本任务 总体设计的准则 软件设计分解过程 总体设计的基本内容 1.软件设计 设计解决从需求（做什么？）到（怎么做？） 概要设计（总体设计） 将软件需求转化为软件体系架构 确定系统级接口 全局数据结构或数据库模式 详细设计 确立每个模块的实现算法和局部数据结构 用适当方法表示算法和数据结构的细节 软件设计 总体设计 体系结构 就如同人的骨架 如骨架是猴子，无论怎样喂养和美容，始终是猴子，成不了人。 模块（子系统） 就如同人的器官，有特定的功能 最出色的子系统是手，只有几种动作，却能做无限多的事情。 最糟糕的模块设计之一是嘴巴，混合毫无相干的功能（如吃饭、说话、亲吻） 软件设计 详细设计 数据结构与算法 如同人的血脉和神经（发挥功能） 聋子天生就是哑巴（关系） 人体的数据结构与算法设计十分神奇也十分可笑 用户界面 如同人的外表，让人一见钟情（或一见呕吐） Unix系统是健壮的汉子和妇人 Windows系统是妩媚的小白脸和狐狸精 化妆可以获得更好的界面 总体设计的基本内容 1.总体设计的目标 设计合理的软件架构 分解为合理的模块（包） 2.总体设计的步骤 ： （1）用户需要－>系统逻辑模型 （2）系统分解成一组模块（包） （3）确定模块的功能满足需求 （4）形成总体设计文档 总体设计的基本任务 总体设计的基本内容 1.软件设计 软件架构是总体设计的核心内容 体系结构是本质的 软件系统中最本质的东西 对复杂事物的一种抽象 在一定的时间内保持稳定 常见层次结构和WEB结构 总体设计－－层次结构 为什么分层次？ 系统太复杂 无法一口气干完 与人的认识符合 总体设计－体系结构 总体设计－－网络结构 总体设计－－系统架构 总体设计－－模块功能划分 体系结构－（决定）各模块功能 从功能上划分模块 模块化设计原则 保持“功能独立” 抽象（事物本质） 信息隐藏 总体设计－－模块功能划分 保持“功能独立” 降低开发、测试、维护等阶段的代价 沟通成本最低 例：美国独立战争 （独立国家） 总体设计－－模块功能划分 抽象（事物本质） 抽象是设计的本质 例： 微软和联通有仇？ 国际码，“啊”：B0A1 总体设计－－模块功能划分 信息隐藏 模块只提供对外的接口 模块内部不对外开放 好事不出门，坏事传千里！（克林顿） 老师：要是坐在后排聊天的同学能象中间打牌的同学那么安静，就不会影响到前排睡觉的同学。 总体设计－－UI模块 总体设计－－DAO模块 总体设计－－DAO模块 总体设计－－DAO模块 总体设计的基本内容 3 系统架构 3.1 系统总体架构 3.1.1 UI构件 3.1.2 DAO构件 3.1.3 MVC构件 3.1.4 MODEL构件 总体设计的准则 任务2 结构化的软件设计 1.结构化设计的基本概念 （1）模块 （2）模块的独立性 （3）抽象 （4）信息隐蔽 结构化的软件设计 2.结构化的设计方法 （1）功能模块划分设计 （2）面向数据流设计 （3）输入/输出设计 模块划分的设计 功能模块划分设计 面向数据流设计 变换型数据流设计 面向数据流设计 事务型数据流 输入/输出设计 输入/处理/输出设计 结构化的软件设计 3.运行环境设计 硬件平台 CPU 硬盘 内存 软件平台 操作系统 数据库 任务3 面向对象设计 面向对象的的设计方法 系统行为−图书管理系统的用例图 对象交互−图书管理系统的交互图 对象行为−图书管理系统的状态图 面向对象的软件设计 面向对象的软件设计 是一种新的程序设计范型 是一种运用 对象、 类、 继承、 封装、 聚合、 消息传送、 多态性等 概念来构造系统的软件开发方法 面向对象方法主要思想 面向对象方法主要思想 面向对象开发方法的开发过程 软件开发全过程运用面向对象方法 面向对象语言正取得令人振奋的发展 编程并不是软件开发问题的主要根源 需求分析与设计问题更为普遍并且更值得解决 适合于解决分析与设计期间的复杂性 实现分析与设计的复用 在软件生命周期采用一种全新的方法 ——《软件工程百科全书》 面向对象方法 对象：属性 + 服务 （独立的系统单位） 尽可能隐蔽对象的内部细节 面向过程与面向对象的区别 面向对象的软件设计 1. 面向对象的的设计方法 设计特点： 抽象性 信息隐藏性 功能独立性 模块化 设计步骤： 识别对象 确定属性 定义操作 确定对象之间的通信 完成对象定义 1 识别对象—例子 家庭安全系统－－潜在的对象 房主 传感器 安全系统 控制板 监控服务 ………. 1 识别对象 对系统进行描述 对描述进行语法分析 找出名词或者名词短语 根据这些名词或者名词短语确定对象 对象可以是 关键抽象 关键抽象 2 确定属性 找出对象的一组有意义的属性 研究系统描述，选择与对象相关联的信息 例：“家庭安全系统” 的属性 传感器信息＝传感器类型+传感器编号+警报临界值 报警响应信息=延迟时间+电话号码+警报类型 起动/撤销信息=主口令+允许尝试的次数+暂时口令 标识信息=系统表示号+验证电话号码+系统状态 3 定义操作 研究系统的需求描述 进行语法分析，隔离出动词 选择与对象相联关的动词（操作） 选择属于对象的操作（方法） 例： “家庭安全系统” “传感器被赋予一个编号和类型” “设置一个主口令使系统处于警报状态或警报解除状态”。 4 确定对象之间的通信 仅定义对象不够 对象之间必须建立一种通信机制，即消息 作用： 要求一个对象执行某个操作 就要向它发送一个消息 告诉对象做什么 完成对象定义 面向对象的软件设计 面向对象的软件设计 2.系统行为−图书管理系统的用例图 （1）用例、参与者以及场景 （2）用例和参与者关系以及用例之间的关系 关联关系 面向对象的软件设计 2.系统行为−图书管理系统的用例图 （1）用例、参与者以及场景 （2）用例和参与者关系以及用例之间的关系 包含关系 一个用例包含另一个用例的行为 面向对象的软件设计 2.系统行为−图书管理系统的用例图 （1）用例、参与者以及场景 （2）用例和参与者关系以及用例之间的关系 扩展关系 基础用例的增量扩展 面向对象的软件设计 2.系统行为−图书管理系统的用例图 （1）用例、参与者以及场景 （2）用例和参与者关系以及用例之间的关系 泛化关系 子用例是父用例的特例 图书管理系统的用例图 图书管理系统的用例图 图书管理系统的用例图 面向对象的软件设计 3. 对象交互−图书管理系统的交互图 （1）顺序图的基本构成 面向对象的软件设计 3. 对象交互−图书管理系统的交互图 （1）顺序图的基本构成 （2）如何开发顺序图 确定所有与场景有关的对象和参与者 确定完成场景的消息 将消息排序，放在合适的参与者和对象上， 标示对象生命线 图书馆管理系统中的顺序图 图书馆管理系统中的顺序图 图书馆管理系统中的协作图 图书馆管理系统中的协作图 图书馆管理系统中的协作图 图书馆管理系统中的协作图 面向对象的软件设计 4.对象行为−图书管理系统的状态图 （1）对象状态和状态转换 面向对象的软件设计 4.对象行为−图书管理系统的状态图 （2）如何开发状态图 选择状态复杂的关键类 辨识类的所有状态 从初始状态开始，按转换顺序联接状态，到终止状态 标示转换消息 图书馆管理系统的状态图 图书馆管理系统的状态图 小结 项目六　软件项目详细设计 三层构架 项目六 软件项目详细设计 1.系统详细设计的基本内容 2.图书管理系统的详细设计 3. 用户界面设计 软件项目详细设计 1.系统详细设计的基本内容 详细设计概述 详细设计的基本任务 详细设计方法 系统详细设计的基本内容 1.详细设计概述 详细设计 又称程序设计 设计数据结构 设计算法 自然语言描述 系统详细设计的基本内容 1.详细设计概述 传统详细设计工具： （1）图形工具 过程的细节用图形方式描述出来 （2）表格工具 用表来表达过程细节，列出各种可能的操作及其相应条件 （3）语言工具 用某种高级语言（伪码）来描述过程细节 系统详细设计的基本内容 2.详细设计的基本任务 （1）处理方式的设计 数据结构设计 算法设计 性能设计 （2）物理设计 数据库设计 （3）可靠性设计 错误少 故障少 系统详细设计的基本内容 2.详细设计的基本任务 （4）其他设计 代码设计 输入/输出格式设计 人机对话设计 （5）编写详细设计说明书 引言 程序设计结构 程序1 。。。 （6）详细设计的评审 坐而论 对事不对人 系统详细设计的基本内容 3.详细设计方法 （1）传统的详细设计方法 图形符号的设计方式 表格的设计方式 程序设计语言 系统详细设计的基本内容 1.详细设计概述 （1）图形工具 系统详细设计的基本内容 1.详细设计概述 （1）图形工具 系统详细设计的基本内容 1.详细设计概述 （2）表格工具 例：三角形应用系统决策表 系统详细设计的基本内容 1.详细设计概述 （3）语言工具（伪代码） 伪码是混合语言，形式语言的控制结构和自然语言描述 例：描述打印N！的流程： 面向对象详细设计 详细设计软件类或接口 按架构模式设计边界类、控制类和实体类； 设计数据库接口（面向对象到数据库转换ORM） 面向对象详细设计 包的设计 包是一种逻辑分组的概念； 相关成分聚在一起，构成更高层的组织单元； 常用将类以包为单位进行分组； 如：同一层的所有类组成一个包； 一个包可以包含其他的包。 面向对象详细设计 分包的原则 共同封闭原则： 将一组职责相似、不同实现的类归为一个包 例如： 交互界面的类放在界面包 业务逻辑的类放在业务逻辑包 共同复用原则： 一个包中的各个类应该一起被复用 复用其中一个类可能需考虑同一个包中的其他类 设计包图 设计包图 描述包及其依赖关系； 标识一个完整系统的主要部分； 两个符号： 包的标识符 虚线箭头 包的依赖关系 包依赖关系可以是直接的，也可以间接的，依赖关系可以传递; 通过包图，可估算包中类的复杂度， 可估算重用一个包的难易程度。 三层构架包 软件类的设计 基本概念 设计属性 设计方法 设计关系 软件类的设计 软件类 又称设计类 （对应的分析阶段的类称为概念类或领域类） 分析中的类 是现实事物或概念的抽象 要转换为软件世界中的类 计算机领域的软件对象的类 计算机领域的对象的类 软件类的设计 边界类 系统与其参与者的交互 包括接收来自用户和外部系统的信息与请求 将信息与请求提交给用户和外部系统 封装用户界面或通信接口 接收用户的触发事件 通过界面中的图形元素进行响应 软件类的设计 边界类 例：码单创建界面 实体类的设计 实体类 来源于领域模型中的类 对应于领域模型中的领域类 控制类的设计 控制类 用于封装与某个具体用例有关的控制流； 还用于表示复杂的派生与演算； 根据分层原则，只对 控制、 协调、 排序、 事务处理、 复杂业务逻辑 进行封装 。 控制类 例：入库控制类 设计类的属性 设计属性的类型和初值： 属性的类型 默认的初始值 设计属性的可见性： 公有的（public）—“+” 受保护的（protected）——“#” 私有的（private）——“-” 完整的属性定义： 可见性 属性名：类型 ＝ 初始值 设计操作（方法） 设计操作（方法） 设计类的操作（方法）重要 分析中勾画了对象行为的轮廓 设计阶段对这些行为进行细化 结合用例和交互图来定义类（对象）的方法 消息和方法 消息和方法 职责通过消息发送分配给对象 消息发送者需要某项服务 消息接收者要提供相应的服务 最终转化为接收者的方法 接收对象会产生结果回传给发送者（返回消息） 例：类的操作 定义操作（方法） 定义方法 和属性一样，类的方法可以定义可见性； 方法按如下格式进行标识： 可见性 方法名（方法参数列表）：类型表达式 设计类的关系 设计关系 类的关系： 依赖关系 泛化关系 关联关系 设计依赖关系 作为类的方法的参数； 类的关系 设计泛化关系 一般在面向对象语言中使用继承来实现泛化关系，继承机制实现了子类拥有父类特性的这一过程。 类的关系 设计关联关系 在关联的源类中声明一个实例属性来保存对目标类的实例的引用 系统详细设计的基本内容 （2）面向对象的详细设计 算法和数据结构的设计 数据结构的设计与算法是同时进行 对数据的维护操作（如增、删、改、查） 对数据进行计算 监控对象事件 模块和接口 系统详细设计的基本内容 （2）面向对象的详细设计 算法和数据结构的设计 模块和接口 软件项目详细设计 2.图书管理系统的详细设计 系统包图 类的类型以及类之间的关系 图书馆管理系统的类图 设计类图的开发 图书管理系统的详细设计 1.系统包图 图书管理系统的详细设计 2.类的类型以及类之间的关系 （1）类的类型 实体类(Model) 边界类(View) 控制类(Controller) （2）类之间的关系 关联 聚合 泛化 依赖 图书管理系统的详细设计 3.图书馆管理系统的类图 图书管理系统的详细设计 4. 设计类图 （1）决定需要设计的类 读者编号 读者姓名 读者性别 读者电子 读者类别 （2）找到属于类的所有方法 图书管理系统的详细设计 4. 设计类图 （1）决定需要设计的类 （2）找到属于类的所有方法 （3）描述带有逻辑的方法 描述方法 图形 表格 伪码 软件项目详细设计 3. 用户界面设计 用户界面设计应具有的特点 用户界面设计的类型和原则 图书馆管理系统的界面设计 用户界面设计 1.用户界面设计应具有的特点 （1）可(使)用性 使用的简单性 用户界面中的术语标准化和一致性 拥有HTML帮助功能 快速系统响应和低系统成本 具有容错能力、错误诊断功能 （2）灵活性 界面(算法)的可隐可显性 用户可制定和修改界面形式 提供不同详细程度的系统响应信息 应有标准的界面 （3）复杂性与可靠性 用户界面的规模和组织的复杂程度就是界面的复杂性 用户界面的可靠性是指无故障使用的间隔时间 用户界面设计 2.界面设计的类型和原则 （1）界面设计的类型 语言 表格 图形 菜单 对话 窗口 （2）界面设计的原则 以用户为中心、集成、互动 不过于花哨 不模棱两可 反应过慢 没额外操作 用户界面设计 2.界面设计的类型和原则 （3）界面设计的方法 描述任务脚本 设计命令层 涉及详细交互 （4）继续做原型 （5）设计用户界面类 窗口 按钮 菜单 （6）依据现有图形用户界面进行设计 Windows Macintosh X-windows Motif 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 界面设计--图书馆管理系统的界面设计 小结 项目七　软件项目实现 项目七 软件项目实现 结构化程序设计 面向对象程序设计 程序设计语言 程序复杂度 面向对象的依赖关系 类的关系 设计关联关系 源类中有一个实例属性，是对关联类的实例的引用 类的关系 设计关联关系 源类中有一个实例属性，是对关联类的实例的引用 面向对象程序设计 1．抽象 （1）过程抽象 （面向过程） 面向过程的设计 （2）数据抽象 （面向对象） 类型＝数据+操作 面向对象程序设计 2．封装 类里面封装了相关的数据和操作 数据被保护在抽象数据类型的内部 只有通过封装在数据外部的被授权的操作 优点： 类之间的耦合和交叉大大减少 降低了开发过程的复杂性 减少了可能的错误 保证数据的完整性和安全性 面向对象程序设计 继承 使用现有类的功能 可对这些功能进行扩展 继承方式 实现继承－－复用代码 接口继承－－定义操作 面向对象程序设计 多态性 不同对象对同一操作采用不同的行为 例：有人大叫“Cut” 面向对象设计原则 单一职责原则 一个类应该仅有一个引起它变化的原因 一个类的功能要单一，只做与它相关的事情。 面向对象设计原则 开放—封闭原则 软件是可以扩展的，但不可以修改 “变化才是不变的真理”， 使系统能在保持相对稳定下，适应改变 程序设计语言排行榜 程序设计语言 1．第一代语言(机器语言) 2．第二代语言(汇编语言) 3．第三代语言(高级语言)——Java, C#, Ruby, Python 4．第四代语言(简称 4GL) 非过程化语言， 只需说明“做什么”，不需描述“怎么做” 例：数据库查询SQL 程序设计语言 从层次上看语言 语言适合做什么？ 不要用阳江小刀砍大树 不要用威猛电锯削水果 程序设计语言 程序设计语言 操作系统 软件开发经典 第一名：1333票《代码大全（第二版）》,两届Software Jolt Award震撼大奖得主！(Java, C, C++) 第二名：1181票 《程序员修炼之道》(软工) 第三名：701票 《计算机程序的构造和解释》(LISP) 第四名：572票 《C程序设计语言》(Ｃ) 第五名：481票 《算法导论》(伪码) 第六名：478票 《重构：改善既有代码的设计》(Java) 第七名：447票 《人月神话》(软工) 第八名：440票 《设计模式》(Ｃ++, Smalltalk) 第九名：394票 《计算机程序设计艺术（第一卷）》 第十名：364票 《编译原理》 程序设计语言 我的选择： Java（移动应用Android） ruby（Web应用/一般任务） C/C++（性能优化/没招了） 程序复杂度 程序： fact = 1; for i=1 to n do fact = fact * i; 分析： 一次乘法为一个基本操作 忽略i改变的时间 共f(n) = n次基本操作 程序复杂度 程序： sum = 0; for i=1 to n do for j=1 to n do sum = sum + a[i,j]; 分析： 基本操作：加法 忽略循环变量i和j的改变时间 共n2次基本操作 小结 结构化程序实现 数据流 过程(函数) 面向对象程序实现 数据抽象 封装 多态 选择适合项目的编程语言 程序复杂度按循环的次数估算 项目八　软件测试 项目八 软件测试 软件测试基础 软件测试方法 测试驱动开发（ＴＤＤ） 软件测试报告 我的烂鞋被拿去做胶囊了么？ 软件的可靠吗？ 微软的软件：3～6 个/每千行 注：Vista系统含5500万行代码 XP系统含4500万行代码 已闲置不用的Wind 98仍有很多错误代码 什么是软件缺陷？ 未达到产品说明书中已经标明的功能； 出现了产品说明书中指明不会出现的错误； 未达到产品说明书中虽未指出但应当达到的目标； 功能超出了产品说明书中指出的范围； 难以理解、不易使用，或用户认为使用效果不良。 软件缺陷严重性的级别 软件缺陷的产生★需求解释有误★需求定义有误★需求记录有误★设计说明有误★编码说明有误★程序代码有误★其他如数据输入有误等 修复缺陷的成本 软件测试 需求分析说明书概要设计说明书详细设计说明书源代码 ★软件测试不仅仅是对程序的测试，而是贯穿于软件定义和开发的整个过程 测试类型 单元测试 集成测试 系统测试 验收测试 单元测试 也称模块测试， 测试的对象是软件的程序模块(类)， 如模块(类)及其操作 目的是检测程序模块中的错误故障： 模块(类)接口 模块(类)局部数据结构 覆盖测试 出错处理 边界条件 集 成 测 试 从单元到整个系统要经历多次集成， 每次都要进行相应的集成测试。 开始集成时规模较小，以白盒测试为主。 随集成规模的壮大，要以黑盒测试为主。 系 统 测 试 针对系统进行的综合测试， 目标不是找的缺陷，而是证明功能/性能要求 包括： 功能测试、 性能测试、 用户界面测试、 安全性测试、 压力测试、 可靠性测试、 安装/卸载测试等。 验收测试 产品交付用户之前进行的最后一次质量检验活动 产品是否符合预期要求，用户是否接受 明确验收测试通过的标准； 确定验收计划和方式； 确定测试结果的分析方法； 设计验收测试的用例； 执行测试，分析结果，决定是否通过验收。 软件测试的关键问题1. 测试由谁执行？2. 测试什么？3. 什么时候进行测试？4. 怎样进行测试？ 如何进行软件测试？ 软件测试的信息流 软件测试的原则 尽早地和不断地进行软件测试 测试用例由： 测试输入数据 对应的预期输出组成 程序员应避免检查自己的程序（错误） 应：程序最后要由测试人员测试通过 应包括合理的输入条件和不合理的输入条件 软件测试的原则 充分注意测试中的群集现象。 执行测试计划，排除测试的随意性。 应当对每一个测试结果做全面检查 需要： 测试计划、 测试用例、 出错统计、 最终分析报告 软件测试方法 软件测试报告 测试阶段最后的文档产出物 测试经理应具备良好的文档编写能力 报告包括产品质量和测试过程的评价 报告基于测试中的数据采集以及对最终的测试结果分析 什么是单元测试？ 为什么做单元测试？ 你的代码真的工作吗？ 测试驱动开发 现实中的设计和开发 程序员心中的测试 测试驱动开发的优势 测试驱动开发的步骤(1) 测试驱动开发的步骤(2) 测试驱动开发的步骤(3) 测试驱动开发的步骤(4) 测试驱动开发和传统软件过程的不同 谁来写单元测试 什么时候写单元测试？ 单元测试的工具 测试驱动开发举例(1) 测试驱动开发举例(2) 测试驱动开发举例(3) 测试驱动开发举例(4) 测试驱动开发举例(5) 测试驱动开发举例(6) 测试驱动开发举例(7) 测试套件(Test Suite)的结构 测试套件(Test Suite)举例 每晚构建与测试 利用Ant来做每晚测试 单元测试覆盖率 单元测试：总是100%通过 小结 软件测试 程序错误 测试类型 测试方法 测试驱动开发 单元测试 测试驱动方法 每晚构建 项目九 　软件维护 项目九 软件维护 软件维护的类型 软件维护的成本 软件维护的方法 软件维护 软件系统交付使用以后， 为了改正错误 或满足新的需求而修改软件的过程。 维护的原因： （1）改正程序中的错误和缺陷 （2）改进设计以适应新的软、硬件环境 （3）增加新的应用范围 软件维护的类型 各类软件维护的比例 软件维护成本 软件维护工作量的模型 M是维护中消耗的总工作量 p是生产性工作量 K是一个经验常数 c是因缺乏好的设计和文档而导致复杂性的度量 d是对软件熟悉程度的度量。 系统大小 程序设计语言 系统年龄 数据库技术的应用 结构化的软件开发技术 软件维护活动 软件维护工作 修改软件需求说明 修改软件设计 设计评审 对源程序做必要的修改 单元测试 集成测试( 回归测试) 确认测试 软件配置评审等 软件维护问题总结 在每次软件维护任务完成后进行评审，做总结：(1) 设计、编码、测试中的哪一方面可以改进?(2) 哪些维护资源应该有但没有?(3) 工作中主要的或次要的障碍是什么?(4) 是否应当有预防性维护? 软件维护记录 软件可维护性 指纠正软件系统出现的错误和缺陷， 以及为满足新的要求 进行修改、扩充或压缩的容易程度。 是软件开发阶段各个时期的关键目标。 影响可维护性的因素 维护量化的度量 可维护性 在各类维护中的侧重点 提高可维护性的方法 建立明确的软件质量目标和优先级 使用提高软件质量的技术和工具 进行明确的质量保证审查 选择可维护的程序设计语言 改进程序的文档 软件开发期间各个检查点的检查重点 检查是否符合标准，是否满足规定的质量需求。 在不同的检查点，检查的重点不完全相同。 周期性地维护审查 对已有的软件系统，应当进行周期性的维护检查 软件修改，会导致软件质量下降，破坏程序概念的完整性 必须定期检查，做维护审查，以跟踪软件质量的变化 审查的结果同以前的结果比较，看在软件质量所起的变化 对于改变的原因应当进行分析 对软件包进行检查 软件包是标准化的，可为不同系统使用的软件 源代码和程序文档可提供或不提供给用户 维护人员要分析、研究： 用户手册、 操作手册、 培训教程、 验收测试报告等。 机器语言 汇编语言 高级语言 查询语言 报表生成语言 图像语言 应用生成语言 逆向工程 一、软件的逆向工程定义 分析已有的程序，寻求比源代码更高级的抽象表现形式。 二、相关概念： * 重构：转换系统描述； * 设计恢复：抽象出有关数据设计、总体设计等信息； * 再生工程：产生新版本； 重构例子（提取方法） Struts组件 Struts组件 Struts组件 Struts组件 Spring容器 Spring的IOC(控制反转) Hibernate体系结构 Hibernate体系结构 项目十 　软件项目管理 项目十 软件项目管理 工作范围 进度计划 风险管理 人力资源 质量管理 软件项目管理的特点 软件项目管理 软件项目管理是指在软件开发过程中对项目的 成本、 人员、 进度、 风险、 质量 进行详细分析和控制的管理活动 风险管理－项目风险 实际案例： 在需求分析过程中，老王带领的需求分析小组和用户在进行交流的过程中发生了矛盾，出现了争吵，用户方说将不再配合需求分析小组的工作，而且他们确实没有配合开发方的工作 风险管理－风险来源 风险来源： 1．需求风险 2．计划编制风险 3．组织和管理风险 4．人员风险 5．开发环境风险 6．客户风险 7．产品风险 8．设计和实现风险 9．过程风险 风险管理－风险识别 根据风险的内容，风险分为： 1．产品规模风险 2．商业影响风险 3．客户特性风险 4．过程定义风 5．开发环境风险 6．技术风险 7．人员数目及经验带来的风险 风险管理的组成 风险评估 风险危险度 = 风险概率 × 风险损失 风险控制 风险监控 敏捷宣言 个体和交互 胜过 过程和工具 可以工作的软件 胜过 面面俱到的文档 客户合作 胜过 合同谈判 响应变化 胜过 遵循计划 敏捷规则 最高目标是能持续地、及早地向客户交付软件； 拥抱变化； 频繁地发布可运行的软件； 客户和开发人员在一起工作； 以人为本； 最重要的衡量开发过程的手段，是可工作的软件； 稳定的开发速度； 敏捷高效的设计； 简单有效； 重视Teamwork； 积极的调整 XP实践洋葱图 SCRUM的过程图 组建敏捷项目团队 敏捷项目团队由三种角色组成 1、Product Owner—由系统分析人员担任。负责收集和描述待开发产品的信息，并转换成待开发列表。解释和描述每一项任务的要求,项目开发过程中关注每个Story是否实现，解释其要求细节。 2、开发团队成员－由来自开发、测试、资料共同组成的多功能团队，负责构建产品。 3、Scrum Master－由熟悉敏捷的成员，负责帮助和指导团队按照敏捷方式操作。 除此之外，还有一个项目经理，负责整个团队的管理。 项目启动－搭建项目环境 搭建持续集成环境 敏捷项目需要维护一套唯一的持续集成环境，能够实现自动的从配置库获取代码、编译、静态检查和测试。 持续集成环境搭建，可采用ICP持续集成系统，联系软件工程部进行技术支持。 持续集成至少做到每天固定执行一次，也可根据配置库代码变化触发执行。 搭建开发环境 包含项目的编译等环境的配置等 搭建测试环境 尤其是自动化测试的环境，能够为持续集成系统调用执行 项目启动－准备及制订Product Backlog Product Owner分析待开发需求任务列表，形成产品Product Backlog，并按照商业价值排序。 Product Backlog是产品唯一的待开发任务列表（如示例），是对开发任务的初步简要描述，并附带工作量的初步估计。Backlog既可以包含新增需求、功能，也可以包含待解决的问题等（有点类似传统的AR列表） Product Backlog随项目进行，根据外部环境的变化，可能会不断调整，但是已经在迭代内实施的任务项将不受影响。 Product Backlog通常使用User Story形式分析描述。 用户故事 User Story User Story- User Story是站在外部的用户角度来描述系统所具有的功能/特性，并且此功能/特性能为客户感知。 User和Story的识别： 用户Users-使用到待开发系统的任何角色（包含人、也包含其他软件或程序），一般可以采用头脑风暴形式识别所有的Users. Story识别及描述： As a <Role>,I want <function>,so that<reason> 做为一个<XXX角色>,我希望<YYY功能>，以便<解决什么问题/原因> User Story通常是最小的用户感知粒度。 注意： 1、项目所有成员都可参与分析制作User Story（含开发、测试人员,资料人员也从使用资料的对象分析，形成资料User Story)，这时候并不需要太多的系统实现内部细节。 2、User Story分析结果记录在《User Story模板》中，虽然敏捷可以记录在白板、卡片等形式上，但在公司内部实施的特定环境下，用文档记录还是比较好的。 划分迭代和开工会议 敏捷计划和开工会议包含： 1、Product Owner向开发团队介绍待开发任务Product Backlog,讨论各项需求任务的目标和背景，提供所有成员深入理解需求的机会。 2、开发团队集体从Product Backlog根据优先级，选择任务，初步划分迭代，设定迭代周期（迭代周期通常是固定周期，比如1-4周都是常见的迭代周期）。划分迭代时，通常从Backlog的优先级开始，结合需要的工作量进行划分。 3、完成迭代划分后，启动第一次迭代的分析工作,分解成任务，形成本迭代的Sprint Backlog. Backlog列举任务的大小不同，可能分解为一到多个任务项Task.各Task也可以用User Story形式进行描述。这时候会涉及到部分的实现细节。 敏捷中的迭代实施过程 敏捷项目中程序员的一天 每日晨会（站立式会议） 15分钟的站立式会议，通常在早上进行。 每个成员介绍三个事情： 从上次会议结束后，完成了哪些工作？ 到下次会议前，将准备完成哪些工作？ 工作中还存在哪些障碍？ Product Owner和所有项目成员必须参与会议。 每日晨会后，项目经理负责更新每项任务的进展情况。 迭代评估和回顾会议 在每次迭代结束时，进行迭代评估，团队展示他们所构造出的产品。 参加人员：所有项目成员，以及项目的客户。 不需要准备PPT胶片材料，只需要如实的展示工作进展即可。 同时回顾当前做得好的和不足的，以便在下一个迭代中改进。 通常，迭代评估紧接召开下一个迭代的计划会议。 测试如何参与敏捷项目

All-In-One Toolbox Pro 8.1.5.5.8.apk

多功能一体工具箱清洁剂 All-In-One Toolbox提供了数十种最佳系统工具，可以清理，增强，管理和保护您的Android。它有助于清理垃圾文件，释放存储空间，优化内存使用，提高手机速度，冷却手机，管理文件，处理应用程序，检测广告，检查权限，读取设备信息，进行快速设置等。多功能一体机工具箱让您的手机或平板电脑更加干净，快速，智能，功能强大。 突出特点： -Boost内存/ RAM 有效释放和优化内存/ RAM存储，以加快任何慢速手机/平板电脑。一键即可杀死并关闭最耗电的内存，快速耗尽电池耗尽的运行过程。修复系统错误，如低内存警告，滞后或冻结。 -Clean Cache / Junk 一键扫描并删除所有垃圾文件，完全准确地刷垃圾。批量清理应用程序缓存，无用的临时文件，不需要的apk包，空文件夹，剩余文件和应用程序遗留... -CPU Cooler Detect手机温度，关闭CPU占用最多的运行过程，防止设备过热，降温。 - 文件管理器 轻松处理存储在外部SD卡上的所有文件/文件夹：浏览，复制，粘贴，移动，删除，搜索，压缩，解压缩，创建新的，共享，排序，创建快捷方式，多选，检测大文件... -App Manager *将内部存储应用程序移动到外部SD卡，为您节省大量可用空间。 *批量安装/卸载应用程序; 备份和恢复apk文件（notapp数据），自定义启动应用程序，禁用启动应用程序 *具有超级权限授权的root用户可以自定义启动系统应用程序，执行静默批量操作，删除预安装的膨胀软件。 -App Locker 加密您不想共享的应用程序以锁定隐私，保护隐私免受窥探。 -Protect Privacy 强大的跟踪橡皮擦可删除敏感的个人信息，如短信和通话记录，浏览器历史记录，剪贴板数据，保存的密码泄露，增加安全性和保护隐私免受间谍活动。 - 阅读设备信息 列表手机存储; 一个地方的CPU，电池，屏幕，网络，根状态和硬件信息方便。 -Customize Tools 12实用插件可以按如下方式下载，为手机添加更多功能并增强整体移动体验。 *广告检测器：分析应用广告类型和来源，广告软件阻止 *权限检查：检测其他应用所需的权限 *自动任务：自动设置缓存和垃圾清理，静音模式，飞机模式或Wi-Fi管理 *游戏助推器：提升游戏为玩家提供更快的速度 *传感器盒：显示Android *快速设置上的所有可用传感器：快速访问系统设置 *音量设置，QR和条形码扫描仪，手电筒，指南针...... - 为什么多功能一体机工具箱是您必备的工具应用程序？ ♥功能强大：如此多的有用工具，如此紧凑的尺寸，增加了多功能性和实用性 ♥简单易用：直观，清晰的用户界面，易于使用和轻松 ♥有效：深度清洗许多垃圾和内存，以延长电池寿命，提高速度 ♥ 值得信赖：高游戏商店的评级，受到来自230个国家的数百万人的信任

DeadAscend：一种用QtQML和Javascript编写的二维点赞式冒险游戏-源码

死亡登高 以Qt / QML和Javascript编写的手绘开放源代码，指向类似单击的2D冒险游戏。 “成群的僵尸将您追到旧的无线电塔。您唯一的机会是登上这座无线电塔-解决了通往救援之路的一系列难题。” 快速开始 正在提供预构建，基于广告，移动和平板电脑的版本。 通过播放上述预构建版本，可以支持我的（独立）游戏作品。 现在也可以针对预构建。 DIY大厦 您可以从命令行或 （通常与捆绑在一起）中构建游戏。 它可以通过各种方式下载和安装，因此请参阅Qt主页和有关如何获取Qt Creator的文档。 完成Qt / Qt Creator的完整设置后，您就可以准备签出并构建“ Dead Asce

Futemax-crx插件

语言:português (Brasil) futemax足球活是最好的应用程序，所有年龄段都可以享受。 futemax足球活动是所有年龄段人们可以享受的最佳应用程序。此外，Futemax TV APK是足球恋人的一个很好的平台，因为他们可以在其Android设备上享受Live HD游戏。一个简单的界面和导航，便于所有的后续行动。那些寻找免费娱乐的人肯定应该选择电视futemax。移动设备仅限于游戏，它们是使用视频流应用娱乐的最佳方式。您可以免费娱乐移动设备的许多应用程序。如果您喜欢运动，但没有时间观看电视或笔记本电脑，可以在您的设备上安装“Futemax TV APK”。它是作为足球恋人专业的最佳体育应用之一。什么是Futemax足球直播电视APK？Futemax现场足球电视APK是与手机，平板电视兼容的运动应用之一。用户需要稳定的互联网连接，随时随地享受游戏活动。足球粉丝可以在Futemax电视应用程序中享受在设备上的高清上的现场足球比赛。用户无需选择匹配以注册或登录应用程序。用户可以随时在其设备上以高清质量同步现场足球比赛。因此，如果您是那些死的人之一，足球迷真的需要在您的设

牛叉内容管理系统(NiuXcms) v1.07.rar

牛叉内容管理系统【程序特点】 1. 专为搜索引擎优化设计！ 2. 专为网站广告收益优化设计！内含牛叉广告管理优化大师(NiuXams)插件模块。 3. 全部直接生成真静态文件，同时满足搜索引擎优化、网站最小负载。即使php或mysql崩溃也不影响网页访问。赞！ 4. 超高的智能水平，只需超级简单的设置和操作，控制面板菜单不超过10个。 5. 全开放式模块设计，高度可扩展性，插件/模块即插即用。 6. 强大模板功能，助你轻松实现文字、图片、视频、音乐、下载、专题等等多种类型内容。 7. 整合最流行先进技术模块/插件，智能水平高，功能强大，操作简单。 8. 编码自动转换，utf8、gbk、big5等编码的网站都可无缝使用。 9. 所有操作、功能、设置内含说明，鼠标停留即可查看帮助、指引、样例参考。 10.在线升级指纹校验让你及时和官方程序同步安全无忧。 11.全开放式主题皮肤设计，随时随地更换你喜欢的主题风格，自制主题皮肤即插即用。 12.使用简单！所有使用者的感觉，但功能却强大！ 13.功能强大，操作最简单。轻松创建您的标准版网站和触摸屏手机移动版网站！   一、平台需求 1.php5.2 和 mysql5.0 2.PHP必须环境或启用的系统函数： allow_url_fopen GD扩展库 MySQL扩展库 系统函数 —— phpinfo、dir 3.基本目录结构 /niuxcms        默认后台管理目录（可任意改名）[必须可写入]  4.后台访问 推荐IE8 ，Chrome，Firefox等较新版的浏览器。   二、程序安装 1.下载程序解压到本地目录 2.上传程序所有目录、文件到网站根目录 3.运行http://www.yourname.com/niuxcms/install.php(yourname表示你的域名),按照安装提示说明进行程序安装   三、程序首次使用 1.运行http://www.yourname.com/niuxcms/登录后台控制面板查看基本参数是否需要修改 2.新建栏目/频道 3.设置栏目默认文章模板和栏目模板！（使用通用模板或稍微改动或自己全新设计模板） 4.发布文章，审核文章（俩步骤可一起或分开） 5.新建自定义列表，推荐文章到网站任何页面（是不是超级简单？）    【1.07版升级日志】 1. 增加了广告管理，广告策略管理，广告位管理可通过gid搜索功能。 2. 修正广告代码以使广告位代码的div容器class可以增加其他类名而不会出错。 3. 优化搜索功能，更安全并能够多个关键词搜索。搜索模板也做相应改动。   【1.06版升级日志】 1. 推荐文章功能改进：方便推荐到多个自定义文章列表。 2. 推荐文章功能改进：自动转码功能增强，过滤掉特殊字符。 3. 更改所有样板模板的默认主题为start。 4. 安装增加浏览器版本判断，低于IE8提示更换浏览器。后台登陆浏览器版本推荐IE8 ，Chrome，Firefox等等。    【1.05版升级日志】 1. 第三方js库jquery升级到最新的1.11.0。 2. 首页样板也可自动跳转安装界面。 3. 修改界面可适应1024像素屏幕。 4. 修改通用文章样板模板实现编辑器设置背景可体现在文章页面的功能。 5. 原上传图片最大允许的边长900像素，超过会自动等比缩放,修改为不缩放。 6. 编辑器 撤销 次数增加到200次。 7. 编辑器 自动排版 可自动保存个人偏好。 8. 添加/修改文章界面增加“关键词搜索相关文章列表”插入文章功能。 9. 增加通用文章专题样板模板。配合文章内容专题模板，轻松制作专题。   【1.04版升级日志】 1. 优化函数代码以正确识别新的WIN8.1、IE11等新系统、新浏览器。 2. 第三方模块升级。解决ie8下插入多张远程图片之后,dialog假死。 3. 增加标准版首页和移动版首页样板供依葫芦画瓢。   【1.03版升级日志】 1. 增加了通用智能设备文章/栏目样板模板。轻松建立标准网站和移动网站。 2. 增加了智能设备样板广告。 3. 优化部分代码适应移动网站的建立。   【1.02版升级日志】 1. 第三方js插件升级。 2. 第三方移动框架升级，结合niuxcms模板引擎，可以让你轻松设计一个能在所有流行的智能手机，平板电脑和桌面平台上工作的、高度品牌响应的移动Web站点。   【1.01版升级日志】 1. NiuXams插件模块新增“广告模板”功能。广告模板管理，添加广告可以从广告模板里选择。 2. 优化了部分代码，提高了某些特殊服务器环境程序的速度。

解决timer循环引用的问题

iOS中的timer的循环引用问题，对timer进行了一次封装

工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究 研究生姓名： 唐帅 导师姓名： 罗军舟 教授 苏生 教授 申请学位类别 工 程 硕 士 学位授予单位 东 南 大 学 工程领域名称 软 件 工 程 论文答辩日期 研究方向 Android+HTML5 学位授予日期 答辩委员会主席 评阅人 硕士学位论文 基于Android+HTML5的移动Web项目 高效开发探究 专业名称： 软件工程 研究生姓名： 唐帅 导师姓名： 罗军舟 校外导师： 苏生 THE RESEARCH OF EFFICIENT DEVELOPMENT OF MOBILE WEB PROJECTS BASED ON ANDROID AND HTML5 A Thesis Submitted to SoutheastUniversity For the Academic Degree of Master of Engineering BY Tang Shuai Supervised by Luo Junzhou and Su Sheng College of Software Engineering SoutheastUniversity February 2017 东南大学学位论文 独创性声明 本人声明所呈交的学位论文是我个人在导师指导下进行的研究工作及取得的研究成果。尽我所知，除了文中特别加以标注和致谢的地方外，论文中不包含其他人已经发表或撰写过的研究成果，也不包含为获得东南大学或其它教育机构的学位或证书而使用过的材料。与我一同工作的同志对本研究所做的任何贡献均已在论文中作了明确的说明并表示了谢意。 研究生签名： 日期： 东南大学学位论文使用 授权声明 东南大学、中国科学技术信息研究所、国家图书馆有权保留本人所送交学位论文的复印件和电子文档，可以采用影印、缩印或其他复制手段保存论文。本人电子文档的内容和纸质论文的内容相一致。除在保密期内的保密论文和在技术保护期限内的论文外，允许论文被查阅和借阅，可以公布（包括以电子信息形式刊登）论文的全部内容或中、英文摘要等部分内容。论文的公布（包括以电子信息形式刊登）授权东南大学研究生院办理。 研究生签名： 导师签名： 日期： 摘要 目前工业市场上认证检测领域，业务流程陈旧繁琐，用户与检测机构无法便捷有效的沟通。除此之外，用户需要亲临检测机构实地送检，在检测的每一个环节用户也无法有效的进行追踪，这些都制约着认证检测领域的进一步发展。鉴于市场上用户的手机型号、种类、屏幕分辨率等参差不齐，传统方式根据主流系统分别开发相应的系统耗时又耗力，为了高效开发并节约开发项目成本，本文采用Android+HTML5相结合的方式进行移动端Web系统的设计研发工作。 然而，由于HTML5的W3C标准规范还未制定，安卓系统中类浏览器Webview自身存在一些局限性，因此仍存在着诸多问题亟需解决，包括：（1）多窗口类浏览器模式问题。安卓上用于加载的Webview视图窗口只是作为类浏览器而存在，在安卓上更是只能同时运行一个Webview。（2）跨域数据交互问题。不同的Webview之间无法共享数据。（3）页面自适应问题。页面难以兼容适应不同分辨率的设备和浏览器。 本文研究并设计了基于Android+HTML5的在线认证检测系统，主要工作包括以下四个方面： （1）针对多窗口类浏览器模式问题，指出并分析了该问题存在的原因，利用Activity的运行机制，通过Fragment栈对主要模块的Webview进行管理，实现对不同模块之间切换的控制。 （2）针对跨域数据交互问题，指出并分析了跨域缓存交互问题出现的原因，通过在HTML5存储技术的基础上，重写LocalStorage，用移动端本地的Sqlite进行数据维护，实现跨域数据交互。 （3）针对页面自适应问题，本文结合渐进增强以及拥抱流式布局的思想，同时研究利用了移动设备的视口特性，实现跨分辨率、跨设备的页面自适应。 （4）针对系统的功能实现问题，通过结合利用原生态框架与HTML5的跨平台性，实现了“认我测”在线认证检测系统。 综上所述，“认我测”在线认证检测系统，率先填补了认证检测领域移动端的空缺，提供了Web浏览器+移动端的双端访问模式，给用户提供了多种访问途径，真正实现了用户和检测机构的随时随地在线下单检测。 关键词：HTML5，检测与认证，Android，多窗口浏览器模式，跨域处理，页面自适应 Abstract At present business processes are old and explicit in industrial market of certification and detection filed, as well as users can not have effective and convenient communication with detection institutions. Apart from these, customers have to come to detection institutions personally to send samples, and they can not take effective trace of each process during detection. All of these limit the advanced development of certification and detection field. As the versions, types and resolution of users' mobile phones vary in current market, conditional ways depending on systems respectively cost extra time and resources. In order to develop efficiently and save cost of projects, this paper combines android with HTML5 to design and start the development of mobile web system. However, due to standard specification of W3C of HTML5 hasn't been drafted, and browser-alike webview in android has several limits itself, there are still many problems to be solved. Including: (1) Multi-window browser pattern. Webview window in android used to load pages just works like browser, as well as there is only one webview running at the same time. (2)Cross-domain data interaction. Different webviews can not share data. (3)Self-adaption of pages. It is difficult for pages to adapt to devices and browsers of different resolution. This paper researched and designed an online certification and detecting system based on Android and HTML5. Four main parts are included as following: (1) Considering multi-window browser problem, this paper pointed out and analysed reasons of it. The running mechanism of Activity was used cleverly and webiews of main modules were managed through Fragment stacks, in order to control the switch among different modules. (2)Considering cross-domain data interaction problem, reasons of it were pointed out and analysed. LocalStorage was overrided based on HTML5 storage technics, and local sqlite was used to maintain data in order to realize cross-domain data interaction. (3)Considering self-adaption of pages, the system combined the ideas of progressive enhancement and embracing flow layout, aiming at personalitites of mobile facilities viewports, and realized respective solution. (4)Considering the implementation of system functions, the system took the advanteges of native frameworks as well as HTML5 crossing platforms, and developed "Finding Me Detecting" online certification and detecting system. In summary, "Finding Me Detecting" online certification and detecting system filled up blanks of mobile market in certification and detecting field, provoding double side access pattern, that is to say web browser together with mobile side, offering users various ways to access the system, and really realized the goal of whenever and wherever ordering to detect for users and detecting companies. Keywords: HTML5; Quality Authentication; Android; Multi-window browser; Cross-domain data; Page self-adaption 专业名词清单 专业名词 名词解释 HTML5 万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改 Android 一种基于Linux的自由及开放源代码的操作系统，主要使用于移动设备，如智能手机和平板电脑，由Google公司和开放手机联盟领导开发 IOS 由苹果公司开发的移动操作系统 Webkit 一个开源的浏览器引擎，在手机上的应用十分广泛 Webview WebView(网络视图)能加载显示网页，可以将其视为一个浏览器。它使用了WebKit渲染引擎加载显示网页 Activity Activity是一个应用程序组件，提供一个屏幕，用户可以用来交互为了完成某项任务，是一个负责与用户交互的组件 SSH 为 Struts+Spring+Hibernate的一个集成框架，是目前较流行的一种Web应用程序开源框架。其中使用Struts作为系统的整体基础架构，负责MVC的分离，在Struts框架的模型部分，控制业务跳转，利用Hibernate框架对持久层提供支持，Spring做管理，管理Struts和Hibernate。 WebStorage HTML新增的本地存储解决方案之一 LocalStorage 本地永久性存储数据，除非显式将其删除或清空 SessionStorage 存储的数据只在会话期间有效，关闭浏览器则自动删除 Sqlite 一款轻型的数据库，是遵守ACID的关系型数据库管理系统，它包含在一个相对小的C库中 W3C 万维网联盟，创建于1994年，是Web技术领域最具权威和影响力的国际中立性技术标准机构。主要的工作是发展 Web 规范，这些规范描述了 Web 的通信协议（比如 HTML 和 XHTML）和其他的构建模块。 NativeApp 使用传统原生态Android SDK来实现的应用 WebApp 基于浏览器来实现的一种应用 HybridApp 一种可以下载的Native App，其用户界面的全部或者部分元素在嵌入式浏览器组件（WebView之类的）里面运行 优雅降级 一开始就构建站点的完整功能，然后针对浏览器测试和修复。认为应该针对那些最高级、最完善的浏览器来开发网站。而将那些被认为“过时”或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段 渐进增强 一开始只构建站点的最少特性，然后不断针对各浏览器追加功能。先让网站能够正常工作于尽可能旧的浏览器上，然后不断为它在新型浏览器上实现更多的增强和改进。 Viewport 移动设备上的Viewport就是设备的屏幕上能用来显示网页的一块区域，即浏览器上用来显示网页的那部分区域。Viewport不局限于浏览器可视区域的大小，可能比浏览器的可视区域要大，也可能比浏览器的可视区域要小。 媒体查询 CSS媒体查询允许开发者基于浏览网站的设备的特性来应用不同的样式申明，最常用的特性是视口宽度。 GCF 谷歌内嵌浏览器框架, 使用此插件，用户可以通过Internet Explorer的用户界面，以Chrome内核的渲染方式浏览网页。Chrome Frame 会把最新版的Chrome Webkit 内核和JavaScript 引擎注入到IE中, IE浏览器将获得Chrome的性能和功能 目录 摘要 I ABSTRACT II 专业名词清单 III 第一章 绪论 1 1.1 研究背景与意义 1 1.2国内外相关研究现状 2 1.2.1 在线认证检测平台开发现状 2 1.2.2 HTML5 3 1.2.3 Android 3 1.2.4 Android移动Web项目开发的三种解决方案：Native, Web和Hybrid优缺陷分析 4 1.2.5国内外应用现状 6 1.2.6 研究现状总结 7 1.3研究目标与内容 7 1.3.1多窗口浏览器模式的实现机制 7 1.3.2跨域交互即缓存处理方法 7 1.3.3页面自适应机制，即设备自适应与浏览器自适应机制 8 1.3.4 “认我测”质检服务平台的设计和实现 8 1.4 本文的结构安排 8 第二章 多窗口类浏览器设计 11 2.1 多窗口类浏览器需求分析 11 2.1.1 Activity简介 11 2.1.2 Fragment简介 11 2.1.3 多窗口类浏览器需求 12 2.2 多窗口浏览器模式的实现机制 12 2.2.1安卓移动端多窗口浏览器框架 12 2.1.2多窗口浏览器模式实现机制 13 2.3 模块实现 13 2.3.1类浏览器模式 13 2.3.2多窗口类浏览器模式 14 2.4 本章小结 15 第三章 跨域交互缓存处理设计 17 3.1 跨域交互缓存处理需求 17 3.1.1 缓存技术WebStorage 17 3.1.2 跨域交互缓存处理需求 17 3.1.3 页面回退管理需求 17 3.2 缓存处理机制 18 3.2.1 跨域缓存处理 18 3.2.2页面回退管理 18 3.3 模块实现 19 3.3.1跨域缓存机制的主要实现 19 3.3.2.页面回退管理的实现 22 3.4本章小结 22 第四章 页面自适应机制设计 23 4.1页面兼容策略 23 4.2 页面自适应策略 24 4.2.1设备自适应 24 4.2.2.浏览器自适应 25 4.3 模块实现 25 4.3.1根据适口属性设计响应式布局： 26 4.3.2同分辨率范围内的流式布局设计 26 4.3.3移动端viewport属性设定 27 4.3.4组件样式的渐进增强设计 27 4.4 本章小结 27 第五章 认我测在线检测服务系统设计 29 5.1认我测在线检测服务系统需求分析 29 5.2 系统时序流程 29 5.3 系统功能模块图 30 5.4 本章小结 32 第六章 认我测在线检测服务系统实现与测试 33 6.1认我测在线检测服务框架设计 33 6.2 系统运行环境搭建及配置 34 6.2.1 AndroidManifest.xml主程序环境配置 34 6.2.2 移动端工程资源布局 35 6.3 认我测在线认证检测系统的主要功能实现 36 6.3.1用户查询 36 6.3.2订单操作 37 6.3.3个人信息维护 37 6.4.系统功能测试 38 6.4.1 首页功能模块 38 6.4.2 订单功能模块 38 6.4.3 个人信息模块 39 6.4.4页面自适应 40 6.5 本章小结 41 第七章 总结与展望 43 7.1 工作总结 43 7.2 研究展望 44 致谢 47 参考文献 49 第一章 绪论 1.1 研究背景与意义 目前市场业务中在产品以及其他项目的认证和检测方面存在诸多不便，用户需要实地考察并频繁与检测单位沟通，填写繁琐的纸质检测报告、当面送递样品，对于检测环节中存在的问题难以及时交互并处理。市场上相应的检测平台诸如检测通、凡特网等皆为pc端检测网站，并且操作繁琐不够人性化，用户在实地使用中存在很多问题。昆山工业技术研究院着眼于为委托用户和质检机构搭建良好的沟通桥梁，免去目前市场业务中企业用户需要实地地并频繁地与检测机构沟通，从而提出自己的委托乃至下委托单、等待检测报告等，设计并研发了市场上首款提供质检服务的移动端app，即“认我测”质检服务平台系统，用户只需在手机上安装轻盈小巧的系统app，即可方便快捷的进行委托服务，质检机构亦可便捷地处理请求订单，双方都可以实时追踪委托订单的状态变化。 考虑到目前市场上用户的手机型号、种类、屏幕分辨率等参差不齐，传统方式根据主流系统(如android、ios)分别开发相应的系统耗时又耗力，为了高效开发并节约开发项目成本、提高项目开发效率，并迎合近年来新兴的HTML5移动页面开发技术，公司采用Android+HTML5相结合的方式进行移动端系统的研发工作。系统的主体一次开发即可在不同设备，包括不同系统、不同型号、不同分辨率设备上运行，免去了大量冗余的开发工作，提高项目的开发效率，降低项目的开发维护成本，为用户提供便捷服务。项目的封装框架只需根据系统的不同稍微改动定制即可，传统的多套系统项目现在只需一次开发，即可适应于不同机型。此外系统还可以通过微信公众号推广链接进行访问，大大的增强了系统的可扩展性和用户操作的便捷性。 然而，由于HTML5的W3C标准规范还未制定，安卓系统中类浏览器Webview自身存在一些局限性，使得结合安卓与HTML5开发移动web项目仍处在探索研发阶段，还不够成熟和完善，相应的技术支持也比较有限，因此仍存在着诸多问题亟需解决,包括: (1)多窗口浏览器模式问题。安卓用于加载的Webview视图窗口只是作为类浏览器而存在，并不等同于pc浏览器，在安卓上更是只能同时运行一个Webview，每次加载新的页面都只能覆盖掉原先的页面，无法达到网页浏览器的多窗口模式。通过常规的pc浏览器窗口的相应open、close进行新增窗口、关闭窗口等操作，在Webview类浏览器窗口中都无法正常运作，甚至会导致Webview失去响应。为此，需要研究相应的解决方案，用于模拟用户适应的网页多窗口浏览器模式。（2）跨域交互问题，即缓存机制与浏览记录管理问题。不同于网页浏览器，用户的数据可以在不同的窗口之间共享，Webview由于其模块之间无法共享数据的机制为保存用户信息以及共享其他程序数据带来了巨大难题。为此需要区分数据是同模块内部共享还是跨域共享访问，并提供相应的解决方案。Webview通过模拟多窗口浏览器模式运作后，在不断的新开页面以及不同模块之间互相切换，会导致页面回退时历史浏览地址发生覆盖，使得不同模块无法回到相应的上级页面，为此需要有效的对页面的浏览历史进行管理，并提供切实可行的方案。（3）页面自适应问题,即设备自适应与浏览器自适应问题。针对移动设备繁杂的屏幕分辨率，如何让页面进行分辨率自适应，从而发挥相对于原生态安卓开发的优势，是一个需要探索和解决的问题。考虑到高效开发设计以及便于推广应用，HTML5的界面不仅仅需要适应基于Webkit内核的Webview，还要能够方便的应用于PC端的网页，如何让HTML5的网页能够适用不同的浏览器内核，也是一个亟待解决的问题。 为此，如何使得“认我测”质检服务平台中安卓与HTML5的结合开发满足多浏览器模式，并解决跨域之间的数据交互问题，同时提高页面的设备自适应和浏览器自适应能力，成为跨平台移动web项目高效开发所亟待解决的问题。 1.2国内外相关研究现状 1.2.1 在线认证检测平台开发现状 互联网界目前在检测领域存在部分在线检测认证的平台，诸如华强认证、检测通等，可以为用户提供一些简单的检测申请，以及为检测机构提供平台发布相关信息。 图1.1 华强认证检测平台首页 如上图所示，在华强认证平台上用户可以选择认证或者检测服务，针对相应类型进行筛选。根据待检测的种类不同，选择相应的检测机构资质、证书、检测周期等查询结果，根据查询结果选择检测机构进行检测委托。检测机构与平台合作，提供负责的检测服务项目、价格等信息，在平台上开设个人站点，提供数据给平台，用于用户检索。 与时下常见的电商网站类似，此类检测平台都提供检测方设计自己的网站主页以出售检测服务，同时为用户提供检索结果、显示可购买的检测服务，用户可以选择质检服务并加入购物车、下单、查看检测方详情、与卖家（检测方）沟通检测细节等操作，但是这些平台都存在着共同的问题——流程不够清晰明了、检测服务不够个性化、用户操作繁琐等，这些问题给用户和检测机构的使用以及交流带来了很多不便。平台提供的检测项目有限，很多时候用户无法确定自己需要检测的项目所属，也不能有效地与检测方进行沟通。与此同时，认证检测领域对于移动端的涉及基础为零，目前主流移动端市场没有相应的认证检测服务产品，随着移动产品愈发便捷，在移动端研发设计相应的认证检测产品，使得用户可以随时随地进行下单咨询变得愈发重要。 1.2.2 HTML5 为了方便用户的使用，“认我测”认证检测平台的PC端基于B/S架构，其设计和研发离不开浏览器内核支持，同时移动端的Web开发也同样需要HTML5语言的支持。利用HTML5的崭新特性，能够更好地为用户提供服务。 HTML5是用于取代1999年所制定的HTML4.01和XHTML1.0标准的HTML（标准通用标记语言下的一个应用）标准版本；现在仍处于发展阶段，但大部分浏览器已经支持某些HTML5技术。HTML5有两大特点：首先，强化了Web网页的表现性能。其次，追加了本地数据库等Web应用的功能。 HTML5广义上为包括HTML、CSS和JavaScript在内的一套技术组合。减少浏览器对于需要插件的丰富性网络应用服务，如Adobe Flash、Microsoft Silverlight与Oracle JavaFX的需求，并且提供更多能有效增强网络应用的标准集。目前HTML5已向开发人员提供了很多新的标签，如section，nav，article，header和footer等。这些标签语义化程度高，被广泛使用。 HTML5逐渐为移动Web开发所采纳，主要原因在于其适用移动项目开发的八大特性，即离线缓存、音频视频自由嵌入、地理定位、Canvas绘图、丰富的交互方式、低开发维护成本、CSS支持以及调用手机硬件。其中离线缓存可以看做是加强版的cookie，不受数据大小限制，有更好的弹性以及架构，可以将数据写入到本机的ROM中，还可以在关闭浏览器后再次打开时恢复数据，以减少网络流量。音频视频方面HTML5无需拆分开混排的多媒体内容，可以将文字、图片、音频、视频等放在一起进行处理。HTML5提供地理定位的支持，无需专属导航软件，通过缓存即可加载地图数据，方便灵活。在系统开发和维护方面，打开即可使用最新版本，免去重新下载升级包的麻烦，使用过程中就直接更新了离线缓存。除此之外，HTML5增强了对CSS样式的支持，极大的增强了界面的美化和友好性，提高了用户体验。 1.2.3 Android Android是一种基于Linux的自由及开放源代码的操作系统，主要使用于移动设备，如智能手机和平板电脑，由Google公司和开放手机联盟领导及开发。Android操作系统最初由Andy Rubin开发，主要支持手机。2005年8月由Google收购注资。2007年11月，Google与84家硬件制造商、软件开发商及电信营运商组建开放手机联盟共同研发改良Android系统。随后Google以Apache开源许可证的授权方式，发布了Android的源代码。2011年第一季度，Android在全球的市场份额首次超过塞班系统，跃居全球第一。 2013年的第四季度，Android平台手机的全球市场份额已经达到78.1%。 Android是一个真正意义上的开放性移动设备综合平台。它包括操作系统、用户界面和应用程序－移动电话工作所需的全部软件，而且不存在任何以往阻碍移动产业创新的专有权障碍。通过与运营商、设备制造商、开发商和其他有关各方结成深层次的合作伙伴关系，来建立标准化、开放式的移动电话软件平台，在移动产业内形成一个开放式的生态系统，这样应用之间的通用性和互联性将在最大程度上得到保持。 在开发之初，Android平台就被设计成一个由一系列应用所组成的平台。所有的应用都运行在一个核心的引擎上面，这个核心引擎其实就是一个虚拟机，它提供了一系列用于在应用和硬件资源间进行通讯的API。Android打破了应用之间的界限，开发人员可以把Web上的数据与本地的联系人、日历、位置信息结合起来，为用户创造全新的用户体验。此外应用程序不仅可以通过标准API 访问核心移动设备功能、互联网，应用程序还可以声明它们的功能供其他应用程序使用。 考虑到移动端市场主流操作系统的使用情况、移动领域的发展趋势以及Android操作系统的开源性，系统采用Android操作系统为研究对象，在其基础上进行设计和研发，使得认证检测产品能够为主流用户所使用，为用户带来便捷。 1.2.4 Android移动Web项目开发的三种解决方案：Native, Web和Hybrid优缺陷分析 Native app是用传统原生态Android SDK来实现的应用；Web app是基于浏览器来实现的一种应用。 Hybrid app是一种可以下载的Native App，其用户界面的全部或者部分元素在嵌入式浏览器组件（WebView之类的）里面运行。对用户来说，Hybrid App与Native App很难区别。二者都可以从应用程序商店或市场下载，存放在移动设备上，运行方式完全如同其他任何应用程序。但是对开发者来说，却存在巨大的差异，因为其无需为每一种移动操作系统从头开始重新编写应用程序，而是只要用HTML、CSS和JavaScript编写其中一部分应用程序代码，即可在多个设备上重复使用。 以下是三种技术各自的优缺点。 Native app Web app Hybrid app 系统特性 可以完美发挥系统特性（调用系统服务、内存管理等）； 操控设备硬件（如相机、蓝牙、振动器等） 无法充分发挥系统特性（调用系统服务、内存管理等）； 无法操控设备硬件（如相机、蓝牙、振动器等） 可以发挥大部分系统特性（调用系统服务、内存管理等）； 可以通过JavaScript API操控设备硬件（如相机、蓝牙、振动器等） 用户体验 可提供最佳的用户体验，最优质的用户界面，最华丽的交互； 支持消息推送 用户体验较差； 图片和动画支持性不高； 不支持消息推送 可提供较好的用户体验； 支持消息推送 本地资源 可访问本地资源 不支持访问本地资源 可访问本地资源 应用更新 获得新版本时需重新下载应用更新，不够方便 跨平台开发、用户不需要下载安装App,开发速度快 可以下载新应用更新，也可在线更新 适用场景 适合制作游戏等性能要求比较高的应用 对于对界面的灵活性有较高要求的app 适用于对画面表现特别高以外的主流需求 开发成本 各平台不兼容，多平台的开发、移植比较复杂，开发成本高，开发周期长，开发成本高； 维护多个版本的成本比较高； 针对多种设备（不同分辨率、不同硬件配置等）的调试和适配较麻烦，维护成本高； 纯HTML5快速开发，较低的开发成本； 支持设备广泛，基于浏览器，跨平台性，维护成本低； Native+HTML5 针对不同系统制定系统外壳，页面部分可重用，大大降低开发成本； 可直接在线更新，更新成本低； 跨平台性，无需针对不同平台开发多个版本应用。 网络要求 支持离线使用 非常依赖网络，网络不稳定等其他环境时，用户请求页面的效率大打折扣 大部分功能依赖网络 考虑到系统需要提供较好的用户体验、用户与检测机构能够利用消息推送进行实时沟通、用户的查询和下单操作默认已具备网络环境等因素，因此为了更好地利用移动端本地硬件支持以及实现跨平台、跨设备的开发，系统采取了Hybrid混合开发模式。通过在原生态框架中嵌入Webview类浏览器，主体页面采用HTML5开发，由原生态定制系统框架，这样在更换移动端操作系统时，只需相应更换系统外壳，主体部分可以重复利用，极大地减少了研发成本，提高了系统的可复用性。系统主体部分更新时，无需在应用市场中重新下载，应用HTML5的特性在线更新缓存即可方便地获取最新版本，为用户带来了便捷。 1.2.5国内外应用现状 图1.2 智能手机操作系统分布数据 市场调研公司Kantar Worldpanel ComTech发布的智能手机操作系统数据显示，截至2016年2月末的三个月内，Android中国城市的销售份额从去年同期的73%增至76.4%。而在美国和欧洲五大市场（包括英国、德国、法国、意大利和西班牙），Android的市场占比继续保持增长态势。因此系统选取市场移动端主流操作系统Android作为基础，进行移动端认证检测产品的研发和设计。 随着移动浪潮的兴起，各种APP层出不穷，极速的业务扩展提升了团队对开发效率的要求，这时使用IOS&Andriod开发一个APP的成本相对过高，而HTML5的低成本、高效率、跨平台等特性马上被利用起来形成了一种新的开发模式：HybridAPP。 作为一种混合开发的模式，Hybrid APP底层依赖于Native提供的容器（UIWebview），上层使用Html&Css&JS做业务开发，底层透明化、上层多多样化，这种场景非常有利于前端介入，非常适合业务快速迭代。Hybdrid作为目前主流的移动端开发设计模式，能够极大的利用Native和HTML5的优势，将性能与用户体验相结合，缩短跨系统的产品研发周期，给用户和研发都带来极大的便利。混合型APP软件兼具“原生型APP软件良好用户交互体验的优势”和“网页型APP软件跨平台开发的优势”。市场上一些主流移动应用都是基于混合型APP软件的方式开发，比如工商银行、百度搜索、街旁、东方航空、微信、去哪儿等。 目前已有众多企业采用混合型APP软件技术开发APP应用，一方面是开发简单，另外一方面可以形成一种开发的标准。企业封装大量的原生型的原生插件如支付功能插件供Java调用，并且可以在今后的项目中尽可能的复用，从而大幅降低开发时间和成本。混合型APP软件的标准化给企业移动应用开发、维护、更新都带来了极高的便捷性。 混合型APP软件通常是基于第三方跨平台移动应用引擎框架进行开发，在国内开发者中比较知名的有PhoneGap、Titanium和AppCan。这些引擎框架一般使用HTML5和Java作为编程语言，调用引擎封装的底层功能如照相机、传感器、通讯录、二维码等。HTML5和Java只是作为一种解析语言，真正调用的都是原生型APP软件一样封装的底层功能，这是和网页型APP软件的最大区别和不同。因为使用了浏览器技术，所以混合型APP软件通常具有跨平台的特性，并且开发成本和网页型APP软件接近，开发效率也远高于原生型APP软件。根据国际科技媒体ReadWriteWeb 2015数据统计显示，截至2015，有80%的App全部或部分基于HTML5研发。大部分的App内容以网页的形式呈现，包括微信、Facebook、Twitter等。为此，Hybrid混合模式成为“认我测”在线检测服务平台移动端框架的开发和设计依赖。 尽管微信通过公众号的形式，使得Android+HTML5模式得以应用并推广，这项技术目前仍不够完善，利用web实现移动app存在一些瓶颈。（1）根据百度移动互联网发展趋势报告，iPhone下载一个1.407k的网页，建立连接耗时1.35s左右，传输耗时0.15s左右。这样，导致app在建立连接的时候，屏幕处于白屏状态。app在一秒多的时间内，完全处于白屏状态，加上3G、GPRS网络的不稳定，有时候等待app响应需要几秒甚至1几秒的时间，对于mobie app来说，这是个致命的缺陷。（2）难以实现本地存储。基于Android存在多版本系统，Android低版本中的Webkit对HTML5和CSS3不能够很好地支持。常用的HTML5向后兼容方案是通过Javascript+CSS+Html来模拟HTML5的一些特性，但过多的js存在于移动app中会得不偿失。 Android+HTML5的混合开发模式对于移动端Web项目开发已经成为市场的主流和趋势，与此同时这项技术还存在着一些问题，需要不断的进行改进和完善。 1.2.6 研究现状总结 总而言之，Android操作系统在移动市场仍居主流，HTML5也为用户带来崭新的特性，Hybrid混合开发模式也逐渐成为移动Web开发的主流设计模式，大量的市场应用都成功的应用和推广了Android+HTML5。正是在这种背景下，“认我测”在线认证检测系统率先填补了移动端认证检测领域的产品空缺，采取了Hybrid混合开发模式。同时，利用Android+HTML5相结合开发移动端Web项目尚处于应用阶段，仍然存在很多问题，还不够成熟和完善。如何将这二者更有效的结合使用，并解决过程中存在的问题，提高项目开发的效率以及节约开发成本，是一个需要研究探索的问题，这也是本课题的意旨。 1.3研究目标与内容 1.3.1多窗口浏览器模式的实现机制 深入挖掘Webview作为类浏览器视图窗口与传统PC端浏览器的区别，针对安卓端同一视图区域单一运行Webview的特性，通过在原生态安卓中启用Fragment视图加载不同视图页面，在外部Activity中对Fragment进行管理控制。同时调整窗口加载及操作模式，适应移动端相关操作从而实现程序中加载多个Webview视图窗口并可以随意切换，实现类浏览器多窗口加载资源并交互的模式。 1.3.2跨域交互即缓存处理方法 针对Webview不支持多窗口间跨域访问的问题，重写缓存处理方式以替代网页端会话级缓存机制，模拟web端本地存储localStorage对本地缓存的处理方法，诸如setItem()、getItem()、removeItem()以及clear()，通过将持久化数据存储在移动端本地数据库来模拟网页端数据持久化存储，实现多Webview间跨域交互访问以及缓存数据保存和处理。 通过维护Webview的历史栈，根据需求进行过滤跳转或者重新加载页面。若当前为重定向后的链接，那么回退的时候就需要忽略上一级的链接，不使用Webview自带的回退方法goBack(),相对地移除重定向和重定向后的url,获取到初始页面链接后自行进行loadUrl()操作. 1.3.3页面自适应机制，即设备自适应与浏览器自适应机制 利用Viewport来控制页面的缩放比例、页面的初始大小，针对不同分辨率的移动设备实现网页页面自适应。通过渐进增强以及优雅降级机制来控制不同版本、不同浏览器之间的兼容问题，以及利用JavaScript库辅助修正相应的样式问题，从而实现浏览器适配的机制。 1.3.4 “认我测”质检服务平台的设计和实现 移动客户端通过安卓与HTML5结合开发设计委托方和质检方app，通过原生态安卓框架外壳嵌入Webview渲染加载页面，添加Java接口与消息会话模块，通过移动端Sqlite操作数据重写localStorage来实现缓存机制，利用Fragment视图层控制Webview的切换与运行来展现主要的功能模块—委托方App：首页模块、订单模块、消息模块和个人模块；质检方App—订单模块、消息模块和个人模块。 服务器端采用J2EE的SSH框架搭建项目，通过微信公共账号链接Html页面，为用户提供多种系统访问途径，增强了系统的可扩展性，为用户带来便利。 1.4 本文的结构安排 本文共分为七个章节。 第一章是绪论部分，介绍课题的研究背景，指出课题的研究意义。然后通过对HTML5研究、Android移动Web开发技术研究以及Hybrid开发问题研究来介绍该课题在国内外的研究现状。最后说明本文的研究目标与内容，以及论文的结构安排。 第二章介绍多窗口类浏览器模式策略的设计与实现。针对现有移动端单一窗口存在的不足，提出类浏览器多窗口解决方案，并对多窗口浏览器模式进行设计 第三章其次分析Webview的跨域数据交互问题，针对移动端类浏览器内核不支持跨域数据访问的不足，提出本地持久性存储替代web端缓存的解决方案，并对跨域访问模式进行设计。同时分析了页面重定向导致的页面无法正常访问问题，提出采用页面浏览历史栈的管理方案，针对回退时目标页面解析进行相应操作。 第四章是多分辨率多设备页面自适应策略设计。首先分析现有Web页面在移动端不同分辨率和设备显示存在的问题，针对页面难以在不同设备上保持兼容适应的不足，提出页面自适应解决方案，并通过渐进增强以及媒体查询等方式进行设计。 第五章是认我测系统的设计，包括系统的功能需求分析、业务流程展示以及功能模块设计。 第六章是系统的功能测试，介绍了相关的实现环境与工具，并对系统的主要功能模块以及主要解决方案进行了功能验证测试。 第七章是总结展望部分，总结本文的主要工作内容与创新点，并对本文写作与实验过程中的不足及后续研究进行展望。 第二章 多窗口类浏览器设计 2.1 多窗口类浏览器需求分析 2.1.1 Activity简介 在Android中一个Activity是一个应用程序组件，它提供一个屏幕，用户可以为了完成某项任务用来交互，例如拍照、拨号、看地图、发送邮件等。每一个Activity被系统给予一个窗口，在该窗口上面可以绘制用户接口。一个应用程序通常由多个Activities组成，他们通常是松耦合关系。通常首次启动应用程序的时候呈现给用户的Activity被指定为"Main Activity”。为了完成不同的动作，每一个Activity可以启动另一个其他的Activity。一个新的Activity启动，前一个Activity就被终止了，但是系统将Activity保存在一个栈上。当一个新Activity启动，它被推送到栈顶，取得用户焦点。栈的管理符合“后进先出”原则，所以，当用户完成当前Activity然后点击back按钮，它被弹出栈并且被摧毁，然后恢复之前的Activity。 若一个Activity因新的Activity启动而停止，系统通过Activity的生命周期回调函数，通知其这种状态转变。一个Activity根据它自己的状态变化可能会收到许多回调函数的通知信息，诸如系统创建、停止、恢复或者摧毁Activity，每个回调都使得开发者得以完成相应状态的指定工作。例如，当停止Activity的时候，应该释放所有大的对象，如网络数据库连接。当Activity恢复时，开发人员可以重新获得必要的资源和恢复被中断的动作。这些状态转换都是Activity的生命周期的组成部分。 2.1.2 Fragment简介 Android 3.0中开始引入Fragments 的概念，可以称为:碎片、片段。其目的是为了解决不同屏幕分辨率下动态和灵活的UI设计，大屏幕如平板、小屏幕如手机。平板电脑的设计使得其有更多的空间来摆放更多的UI组件，而多出来的空间存放UI使得这些组件会产生更多的交互，从而诞生了Fragments。 Fragments 的设计不需要开发者来亲自管理视图层的复杂变化，通过将Activity 的布局分散到Fragment 中，可以在运行时修改Activity 的外观，并且由Activity 管理保存其变化。当一个片段指定了自身的布局时，它能和其他片段配置成不同的组合，在活动中为不同的屏幕尺寸修改布局配置。小屏幕可能每次显示一个片段，而大屏幕则可以显示两个或更多。Fragment是Activity的界面中的一部分或一种行为。可以把多个Fragments组合到一个Activity中来创建一个多面界面并且可以在多个Activity中重用一个Fragment。除此之外，可以把Fragment认为是模块化的一段Activity，它具有自己的生命周期，接收它自己的事件，并可以在Activity运行时被添加或删除。 Fragment不能独立存在，它必须被嵌入到Activity中，而且Fragment的生命周期受到所在的Activity的影响。当Activity暂停时，它拥有的所有的Fragments都被暂停；当Activity销毁时，它拥有的所有Fragments都被销毁。然而，当activity运行时（在onResume()之后，onPause()之前），可以单独地操作每个Fragment，比如添加或删除它们。在执行上述针对Fragment的事务时，可以将事务添加到一个栈中，这个栈被Activity管理，栈中的每一条都是一个Fragment的一次事务。有了这个栈，就可以反向执行Fragment的事务，这样就可以在Fragment级支持“返回”键（向后导航）。 2.1.3 多窗口类浏览器需求 在Android中展现在用户面前的Activity同时只能存在一个，而由于类浏览器内核Webkit的特性，一个Activity中同时只能加载一个Webview用以渲染网页，如果用户想模仿Web浏览器新增一个浏览器标签窗口打开新页面，只能将原来的网页覆盖掉，无法在窗口间来回切换，用户也无法保持原有的浏览器使用习惯。为此，需要利用Activity栈的切换特点，将系统的主要模块分别设计在不同的Fragment上，通过各自的Webview进行加载渲染，在用户需要切换窗口时，通过管理切换Fragment达到目的的实现。 2.2 多窗口浏览器模式的实现机制 2.2.1安卓移动端多窗口浏览器框架 图2.1 多窗口浏览器模式系统框架图 如图4所示，系统安卓移动端由首页、订单、消息以及个人信息四个模块构成，每个模块对应一个视图层Fragment，在安卓Activity运行时一次加载一个视图Fragment，通过底部的原生态菜单栏BottomBar进行视图之间的切换。每个视图Fragment对应同一个位置的Webview类浏览器窗口，通过Webview加载所需要的页面，通过外部的Fragment对Webview的加载以及切换进行控制，从而实现类浏览器多窗口模式。 2.1.2多窗口浏览器模式实现机制 多窗口浏览器模式的实现原理为：安卓外部Activity控制视图层Fragment的加载和切换，Fragment内部加载和控制Webview对页面的渲染，同时调整Web端页面的窗口打开和关闭模式，通过页面重定向进行打开和关闭返回。 多窗口浏览器模式解决两个问题，一是安卓中的类浏览器窗口模式，二是浏览器多标签模式。在移动端的页面加载过程中，类浏览器内核Webview的运行机制为覆盖加载页面，一次运行期间只同时存在一个Webview，与PC端浏览器的运行模式不同，无法通过open打开一个新的浏览器标签页，也无法通过close关闭单个的标签页。为此需要通过loadUrl进行页面重定向，在关闭页面时通过loadUrl反重定向或者通过Webview本身的goBack方法进行回退。移动端的Webview在全局意义上等价于PC端的浏览器，但是通过close关闭的不是一个窗口，而是关闭了整个浏览器。安卓中Activity运行时只能加载一个Webview，因此无法同时展现不同的页面，为此需要通过外部对Webview序列的控制，模拟多窗口显示页面的模式。 在安卓Activity的视图View初始化过程中，实例化需要首次显示的视图层fragment (如首页)，将其放入实例化的视图层管理容器HashMap，并通过changeFragmentFrom Menu方法控制用户对视图层Fragment的切换，将原有的视图层置为等待恢复状态，并激活新的视图层用以在Activity中展现，通过changeFragmentBack控制用户通过回退操作唤醒的首页视图层，以此来控制不同视图层，即类浏览器窗口之间的切换。在相应的Fragment视图层中，初始化视图InitView时渲染加载Webview，同时控制底部的菜单栏，通过Webview加载相应的本地网页或服务器端网页，设置Webview相应的属性进而控制页面由Webview加载，而非默认的系统浏览器加载。为Webview绑定页面与原生态安卓相交互的接口，从而可以在加载的页面内调用安卓的原生态功能。 2.3 模块实现 2.3.1类浏览器模式 该部分主要为安卓中通过Webview渲染加载网页的过程。主要包含以下过程： Fragment布局文件中声明控件Webview，绑定其资源ID，为Webview设置宽度和高度。 （1）在Fragment视图初始化initView部分，利用findViewById()通过资源ID获取到Webview控件，对其进行初始化，同时设置相关的webSettings属性，让Webview可以运行JavaScript脚本以及能与本机数据库进行交互。 （2）重写WebViewClient的shouldOverrideUrlLoading()函数，让应用程序的Webview直接加载网页内容，而不调用外部的浏览器。 （3）重写Webview网页对话框，构建一个Builder用以显示网页中的对话框，在点击确定按钮之后，继续执行网页中的操作，同时关闭Builder对话框。 （4）为JavaScript创建安卓接口。通过addJavaScriptInterface为Webview绑定底层Java接口，同时提供相应的接口方法名以及在页面中可以调用的句柄名称，通过该句柄和方法名，即可在Html5页面的JavaScript中访问该底层的Java方法，实现对页面上部和底部的系统外壳的展示管理。 （5）通过loadUrl进行对目标页面的渲染加载，可以加载访问服务器端的页面，也可访问放置在项目内部的页面文件，该模式需要将相应页面放置于系统的assets目录下。相对而言服务器端页面更加常用，也便于维护。 2.3.2多窗口类浏览器模式 图2.2 多窗口类浏览器模式原理图 （1）创建各个主功能模块的视图类Fragment，分别为主界面模块HomeFragment、订单模块OrderFragment、聊天咨询模块MessageFragment以及个人中心模块PersonalFragment，继承自基类BaseFragment。 （2）每个Fragment视图类中声明并初始化相应的Webview组件，对其进行属性设置，为其绑定JavaScript接口并覆盖渲染加载页面的方法，绑定相应的需要在页面调用的底层Java方法接口。重写默认的页面回退响应事件，对页面访问历史以及目标访问页面进行过滤判断，执行相应的处理方法。 （3）在MainActivity的初始化initView中声明并初始化Fragment管理容器HashMap<String>，初始化主页视图HomeFragment并将其加入容器，设置其为默认加载视图。获取FragmentManager用以维护管理Fragment队列，调用beginTransaction方法开启事务。 （4）重写回退按钮响应事件。当页面回到各自模块的初始页面然后按下回退键时，判断当前模块所在的Fragment，由主页模块后退时，执行确认退出系统操作，若从其他模块进行后退，则回到主页模块。通过底部菜单栏setRadioChecked方法设定当前模块的选中标识。 （5）重写模块间切换的方法changeFragmentFromMenu，开启事务，对模块标识ftag进行判断操作，根据用户点击的模块图表将相应的模块视图Fragment通过onResume()进行恢复，同时通过show()将该模块进行展示，从Fragment管理容器中将主页模块以外的Fragment移除。将带有oflag暂停标识的Fragment视图进行暂停处理，通过hide隐藏取消该视图的展示。 （6）在各自的Fragment模块视图类中重写onResume方法，用以在模块恢复时进行用户是否登录判断。对Webview渲染加载的页面进行分析，判断是否包含index初始页面标识。根据flag标识进行是否需要登录操作，flag为1表示从其他Fragment跳转到该模块的Fragment视图并需要用户登录。 以上就是多窗口类浏览器模式的实现主要环节，通过Webview加载渲染服务器资源页面，控制碎片视图Fragment展现各自模块的Webview，在MainActivity对碎片容器以及碎片视图之间的切换进行管理控制，从而完成多窗口类浏览器模式的实现。 2.4 本章小结 本章分析并介绍了安卓中Activity的基本性质，对碎片视图Fragment进行了相关阐述和引出，综合分析了多窗口类浏览器模式的设计需求。随后对多窗口类浏览器模式的框架进行了设计，通过Activity运行管理Fragment的加载和切换，各个模块的Fragment视图独自加载运行相应的Webview，补充和完善不同模块之间切换和回退的业务逻辑。在模块实现部分详细描述了两个关键部分的实现环节，即类浏览器模式和多窗口类浏览器模式，介绍了过程中主要用到的方法以及实现思想。 第三章 跨域交互缓存处理设计 3.1 跨域交互缓存处理需求 3.1.1 缓存技术WebStorage 图3.1 WebStorage示意图 WebStorage 使得网站能够把信息存储到本地的计算机上，并在以后需要的时候进行获取。WebStorage和Cookie类似，区别在于WebStorage是为了更大容量存储而进行设计。Cookie的大小是受限的，并且每次当请求一个新的页面的时候，Cookie都会被发送过去。而WebStorage则存储在计算机上，网站在页面加载完毕后可以通过Javascript来获取这些数据。 WebStorage提供两种类型的API：localStorage和sessionStorage，区别在于localStorage是本地永久性存储的数据，除非显式将其删除或清空，否则将一直保存在本地。sessionStorage存储的数据只在会话期间有效，关闭浏览器则自动删除。两个对象都有共同的操作API。 3.1.2 跨域交互缓存处理需求 WebStorage存储技术针对的是同一个类浏览器Webview，系统在各模块之间由不同的Webview加载渲染，通过不同的Fragment进行管理，因此模块之间无法共享数据。然而通过多窗口浏览器模式构建的系统模块之间经常需要进行数据交互，如用户登录信息以及产品相关信息，Webview由于其特性仅支持自身内部的缓存数据交互。同Webview内不断的覆盖加载新页面以及发生页面回退时可以对缓存数据提供便捷高效的数据保存，使得在页面加载的过程中可以便利的处理需要交互的数据；相对的不同的Webview之间无法共享数据，无论是会话级缓存还是持久化缓存。为此需要重写web端的持久化存储localStorage，将交互的数据保存到移动设备本地数据库。 3.1.3 页面回退管理需求 对于初始页面为A，点击某个链接跳转到B（http://xxx.com.cn/）,B页面重定向到C页面(http://xxx.com.cn/website/index.Html)，当调用webview.goBack()时，页面回退到B，然后接着会重定向回C页面。这样会导致两个问题:无法回退到Webview的初始页面A以及无法正常退出Activity或者Fragment(只有还未加载完C时进行回退才能退出页面)。为此需要引入历史记录栈，对页面访问历史进行管理，在回退事件中判断该加载页面是否需要重定向并执行相应的操作。 3.2 缓存处理机制 3.2.1 跨域缓存处理 在移动端数据库Sqlite操作类LocalStorage中定义相应的数据库连接属性、创建和更新的操作以及数据库操作单例Instance，在视图访问基类BaseFragment中定义覆盖web端持久化存储localStorage的核心交互类LocalStorageJavascriptInterface。获得数据库操作单例，并覆盖localStorage对缓存的常用处理方法取值getItem(),修改值setItem(),删除值removeItem()以及清空缓存clear()。将页面上获得的数据键值对存入数据库，对其进行更新删除以及返回给页面使用。在Webview初始化时进行页面与后台交互绑定addJavaScriptInterface，并在页面初始化init过程中将页面的默认localStorage操作更换成覆盖重写的方法，即可在页面进行跨域访问时交互相应的数据。 跨域交互的缓存处理机制如图5所示： 图3.2 缓存处理机制原理图 3.2.2页面回退管理 安卓的回退按钮一般用于返回上一级菜单，不过在浏览器页面加载过程中却不能理想地返回上一级页面，默认的回退按钮是针对Activity的回退，对于Webview来说，回退按钮会致使浏览器调用finish()而结束自身的运行，因此需要覆盖Activity的onKeyDown()事件，在方法内部重新对浏览页面进行管理。 在页面的新建关闭以及重定向时，Webview的页面回退goBack()会受到干扰，不能正常回到前一个页面，甚至会发生前后两个页面间来回切换后退的死循环，并影响模块间的后退返回。为此需要对历史访问页面进行管理，采用如下实现方案。 在Fragment视图声明时定义一个用于管理保存历史浏览记录的历史栈ArrayList<String>,将系统初始加载界面加入列表。在此后的页面加载过程中，每次加载页面都将其加入历史栈，在系统回退响应事件中，判断页面是否为重定向页面，如果为重定向页面，则移除历史栈中最后两个链接，加载操作后历史栈的最后一项；否则移除历史栈中最后一项，加载操作后历史栈的最后一项。 页面回退方案的流程图如图3.3所示： 图3.3页面回退管理机制图 3.3 模块实现 3.3.1跨域缓存机制的主要实现 图3.4 重写LocalStorage类示意图 （1）重写LocalStorage类。让LocalStorage继承自SQLiteOpenHelper类，声明LocalStorage对象实例以及其他数据库连接配置信息，如数据表名称、表中存储的数据Id与值Value、数据库名称、创建数据库语句等。通过Singleton单例模式维护LocalStorage实例，重写创建数据库和更新的相关操作。 （2）添加LocalStorage的底层JavaScriptInterface，供服务器资源页面进行访问。通过LocalStorageDBHelper对象获取到单例localStorage，声明上下文对象和SQLiteDatabase对象。重写HTML5存储技术LocalStorage的关键缓存数据操作方法getItem()、setItem()、removeItem()以及clear()。 图3.5 重写WebStorage核心方法示意图 1.重写getItem()，根据传入参数key获取相应的value值 ①判断传入的key是否为空。 ②若key不为空，通过localStorageDBHelper的getReadableDatabase()方法实例化数据库对象database。执行sqlite的数据库查询操作，返回数据库结果操作游标。 ③根据游标的moveToFirst判断查询结果是否为空，返回相应的value结果。关闭数据库连接。 2.重写setItem()，根据传入的参数key和相应值value更新数据库 ①判断传入的key和value是否为空，通过getItem()获取更新前的值。 ②实例化数据库对象database。声明ContentValues对象并将key和value相应赋值。判断更新前和key对应的值是否存在，若存在执行数据库的更新操作；若不存在，执行数据库的插入操作。关闭数据库。 3.重写remove() ①判断传入的key是否为空 ②实例化数据库操作对象，执行相应的数据库删除操作，关闭数据库 4.重写clear() 实例化数据库操作对象，执行数据库删除操作，清空整张数据库表。 在Fragment视图中初始化Webview时，通过addJavaScriptInterface为其绑定重写的底层LocalStorage操作接口，并将操作句柄设置为localStorage。设置webSettings属性，通过setDomStorageEnabled与setDatabaseEnabled启用本地存储功能。 在服务器资源页面JavaScript方法中，尝试用句柄LocalStorage替换window默认的localStorage。若发生异常，说明LocalStorage没有被添加至webview。然后即可像通常HTML5的localStorage对缓存数据进行操作。 3.3.2.页面回退管理的实现 （1）在MainActivity中覆盖模块间的回退响应事件。当模块页面回退至各自的初始页面时，点击回退按钮执行相应的模块切换策略，若该模块为主界面模块，则弹出退出系统确认框供用户选择是否退出；若为其他模块则将菜单栏切换到首页模块。 （2）在各自的Fragment中覆盖模块内部的回退响应事件。在页面初始化时定义并维护一个存放历史访问页面的历史栈loadHistoryUrls （ArrayList<String>），把初始页面url加入到历史栈中，在覆盖加载方法shouldOverrideUrlLoading中将待渲染加载的页面加入到历史栈中。 （3）在Fragment内部的回退事件处理方法中，判断是否可以执行返回操作。然后判断历史栈存存放页面的前一页是否包含初始重定向页面，若包含该页面则移除加载栈中的最后两个链接，否则移除加载栈中的最后一个链接。最后加载重定向之前的页面。 3.4本章小结 本章首先分析了HTML5标准下缓存处理策略WebStorage，其包含本地存储LocalStorage与会话存储SessionStorage，并提供了相应的介绍和说明。然后分析了跨域数据交互问题问题存在的原因以及页面回退管理存在的问题。由于Webview的数据封闭性，不同的模块Webview之间无法共享访问数据，使得不同的模块无法正常交互，为此采用重写LocalStorage的方式，通过本地Sqlite数据库操作模拟HTML5中缓存的操作，重写LocalStorage关键的操作方法setItem()、getItem()、removeItem()以及clear()，并为Webview绑定相应的底层Java方法接口，在服务器页面资源中用重写的LocalStorage替换默认的localStorage，从而完成跨域数据的调用访问操作。由于页面的重定向作用，页面回退时会反复加载到重定向后的页面，导致页面无法正常回退，因此通过维护历史栈的方式，在页面回退时对回退目标页面进行分析判断，并执行相应的回退管理方法，从而使得模块内部的页面以及模块之间可以正常地进行返回操作。 第四章 页面自适应机制设计 针对移动设备分辨率和屏幕大小、设备型号迥异的现状，本章将在分析现有页面跨浏览器兼容方案的基础上，同时结合移动端对不同分辨率设备的支持特性，分析与设计跨机型、跨分辨率、跨浏览器的页面自适应机制。 4.1页面兼容策略 为了使页面能够适应不同版本的浏览器内核，诸如IE、Chorme、Firefox等，CSS3引入了两种常用的设计策略，即优雅降级和渐进增强。 优雅降级指的是在页面设计开始即构建页面的完整功能，然后针对不同的浏览器进行测试和修复。该观点认为应该针对那些最高级、最完善的浏览器来开发网站，同时把那些被认为过时或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段。在这种设计思想下，旧版的浏览器通常被认为仅能提供简单却功能没有大碍的页面浏览体验。虽然可以做一些小的调整来适应某个特定的浏览器，但由于这些调整并非开发过程中关注的焦点，因此浏览器间呈现的差异通常将被直接忽略。 渐进增强指的是在页面设计开始只构建页面的最少特性功能，然后不断针对各高级浏览器追加额外功能。渐进增强思想认为应该先让网站能够正常工作于尽可能旧的浏览器上，然后不断为它在新型浏览器上实现更多的增强和改进。随着时间的推移，当更多的用户逐渐开始升级浏览器，同时浏览器本身的支持度也不断提升时，就会有越来越多的用户体验到这些增强和改进，无需为了一个已经成型的网站在旧式浏览器下正常工作而做逆向开发。渐进增强观点认为网页的开发应关注于内容本身。这使得渐进增强成为目前一种更为合理的设计范例。 图4.1 优雅降级和渐进增强图例 对于优雅降级，功能衰减的设计从复杂的功能现状开始，不断减少用户体验的供给；而渐进增强则的设计是从一个非常基础的，能够发挥作用的版本开始，并不断地进行扩充，以适应未来环境的需要。功能衰减意味着往回看；而渐进增强则意味着朝前看，同时保证其根基安全牢固。 为了能够给用户提供更好的界面交互体验，同时适应不同版本的浏览器内核，系统采用了部分渐进增强的思想，利用媒体查询为不同的浏览器版本和内核提供相应的展现效果，同时保证基本的页面展现功能。 4.2 页面自适应策略 系统采用部分渐进增强的页面适配思想，以及拥抱流式布局策略，通过视口元素的媒体查询来控制不同分辨率阈值下页面的布局规划，调整页面元素的布局为百分比方式，包括组件宽度、字体以及高度、图片的动态大小来控制相同分辨率阈值范围下不同视口中组件的平滑缩放。同时对HTML5页面的移动端适配属性进行设置控制，针对需要达到的效果设置其Viewport的属性，包括宽和高、页面最初大小、初始缩放比例、屏幕像素密度等。使得系统在Web浏览器端以及移动端都有良好的展示效果。 4.2.1设备自适应 Viewport是指用以展现手机页面的区域。尽管Viewport的可见区域和屏幕大小是匹配的，但是它有着自己的尺寸（dimensions），这一尺寸决定了页面上可见的像素点。一个web页面在扩张到整个屏幕之前占用的像素数据是由Viewport的尺寸来定义的，而不是设备屏幕的尺寸。如一个设备的屏幕宽480像素，但是Viewport宽800像素，那么这个web页面需要在800像素宽的屏幕上才能完全展现。 在HTML5中可以使用 &lt;meta&gt; 标签来为页面定义Viewport 的属性。可以在 &lt;meta&gt; 标签的content 属性中，定义多个Viewport属性。例如，Viewport的高和宽，页面的最初大小，以及目标屏幕分辨率。Content 属性中的每个Viewport性质必须以逗号相隔。通过初始缩放initial-scale和用户调整缩放来控制页面的伸张以适当地填充移动端设备的显示区域。通过target density定义屏幕像素密度来控制安卓浏览器和Webview根据不同屏幕的像素密度对页面进行的缩放。 图4.2 视口属性设置示意图 4.2.2.浏览器自适应 通过拥抱流式布局的来使得页面在不同尺寸屏幕上良好的运行。从手机到电脑，设备的屏幕尺寸层出不穷，很难用传统意义上的统一布局来适应这些变动。拥抱流式布局倡导响应式界面设计，通过媒体查询（@media screen and...）来获得设备特性信息，从而灵活的控制不同尺寸屏幕的浏览器动态的调整页面元素的布局，以适应视口特性的变化。 同时根据“目标元素宽度/上下文元素宽度=百分比宽度”的模式将传统的固定像素式布局改为百分比布局，元素的固定像素宽度转换成百分比宽度。假定整个页面布局的宽度是960px，按照1024px屏幕分辨率做参照，百分比应是960/1024 = 93.75%。其他的组件宽度也可以按照960px为参照计算。若除下来的结果是很长的小数，如340/960 = 0.3541666666666667 ，无须对结果进行四舍五入，这样可以保持最高的精确度，这些小数应尽可能完整保留。 根据“目标元素尺寸/上下文元素尺寸=百分比尺寸”将文字的固定像素大小转换为等量的相对尺寸，现代浏览器默认的字体大小是16px，字体的相对大小用em为单位来表示。若某个div的字体大小为48px，则转化后为48/16=3em。结果为小数时的处理方式同上。 给图片设置阈值以使图片随着视口平滑缩放，为不同屏幕尺寸提供不同的图片，然后针对不同视口宽度修正设计，保证在响应式设计中内容始终优先。图片不是布局元素，它里面不包含子元素。另外，图片还有失真的问题，缩放不当都会造成失真。为此，需要给图片添加样式max-width:100% 以实现弹性图片，因为图片所处的容器可以自动缩放，只需让图片限制在父级的宽度之内，就可以随父级一起缩放。弹性图片仅用max-width无法实现，除此之外还需使用百分比宽度。处理方式同计算布局元素的宽度。在此过程中需要注意图片的失真问题，当用户使用的一个超宽屏幕时，图片被放大到原大小的两倍甚至更多，图片的质量会大幅下降。所以还需为图片设置绝对阈值，即宽度上限，因此一个弹性图片的样式组合应该为：width:30%; max-width:400px。 对于一个使用超宽屏幕的用户，按照正常的页面设计比例，这张图片被放大到了500px，但是现在只能显示最大宽度400px，依然是个问题。为此可以采用另一个组合，把max-width加到图片的父级元素上，从源头上就限制放大的最大值，这样图片与它的相邻元素的比例就不会失调了。这样的设计也是个权衡的结果，因为页面结构千变万化，具体的解决办法，还得分析具体页面。 为了防止放大的过宽，可以通过媒体查询来设置不同分辨率下的阈值。在处理各种浏览器兼容问题时，可以借助Modernizr，一个用于检测浏览器功能的开源JavaScript库，通过Modernizr追加的额外类名来辅助修正样式问题，以及通过检测浏览器是否支持媒体查询来按需加载资源，让老版本IE支持HTML5等。 4.3 模块实现 页面自适应主要的实现方式包含: 4.3.1根据适口属性设计响应式布局： ①加入兼容配置代码 &lt;meta http-equiv="X-UA-Compatible" content="IE=Edge，chrome=1"&gt;，通过chrome插件GCF（谷歌内嵌浏览器框架）控制IE以Webkit引擎及V8引擎进行样式排版，若用户未安装该插件则以IE最高文档模式进行展