一步一步打造自己的Android图片浏览器(原创)
今天我们试着来制作一个自己的Android图片浏览器。
图片浏览器应该具有什么功能呢?鉴于不同的人不同的理解,这里提出一个基本的需求:
- 搜索手机内的所有图片,展示于一个列表中;
- 列表中展示的是图片的缩略图,点击图片之后,进入图片的大图显示;
- 在大图显示状态下,可以进行左右滑动,查看其它图片;
- 在大图显示状态下,我们应该可以查看图片的详细信息;
- 也许我们还可以支持大图下的放大与缩小?
好了,要求先这么多,我们来实现吧。
第一步:我们要得到手机内的所有图片,展示在一个列表中。
android内部为我们提供了一个类MediaStore,这个类中存放了手机中的所有文件信息,并且这个类中对于图片有一个单独的类:MediaStore.Images,我们可以从这个类中获得我们想要的图片信息。(关于这个类的更详细描述,请参阅android文档,或者:http://www.cnblogs.com/weizhxa/p/5688719.html)。
那么我们依次:
1、新建一个Android工程;
2、在Android工程的主页Activity中添加一个ListView:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="org.fiu.fiuimagebrower.MainActivity" > <ListView
android:id="@+id/lv_images"
android:layout_width="match_parent"
android:layout_height="match_parent" /> </RelativeLayout>
这个listview将成为展示图片的主力。
3、我们为listview绑定一个adapter,adapter的每一项将加载一张图片。
lv_images = (ListView) findViewById(R.id.lv_images);
adapter = new FIUImageAdapter(this);
lv_images.setAdapter(adapter);
4、接下来,我们来实现这个adapter的内部代码,这个adapter继承自BaseAdapter(当然我们也可以继承其他adapter,习惯了)。我们知道,这个adapter的职能就是进行图片的加载,那么我们将加载工作放入这个adapter中进行。那么加载时需要activity传递什么数据呢?由于是从MediaStore中得到数据,所以除了context生成控件的使用外,是不需要其它数据的。所以,我们的adapter可以如下实现。
/**
* 当前的图片浏览器的适配器
*
*/
public class FIUImageAdapter extends BaseAdapter {
/**
* ctx
*/
private Context context;
/**
* list
*/
List<ImageInfo> list = new ArrayList<ImageInfo>(); /**
* ctor
*/
public FIUImageAdapter(Context context) {
this.context = context;
// 加载数据库中的图片信息
loadImages();
} /**
* 加载图片信息
*/
private void loadImages() {
list.clear();
getImages(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, list);
getImages(MediaStore.Images.Media.INTERNAL_CONTENT_URI, list);
Log.i("list.size(): ", list.size() + "");
} /**
* 得到list
*
* @param uri
* @param list
*/
private void getImages(Uri uri, List<ImageInfo> list) {
Cursor externalCursor = MediaStore.Images.Media.query(
context.getContentResolver(), uri, new String[] {
MediaStore.Images.Media.TITLE,
MediaStore.Images.Media.DISPLAY_NAME,
MediaStore.Images.Media.SIZE,
MediaStore.Images.Media.DATA,
MediaStore.Images.Media.DESCRIPTION });
if (externalCursor != null) {
while (externalCursor.moveToNext()) {
ImageInfo model = new ImageInfo();
model.title = externalCursor.getString(externalCursor
.getColumnIndex(MediaStore.Images.Media.TITLE));
model.displayName = externalCursor.getString(externalCursor
.getColumnIndex(MediaStore.Images.Media.DISPLAY_NAME));
model.description = externalCursor.getString(externalCursor
.getColumnIndex(MediaStore.Images.Media.DESCRIPTION));
model.size = externalCursor.getString(externalCursor
.getColumnIndex(MediaStore.Images.Media.SIZE));
model.data = externalCursor.getString(externalCursor
.getColumnIndex(MediaStore.Images.Media.DATA));
list.add(model);
}
}
} @Override
public int getCount() {
return list.size();
} @Override
public Object getItem(int position) {
return list.get(position);
} @Override
public long getItemId(int position) {
return position;
} @Override
public View getView(int position, View convertView, ViewGroup parent) {
ImageView view;
int widthAndHeight = (int) (getScreenWidth() / 3);
if (convertView != null) {
view = (ImageView) convertView;
} else {
view = new ImageView(context);
LayoutParams params = new LayoutParams(widthAndHeight,
widthAndHeight);
view.setLayoutParams(params);
}
view.setImageBitmap(getThumbnail(list.get(position).data,
widthAndHeight, widthAndHeight));
return view;
} /**
* 获取缩略图
*
* @param pathName
* @param width
* @param height
* @return
*/
private Bitmap getThumbnail(String pathName, int width, int height) {
Options opts = new Options();
opts.inJustDecodeBounds = true;
BitmapFactory.decodeFile(pathName, opts);// 图片未加载进内存,但是可以读取长宽
int oriWidth = opts.outWidth;
int oriHeight = opts.outHeight;
opts.inSampleSize = oriWidth / width;
opts.inSampleSize = opts.inSampleSize > oriHeight / height ? opts.inSampleSize
: oriHeight / height;
opts.inJustDecodeBounds = false;
Bitmap decodeFile = BitmapFactory.decodeFile(pathName, opts);// 图片加载进内存
Bitmap result = Bitmap.createScaledBitmap(decodeFile, width, height,
false);
decodeFile.recycle();
return result;
} /**
* 获取屏幕宽度
*
* @return
*/
private float getScreenWidth() {
WindowManager windowManager = (WindowManager) context
.getSystemService(Context.WINDOW_SERVICE);
return windowManager.getDefaultDisplay().getWidth();
} /**
* 获取屏幕高度
*
* @return
*/
private float getScreenHeight() {
WindowManager windowManager = (WindowManager) context
.getSystemService(Context.WINDOW_SERVICE);
return windowManager.getDefaultDisplay().getHeight();
}
}
我们注意到,以上代码中的getImages()方法调用了2次,分别读取了external和internal的图片信息,而这是我们必须做的,因为我们要读取的是手机全部的图片信息。注意,读取外部存储卡的信息时要加入权限。
在图片显示时,我们指定图片的显示高宽都为屏幕宽度的1/3,这样,我们浏览时,图片的大小就是一样的了。
我们注意到,其中有个获取缩略图的方法:getThumbnail(),这个方法根据原始图片路径,进行了缩略图的计算操作。
我们的list列表中的存储类型是:ImageInfo ,这个类型里面保存了图片的几个必要属性。
/**
* 图片信息
*
*
*/
public class ImageInfo {
/**
* 标题
*/
public String title;
/**
* 大小
*/
public String size;
/**
* 描述
*/
public String description;
/**
* 图片路径
*/
public String data;
/**
* 带后缀名
*/
public String displayName;
}
接下来,我们运行:

当然,也有可能是下面这种情况:
07-20 17:24:43.240: W/dalvikvm(4762): threadid=1: thread exiting with uncaught exception (group=0x41662ba8)
07-20 17:24:43.240: W/CursorWrapperInner(4762): Cursor finalized without prior close()
07-20 17:24:43.245: E/Parcel(4762): Reading a NULL string not supported here.
07-20 17:24:43.245: W/CursorWrapperInner(4762): Cursor finalized without prior close()
07-20 17:24:43.245: E/Parcel(4762): Reading a NULL string not supported here.
07-20 17:24:43.245: E/AndroidRuntime(4762): FATAL EXCEPTION: main
07-20 17:24:43.245: E/AndroidRuntime(4762): Process: org.fiu.fiuimagebrower, PID: 4762
07-20 17:24:43.245: E/AndroidRuntime(4762): java.lang.ClassCastException: android.view.ViewGroup$LayoutParams cannot be cast to android.widget.AbsListView$LayoutParams
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.ListView.setupChild(ListView.java:2177)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.ListView.makeAndAddView(ListView.java:2140)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.ListView.fillDown(ListView.java:952)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.ListView.fillFromTop(ListView.java:1037)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.ListView.layoutChildren(ListView.java:1961)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.AbsListView.onLayout(AbsListView.java:2979)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.View.layout(View.java:15488)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewGroup.layout(ViewGroup.java:4662)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.RelativeLayout.onLayout(RelativeLayout.java:1055)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.View.layout(View.java:15488)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewGroup.layout(ViewGroup.java:4662)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.FrameLayout.layoutChildren(FrameLayout.java:453)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.FrameLayout.onLayout(FrameLayout.java:388)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.View.layout(View.java:15488)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewGroup.layout(ViewGroup.java:4662)
07-20 17:24:43.245: E/AndroidRuntime(4762): at com.android.internal.widget.ActionBarOverlayLayout.onLayout(ActionBarOverlayLayout.java:420)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.View.layout(View.java:15488)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewGroup.layout(ViewGroup.java:4662)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.FrameLayout.layoutChildren(FrameLayout.java:453)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.widget.FrameLayout.onLayout(FrameLayout.java:388)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.View.layout(View.java:15488)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewGroup.layout(ViewGroup.java:4662)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewRootImpl.performLayout(ViewRootImpl.java:2397)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:2094)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1066)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:6245)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.Choreographer$CallbackRecord.run(Choreographer.java:767)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.Choreographer.doCallbacks(Choreographer.java:580)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.Choreographer.doFrame(Choreographer.java:550)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:753)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.os.Handler.handleCallback(Handler.java:733)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.os.Handler.dispatchMessage(Handler.java:95)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.os.Looper.loop(Looper.java:136)
07-20 17:24:43.245: E/AndroidRuntime(4762): at android.app.ActivityThread.main(ActivityThread.java:5117)
07-20 17:24:43.245: E/AndroidRuntime(4762): at java.lang.reflect.Method.invokeNative(Native Method)
07-20 17:24:43.245: E/AndroidRuntime(4762): at java.lang.reflect.Method.invoke(Method.java:515)
07-20 17:24:43.245: E/AndroidRuntime(4762): at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:785)
07-20 17:24:43.245: E/AndroidRuntime(4762): at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:601)
07-20 17:24:43.245: E/AndroidRuntime(4762): at dalvik.system.NativeStart.main(Native Method)
啊,我们注意到,上面的:
07-20 17:24:43.245: E/AndroidRuntime(4762): java.lang.ClassCastException: android.view.ViewGroup$LayoutParams cannot be cast to android.widget.AbsListView$LayoutParams 这句中,cast错误,这个是因为ListView的LayoutParam应该使用AbsListView.LayoutParams,而我们在代码89行中使用的是
LayoutParams params = new LayoutParams(widthAndHeight,widthAndHeight);
so,只要修改为:
AbsListView.LayoutParams params = new AbsListView.LayoutParams(
widthAndHeight, widthAndHeight);
即可。
我们继续运行,啊,显示出来了。啊,等等,为什么下拉一下,就崩溃了呢?
一步一步打造自己的Android图片浏览器(原创)的更多相关文章
- Android 图片浏览器 从原来位置放大至全屏显示
android 图片浏览器 特点: 1.从网络加载图片,只需要传图片地址数组即可 2.点击图片,从原来位置放大至全屏 3.支持手势操作 4.完全自定义布局 项目源码请到GitHub下载:https:/ ...
- 用WPF窗体打造个性化界面的图片浏览器
原文:用WPF窗体打造个性化界面的图片浏览器 本文使用WPF窗体(XAML及C#)与Win Form控件(FolderBrowserDialog)结合的方式, 演示制作了一个简易漂亮的WPF图片浏览器 ...
- 分享:android图片浏览器—类微信朋友圈相片浏览【android代码下载】
今天给大家分享个android图片/相册浏览器,类似微信朋友圈相片浏览,可以左右滑动,可以双击放大,捏拉放大 效果如下:<ignore_js_op> device-2013-09-04-1 ...
- android 图片浏览器
自定义了gallary和ImageView: gallary: public class MyGallery extends Gallery { /** * GestureDetector类 在on ...
- android 图片浏览器滑动切换图片
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools= ...
- swift项目初体验--教你打造一款个性化图片浏览器(篇幅过大,慎入)
项目需求:做一个图片浏览器,点击图片查看大图,大图模式下,左右滚动能查看不同的图片. 项目的主要核心技术:图片的弹出和消失动画 项目源代码: Photo-Browser 一.对代码进行重构 ...
- android 图片浏览器 demo
先上效果图,本demo 会逐步完好 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvYTU2NTczMDE2NjEz/font/5a6L5L2T/fontsi ...
- 一步一步教你在 Android 里创建自己的账号系统(一)
大家假设喜欢我的博客,请关注一下我的微博,请点击这里(http://weibo.com/kifile),谢谢 转载请标明出处(http://blog.csdn.net/kifile),再次感谢 大家在 ...
- 一步一步了解Cocos2dx 3.0 正式版本开发环境搭建(Win32/Android)
cocos2d-x 3.0发布有一段时间了,作为一个初学者,我一直觉得cocos2d-x很坑.每个比较大的版本变动,都会有不一样的项目创建方式,每次的跨度都挺大…… 但是凭心而论,3.0RC版本开始 ...
随机推荐
- linux配置java开发环境
一.下载jdk java -version 查看有没有安装jdk 下载对应版本的jdk:jdk-java7u60-linux-x64.tar.gz 二.解压 cp jdk-java7u60-lin ...
- JavaScript中的正则表达式(终结篇)
JavaScript中的正则表达式(终结篇) 在之前的几篇文章中,我们了解了正则表达式的基本语法,但那些语法不是针对于某一个特定语言的.这篇博文我们将通过下面几个部分来了解正则表达式在JavaScri ...
- 浅谈:深入理解struts2的流程已经spring和struts2的整合
第一步:在tomcat启动的时候 1.在tomcat启动的时候,首先会加载struts2的核心过滤器StrutsPrepareAndExecuteFilter <filter> <f ...
- 【转】javascript面向对象编程
摘要:本文本来是想自己写的,奈何花了好长时间写好之后忘记保存,还按了刷新键,一键回到解放前,索性不写了,所以本文是转载的. 面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式,主要包括模块化. ...
- JQuery事件之鼠标事件
鼠标事件是在用户移动鼠标光标或者使用任意鼠标键点击时触发的. ():click事件:click事件于用户在元素敲击鼠标左键,并在相同元素上松开左键时触发. $('p').click(function( ...
- Java程序员
从生存.制胜.发展三个方面入手,为大家展示出程序员求职与工作的一幅3D全景图像.本书中既有在公司中的生存技巧,又有高手达人的进阶策略,既有求职攻略的按图索骥,又有入职后生产环境的破解揭秘. 书中浓缩了 ...
- html5 新选择器 querySelector querySelectorAll
querySelector 返回满足条件的单个元素 使用实例 HTML <div id="main">主体布局</div> JS var main =doc ...
- 使用count结合nvl函数时碰到的问题
count()函数功能:统计表中中某个字段或所有记录个数,字段值为null的不做统计. 手册中解释: COUNT returns the number of rows returned by the ...
- PHP正则表达式详解(一)
前言: 半年前我对正则表达式产生了兴趣,在网上查找过不少资料,看过不少的教程,最后在使用一个正则表达式工具RegexBuddy时,发现他的教程写的非常好,可以说是我目前见过最好的正则表达式教程.于是一 ...
- 如何让Linux定时任务crond以秒为单位执行(如每隔3秒)
需要用到Shell脚本每隔3秒钟去监控一个软件进程的运行状态,发现crond似乎只支持到分,不知道秒,怎么办呢? 第一种方法: 当然首先想到的是写一个触发的脚本,在触发脚本中使用死循环来解决此问题,如 ...