图片浏览器技术点分析以及实践指导书.doc

图片浏览器技术点分析以及实践指导书 1. 综合案例-图片浏览器 1.1 本章简介 本章主要通过开发一个”图片浏览器”的应用程序主要是方便用户使用安卓手机的时候 可以快速的浏览图片并且对图片进行多点触控的缩小和放大、拖拽本案例主要涉及到的 知识点包括基本控件的使用如TextView、ImageView等高级控件的使用如 GridView、Gallery等之间的跳转以及数据的传递事件的处理如GridView的点 击事件的滑动事件等事件的处理等图片事件的多点触控图片的缩放 图片的拖拽安卓市场分析 通过对豌豆荚市场的搜索可以看到目前安卓市场上关于图片浏览的开发应用非常多 下面就以目前下载量最大的一款软件“图乐相册”为例子来分析一下图片浏览器的功能和应 用情况图乐软件的功能流程以及显示效果如下图所示。 1读出所有图片资源 2单个文件夹图片 3对图片进行统一处理 4拼图 5滑动切换 6直接缩放 图 1-1 图乐软件的功能流程以及显示效果如下图 1.1.2 图片浏览器的示例图 Android系统自带一个GridView和Gallery两个控件GridView网格显示Gallery单 个浏览两者结合起来可以真正实现Gallery浏览图片效果。 本示例通过GridView和Gallery两个控件模仿实现一个完整的仿Gallery图像集的图 片浏览效果。本章的图片浏览器效果图如下 1 图片的整体显示 2图片的gallery滑动 3 图片的缩放 4图片的拖拽 图 1-2图片浏览器效果图 1.2 总体设计 1.2.1 需求分析 需求分析的功能列举如下 1 从资源文件中读取图片并以缩略图的方式显示多个图片 2 点击缩略图片可以显示图片的大图大图之间可以通过滑动的方式进行切换左滑 代表上一张图片右滑代表下一张图片 3 点击大图可以对图片进行多点触控可以对图片进行拖拽 1.2.2 概要设计 图片浏览器是一款简易的对图片进行预览和显示的软件本软件的功能设计如下 1 从资源文件中读取图片并以缩略图的方式显示多个图片 2 点击缩略图片可以显示图片的大图大图之间可以通过滑动的方式进行切换左滑 代表上一张图片右滑代表下一张图片 3 点击大图可以对图片进行多点触控可以对图片进行拖拽 1.2.3 设计原理 本例子的文档结构如下图所示。 GridViewActivity 图片资源文件 (ImageSource) GridImageAdapter GalleryActivity ImageAdapter myGallery ImageDetailActivit y MultiPointTouchLi stener 图 1-3 图片浏览器的结构设计图 1.3 图片浏览器的功能模块介绍 1.3.1 图片浏览器应用程序结构 图片浏览器应用程序涉及的功能和界面比较多为了方便对代码的管理对功能进行了 模块的划分将相关功能的Activity放在同一个包下图片浏览器的应用程序功能如下表所 示。 表 1-1 图片浏览器的源文件功能模块 包名 文件名 作用 com.homer.gridgallery ImageSource 存放图片信息到res/drawable目录 GalleryActivity 以滚动视图的方式显示图片 GridViewActivity 以缩略图的方式显示图片 myGallery 对gallery控件扩充左右移动到末尾保护 MultiPointTouchListener Imageview的多点触控以及拖拽的实现 ImageDetailActivity 对于gallery的图片单独开activity来实现多 点触控以及拖拽 图片浏览器的应用程序结构如下图所示。(需要说明) 图 1-4图片浏览器的应用程序结构图 1.3.2 程序的布局文件 根据上面所描述的图片浏览器的应用程序结构图可以看出程序的布局主要主要由 main.xml(主页面)、gallery.xml(图片画廊页面)、imageinfo.xml(图片多点触控以及拖拽)三个布 局文件组成 main.xml(主页面)的布局关键代码如下图(图片需要注释)程序清单: GridViewActivity\res\values\main.xml; ?x