图片浏览器设计与实现.docx
《图片浏览器设计与实现.docx》由会员分享，可在线阅读，更多相关《图片浏览器设计与实现.docx（14页珍藏版）》请在冰豆网上搜索。
图片浏览器设计与实现
图片浏览器设计与实现
洛阳理工学院
手机软件开发实训报告
专业计算机应用技术
班级Z120551
学号Z12055139
姓完成日期2014-1-6
一、简介
本款图片浏览器软件基于Android系统平台研发的，设计有透明度、缩放、旋转和选择图片等功能，其中设计涉及8个button按钮，可以实现图片的查看和基本的操作功能，框架结构ImageView有两个子类ImageButton和QuickContactBadge,ImageButton还有一个子类是ZoomButton。
二、程序模块划分
1.XML文件属性
调整边界,保持长宽比 :
android:
adjustViewBounds,setAdjustViewBounds（boolean）,是否调整自己的边界,用来保持图片的长宽比例,该属性与android:
maxHeight和android:
maxWidth属性一起使用才有效果,单独使用没有效果; 设置最大宽,高 :
android:
maxWidth（android:
maxHeight）,setMaxWidth（int）[setMaxHeight（int）],该属性需要与android:
adjustViewBounds属性一起使用,单独使用无效果;
设置图片固定大小,同时保持长宽比 :
a.设置android:
adjustViewBounds为true;b.设置最大宽度,高度;c.设置android:
layout_width与android:
layout_height值为warp_content; 裁剪保留空白 :
android:
cropToPadding,setCropToPadding（boolean）,是否裁剪,用来保留ImageView的padding,该属性与android:
scrollY属性一起使用的时候才有用,单独使用没有效果;即在滚动的时候,滚动到边界,边界的padding空白是否显示;
填充方式 :
android:
scaleType,setScaleType（ImageView.ScaleType）,设置图片缩放类型以适配ImageView大小,即填充方式;
可能的取值 :
matrix,fitXY,fitStart,fitCenter,fitEnd,center,centerCrop,centerInside;
matrix :
方法中的常量值为ImageView.ScaleType.MATRIX,使用矩阵来进行绘图;
fitXY :
方法中的常量值为ImageView.ScaleType.FIT_XY,在xy两个方向上缩放,使图片完全填充整个ImageView不按照长宽比例缩放;
fitStart :
方法中的常量值为ImageView.ScaleType.FIT_START,保持长宽比缩放,直到该图片完全显示在ImageView中,缩放完成之后该图片在左上角;
fitCenter :
方法中的常量值为ImageView.ScaleType.FIT_CENTER,保持长宽比缩放,直到该图片完全显示在ImageView中,缩放完成之后该图片位于中央;
fitEnd :
方法中的常量值为ImageView.ScaleType.FIT_END,保持长宽比缩放,直到该图片完全显示在ImageView中,缩放完成之后该图片位于右下角;
center :
方法中的常量值为ImageView.ScaleType.CENTER,将图片放在ImageView的中央,不进行缩放;
centerCrop :
方法中的常量值为ImageView.ScaleType.CENTER_CROP,保持长宽比缩放,使图片完全覆盖ImageView;
centerInside :
方法中的常量值为ImageView.ScaleType.CENTER_INSIDE,保持长宽比缩放,是的ImageView完全显示图片;
（1）程序运行的AndroidManifest描述：
【AndroidManifest.xml】
xmlversion="1.0"encoding="utf-8"?
>
android="
package="com.lyc.pic"
android:
versionCode="1"
android:
versionName="1.0">
icon="@drawable/icon"android:
label="@string/app_name">
name=".MianActivity"
android:
label="@string/app_name">
name="android.intent.action.MAIN"/>
name="android.intent.category.LAUNCHER"/>
minSdkVersion="8"/>
（2）程序界面布局XML文件 :
【activity_main.xml】
android="
xmlns:
tools="
android:
layout_width="match_parent"
android:
layout_height="match_parent"
android:
background="@drawable/bg_im"
android:
orientation="vertical">
android:
orientation="horizontal"
android:
layout_height="wrap_content"
android:
layout_width="fill_parent"
android:
padding="5dp"
android:
gravity="center">
android:
id="@+id/alpha_plus"
android:
layout_height="fill_parent"
android:
layout_width="fill_parent"
android:
layout_weight="1"
android:
text="透明度+"
android:
background="@drawable/bg_bt"
android:
onClick="onClick"/>
android:
id="@+id/alpha_minus"
android:
layout_height="fill_parent"
android:
layout_width="fill_parent"
android:
layout_weight="1"
android:
text="透明度-"
android:
background="@drawable/bg_bt"
android:
onClick="onClick"/>
android:
id="@+id/prev_page"
android:
layout_height="fill_parent"
android:
layout_width="fill_parent"
android:
layout_weight="1"
android:
text="上一张"
android:
background="@drawable/bg_bt"
android:
onClick="onClick"/>
android:
id="@+id/next_page"
android:
layout_height="fill_parent"
android:
layout_width="fill_parent"
android:
layout_weight="1"
android:
text="下一张"
android:
background="@drawable/bg_bt"
android:
onClick="onClick"/>
android:
orientation="horizontal"
android:
layout_height="wrap_content"
android:
layout_width="fill_parent"
android:
padding="5dp"
android:
gravity="center">
android:
id="@+id/big"
android:
layout_height="fill_parent"
android:
layout_width="fill_parent"
android:
layout_weight="1"
android:
text="放大"
android:
background="@drawable/bg_bt"
android:
onClick="onClick"/>
android:
id="@+id/small"
android:
layout_height="fill_parent"
android:
layout_width="fill_parent"
android:
layout_weight="1"
android:
text="缩小"
android:
background="@drawable/bg_bt"
android:
onClick="onClick"/>
android:
id="@+id/turn_left"
android:
layout_height="fill_parent"
android:
layout_width="fill_parent"
android:
layout_weight="1"
android:
text="左转"
android:
background="@drawable/bg_bt"
android:
onClick="onClick"/>
android:
id="@+id/turn_right"
android:
layout_height="fill_parent"
android:
layout_width="fill_parent"
android:
layout_weight="1"
android:
text="右转"
android:
background="@drawable/bg_bt"
android:
onClick="onClick"/>
android:
id="@+id/image_all"
android:
layout_width="fill_parent"
android:
layout_height="fill_parent"
android:
scaleType="fitCenter"
android:
src="@drawable/mary1"/>
2.ImageView常用方法
设置位图 :
setImageBitmap（bitmap）,为ImageView设置Bitmap位图显示;
设置Drawable :
setImageDrawable（drawable）,为ImageView设置Drawable显示;
设置资源 :
setImageResource（int）,为ImageView设置资源图片;
设置路径 :
setImageUri（uri）,为ImageView设置图片路径,显示该路径的图片;
3.图片浏览器操作介绍
（1）.实现左右循环切换图片
图片数组 :
将图片放在数组中,ImageView显示数组中的图片;
当前显示图片下标索引 :
设置一个int值,用来表示当前显示图片数组中的图片,这个值不是int下标,这个值设置很大设置成Integer.MAXVALUE/2,该值与图片数组的长度进行取模运算结果就是当前显示的图片数组下标值;
翻页操作 :
上一页操作就将当前显示索引自减1,然后模上图片数组大小;下一页就将当前索引自增1,然后模上图片数组大小;
代码如下 :
/设置一个很大的值, 保证前后翻页不会出现异常
currentImage = Integer.MAX_VALUE / 2;
//为了保证图片能够循环, 这里模运算是关键, 显示图片的下标始终是长度的模
image_all.setImageResource（images[ ++currentImage % images.length ]）;
image_all.setImageResource（images[ --currentImage % images.length ]）;
（2）.透明度改变
设置当前透明度 :
设置一个当前透明度值,初始值为255,255是不透明,0为完全透明;
透明度改变 :
当点击透明度增加按钮的时候,透明度自增20,如果结果透明度大于255,那么改透明度强制设置为255;当点击透明度见效按钮的时候,透明度自减20,当透明度小于0的时候,透明度强制设置为0;
代码如下 :
//透明度初始值
alpha = 255;
//透明度增加
alpha += 20;
if（alpha >= 255）
alpha = 255;
image_all.setAlpha（alpha）;
//透明度减小
alpha -= 20;
if（alpha <= 0）
alpha = 0;
image_all.setAlpha（alpha）;
（3）.图片的放大缩小
获取View组件宽高 :
在Activity普通方法中无法获取到view组件的准确值,如果想要获取view组件的宽高,可以在 onWindowFocusChanged（）方法中获取;
计算每次自增自减的单位值 :
当按下缩放按钮的时候,就对ImageView的宽高值进行自增自减单位值操作;
为ImageView设置宽高 :
即设置LayoutParams,注意是LinearLayout.LayoutParams对象;
代码如下 :
获取宽高 :
@Override
public void onWindowFocusChanged（boolean hasFocus） {
// TODO Auto-generated method stub
super.onWindowFocusChanged（hasFocus）;
//获取ImageView组件的宽高
imageWidth = image_all.getWidth（）;
imageHeight = image_all.getHeight（）;
//计算每次自增自减的值
addWidth = imageWidth / 5;
addHeight = imageHeight / 5;
}
缩放图片操作 :
case R.id.big:
//放大图片
imageWidth += addWidth;
imageHeight += addHeight;
image_all.setLayoutParams（new LinearLayout.LayoutParams（imageWidth, imageHeight））;
break;
case R.id.small:
//缩小图片
imageWidth -= addWidth;
imageHeight -= addHeight;
if（imageWidth <= 0 || imageHeight <=0）{
imageWidth += addWidth;
imageHeight += addHeight;
}
image_all.setLayoutParams（new LinearLayout.LayoutParams（imageWidth, imageHeight））;
break;
（4）.旋转图片操作
设置Matrix对象 :
该对象用来存放图像的旋转角度;
设置旋转角度 :
matrix.setRotate（）,即可设置旋转角度;
创建Bitmap :
创建一个位图,注意将设置了旋转角度的matrix设置上去;
源码如下 :
matrix = new Matrix（）;
//向左旋转进行的操作
anglel += 45;
matrix.setRotate（anglel）;
Bitmap bitmap = （（BitmapDrawable） getResources（）.getDrawable（images[currentImage % images.length]））.getBitmap（）;
bitmap = Bitmap.createBitmap（bitmap, 0, 0, bitmap.getWidth（）,bitmap.getHeight（）, matrix, true）;
image_all.setImageBitmap（bitmap）;
//向右旋转进行的操作
anglel -= 45;
matrix.setRotate（anglel）;
Bitmap bitmap1 = （（BitmapDrawable） getResources（）.getDrawable（images[currentImage % images.length]））.getBitmap（）;
bitmap1 = Bitmap.createBitmap（bitmap1, 0, 0, bitmap1.getWidth（）,bitmap1.getHeight（）, matrix, true）;
image_all.setImageBitmap（bitmap1）;
运行结果：
心得体会：
通过本次生产实习受益匪浅，知道了一个项目的完成步骤和模块的划分，在本次生产实习中遇到的困难是有以下几点：
（1）对android软件开发知识掌握的不够，把代码敲出来功能实现了但是还是不知道怎样实现的；
（2）对开发软件的过程不是很熟悉一个功能实现了不知道下一步要干什么；（3）对eclipse的调试方法知道的不是很多，所以遇到问题自己却束手无策只能求助，最终在网络和好友的帮助下实现了老师要求的功能。
感觉自己的编程能力在不断上升，在短暂的课程设计过程中，我深深的感觉到自己所学的知识的肤浅和在实践运用中知识的匮乏，刚开始的一段时间里，对一些开发无从下手，茫然不知所措，这让我感到非常的难过。
在以前的学习中总以为自己学的不错，一旦接触到实践，就会发现自己知道的是多么少，只有这样我们才会真正领悟到学无止境的含义。
真正的程序高手都是练出来的，通过本次课程设计确实体会到了这一点儿。
课程设计的时间虽然短暂但是学到了不少的知识，课程设计中设计的图片浏览器设计发现很多的错误，其中有的错误到最后解决的时候却发现很幼稚，不过这样的错误多了，在不知不觉中对一些编程知识分外的熟悉了起来，并且自身的排错能力也得到了极大的提高。
设计过程中的一些很小的错误虽然不是很明显，却可以影响到整个软件的运作，可见，再小的错误都不能够有。
我们要有耐心和细心，这样一个小小的手机应用软件却是通过一次次修改之后的结果，真令人感慨万千。
以后的学习中一定要问自己几个为什么，多向聪明人学习请教，不要碍于面子，我看中苹果的未来发展，所以我一定要坚持下去，也许别人很容易学会的东西，我要学很久，但是没关系，因为我始终相信勤能补拙的道理，以后要坚持读相关的书籍，在这里也要感谢一下在实训过程中给予我极大帮助的老师和同学，每次有不懂的问题都能得到及时的回答。
升级会员 