使用开源控件图片浏览工具包:photoview_library1.2.2.jar
(1)图片查看器activity:
/******************************************************************************* * Copyright 2011, 2012 Chris Banes. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. *******************************************************************************/ package com.yiduoyun.tiku.activity; import java.util.ArrayList; import uk.co.senab.photoview.PhotoView; import uk.co.senab.photoview.PhotoViewAttacher.OnViewTapListener; import android.app.Activity; import android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.os.Bundle; import android.support.v4.view.PagerAdapter; import android.support.v4.view.ViewPager; import android.support.v4.view.ViewPager.OnPageChangeListener; import android.util.Base64; import android.view.View; import android.view.ViewGroup; import android.view.ViewGroup.LayoutParams; import android.widget.ImageView; import android.widget.ProgressBar; import android.widget.TextView; import android.widget.Toast; import com.nostra13.universalimageloader.core.DisplayImageOptions; import com.yiduoyun.tiku.R; import com.yiduoyun.tiku.common.Constant; import com.yiduoyun.tiku.util.CLog; import com.yiduoyun.tiku.util.UniversalImageLoaderUtil; /** * * 查看问题图片(使用开源代码) * * @author chenwenbiao * @date 2013-10-29 上午11:08:15 * @version V1.0 */ public class ViewImageActivity extends Activity{ private static String TAG = ViewImageActivity.class.getName(); public Context mContext; /** * 多张图片查看器 */ private ViewPager mViewPager; /** * 当前查看的是第几张图片 */ private TextView mTextViewCurrentViewPosition; /** * 图片的路径列表 */ private static ArrayList<String> imagePathList = null; private static int currentViewPosition = 0;//当前浏览到哪一张图片 private static DisplayImageOptions options = null; private static ProgressBar spinner = null; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.image_view); mContext = this; loadData(); findViews(); } private void loadData() { Bundle bundle = getIntent().getExtras(); imagePathList = bundle.getStringArrayList(Constant.TAG_VIEW_IMAGE_LIST); if(imagePathList == null){//图片路径都没有,就算了 Toast.makeText(this, "image path list is null!", Toast.LENGTH_SHORT).show(); finish(); } currentViewPosition = bundle.getInt(Constant.TAG_VIEW_IMAGE_INDEX); CLog.d(TAG, "current view position:" + currentViewPosition); } public void findViews(){ mViewPager = (ViewPager) findViewById(R.id.image_view_vp);//使用开源的图片浏览实现方式 mTextViewCurrentViewPosition = (TextView) findViewById(R.id.image_which); mViewPager.setAdapter(new SamplePagerAdapter()); spinner = (ProgressBar) findViewById(R.id.loading); /** * 这里只有多张图片才出现第几张的提示,和图片滑动切换 */ if(imagePathList.size() > 1){ /** * 设置这个,那么viewPager会将页面缓存起来,这里要注意,当设置过大时,可能会出现内存溢出 */ mViewPager.setOffscreenPageLimit(4); /** * 自己加一个页面变化的监听器,可以进页面的变化作相应的处理 */ mViewPager.setOnPageChangeListener(new OnPageChangeListener() { @Override public void onPageSelected(int position) {//当前选择的是哪个图片 // TODO Auto-generated method stub CLog.d(TAG, "currentViewPosition====>" + position); /** * 更新当前图片浏览的位置 */ currentViewPosition = position; mTextViewCurrentViewPosition.setText((currentViewPosition+1)+"/"+imagePathList.size()); } @Override public void onPageScrolled(int arg0, float arg1, int arg2) { // TODO Auto-generated method stub // Log.d(TAG, "2"); } @Override public void onPageScrollStateChanged(int arg0) { // TODO Auto-generated method stub CLog.d(TAG, "3====>" + arg0); } }); mViewPager.setCurrentItem(currentViewPosition);//设置当前显示的pager mTextViewCurrentViewPosition.setText((currentViewPosition+1)+"/"+imagePathList.size()); } }; private class SamplePagerAdapter extends PagerAdapter { @Override public int getCount() { if(imagePathList == null){ return 0; } return imagePathList.size(); } @Override public View instantiateItem(ViewGroup container, int position) { // if(imagePathList == null){ // CLog.e(TAG, "iamge path list is null!"); // return null; // } PhotoView photoView = new PhotoView(container.getContext()); CLog.d(TAG, "currentViewPosition=======>" + currentViewPosition); CLog.d(TAG, "picture path=======>" + imagePathList.get(currentViewPosition)); /** * 这里的图片分两类: * 一个是直接的图片地址 * 一个是base64格式的图片如: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFYAAAB0CAIAAACQUFKdAAAD3ElEQVR4nO3Zv0tyCxgH8PcfaWhoUF6qpQgacqwl7CSnKOlaCELRb/RGkYFWUJRLWmRCxA2SrCUa0oZqCBcNEfoBWraoUTTk4A+ovu8QN+4t6w73eArf73c6PPI8PueDnoPHH/jt8+OrF/j6kIAEJEDhCNLp9O7u7l9SZGtr6+bmpkB7onAEx8fHP3/+/FOK1NXV2Wy2Au2JwhHs7e319PRIMmp1ddVisUgyKm8KReDz+fR6vSSj7Hb71NSUJKPyhgQkIAFIABKABCABSAASgAQgAUgAEoAEIAFIABKABCABSAASgAQgAUgAEoAEIAFIABKABCABSAASgAQgAUgAEoAEIAFIABKABCABSAASgAQgAUgAEoAEIAFIABKABCABSIDCERweHhoMBklGLS8vz8zMSDIqb94SJJPJUymytLTU0NAgySij0WgwGCQZFYvFHh8fPyO4v7+vra1tkSIajUatVksyShAEQRAkGVVeXn50dPQZQSwWa2pqkujz9R0zNDS0sbHxpvgvguvr6+bmZhlXkjuDg4Obm5tviiQgAQlAApAAJAAJQAKQACQACUACkAAkAAnw/pGJRqORcSW5YzKZ/uORyd3dXUVFxR/FG6VS6fV6PyN4fn6+uLg4Lt6EQqFsNvsZwe8ZEpCABCABSAASgAQgAUgAEuAbEsTjcZnf8QsIXC7XxMSE2Wy2WCyzs7NWq9VqtVosFrPZ3NnZqVAoAoGAnPvITZBOpysrK+12u9PpHB8fLysrs1qt09PTL5WRkZHq6urz8/O8vblcrhAryU3w8PAgCMLLsdvtLikp6e3t7ejoGB4eBnB6etrV1fW+KxwOOxyO7u7uQqwkN0EqlWpsbASws7Oj1+sHBgb8fv/CwsLKygoAv9+v1Wrfd7ndbo1G82onbb6AQKvVejye0dFRAPF4XKvVOhyOl1fD4XBeAgDRaLS9vb0QK33BF0EUxUwmA8Dn883NzW1vb9tsNrfbvb+/b7PZPjrPYDBYJATZbLampmZsbMxsNvf395tMJqvVGo1G+/r6SktLq6qq8l4LUEwE6XRapVK5XK61tTUAoVDI6XTOz88DuLy8PDg40Ol0eRuLh+Cfd4REItHa2rq4uOjxeF4qgUDgo/M8OTkpEoJUKqVWq5+enl4r6+vrSqXy5TgYDH50OQyHw21tbYVYSW6CXC6nUCgEQRBFURTFlpYWnU73WlGpVHnvfC6Xq76+XqFQiKJ4dXUl7UpyE2QyGaPReHZ2Fvk70Wg0mUxGo9FIJOL1eicnJ9933d7exmKxRCIRiUTe/xHwP/PtfibJHxKQgAQAfgEhmFtu4GQ2NAAAAABJRU5ErkJggg== */ String url = imagePathList.get(position).trim(); int index = url.indexOf("base64,"); if(-1 != index){ String base64Data = url.substring(index + 7); byte[] bytes = Base64.decode(base64Data, Base64.DEFAULT); Bitmap bitmap = BitmapFactory.decodeByteArray(bytes, 0, bytes.length); photoView.setImageBitmap(bitmap); } else { UniversalImageLoaderUtil.getInstance().display(url , photoView, options, spinner , false); } /*//监听图片区域动作 photoView.setOnPhotoTapListener(new OnPhotoTapListener() { @Override public void onPhotoTap(View arg0, float arg1, float arg2) { ((Activity)mContext).finish(); } });*/ //监听整个显示区域动作 photoView.setOnViewTapListener(new OnViewTapListener() { @Override public void onViewTap(View arg0, float arg1, float arg2) { ((Activity)mContext).finish(); } }); /** * 这个是让小图保持原形,不充满全屏的关键 */ photoView.setScaleType(ImageView.ScaleType.CENTER); container.addView(photoView, LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); // container.addView(photoView); return photoView; } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView((View) object); } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } } }
这里值得注意是当图片很小时,为了图片不被拉大,需要如下设置一下:
/** * 这个是让小图保持原形,不充满全屏的关键 */ photoView.setScaleType(ImageView.ScaleType.CENTER);
设置点击操作区域是整个activity:
//监听整个显示区域动作 photoView.setOnViewTapListener(new OnViewTapListener() { @Override public void onViewTap(View arg0, float arg1, float arg2) { ((Activity)mContext).finish(); } });
若点击操作希望只是图片区域,则可以如下设置:
//监听图片区域动作 photoView.setOnPhotoTapListener(new OnPhotoTapListener() { @Override public void onPhotoTap(View arg0, float arg1, float arg2) { ((Activity)mContext).finish(); } });
(2)布局文件image_view.xml:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="fill_parent" android:orientation="vertical" android:background="@color/white" > <com.yiduoyun.tiku.view.HackyViewPager android:id="@+id/image_view_vp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" > </com.yiduoyun.tiku.view.HackyViewPager> <ProgressBar android:id="@+id/loading" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:layout_gravity="center" android:visibility="gone" /> <TextView android:id="@+id/image_which" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:gravity="center_horizontal" android:paddingBottom="10dip" /> </RelativeLayout>
调用该activity来查看图片:
Intent intent = new Intent(getActivity(), ViewImageActivity.class); // Intent intent = new Intent(getActivity(), SimpleSampleActivity.class); Bundle bundle = new Bundle(); ArrayList<String> imageList = new ArrayList<String>(); imageList.add(imgSrc); bundle.putStringArrayList(Constant.TAG_VIEW_IMAGE_LIST, imageList); bundle.putInt(Constant.TAG_VIEW_IMAGE_INDEX, 0); intent.putExtras(bundle); startActivity(intent);
根据photoview例子改造后的photoview就完成了,实现效果跟微信图片查看类似。
相关推荐
这个是本人项目上使用的一个封装好的图片查看器:photoview的jar只需要导入项目就可以使用。里面包含源码。可对图片放大缩小。
viewpager+photoview自带圆点支持放大缩小,仿微信朋友圈图片查看器,自定义dialog [注意:本资源来自网络,如有侵权,请联系我删除,谢谢。]
photoview +viewpager 滑动 支持图片放大查看,Glide框架加载图片。
主要为大家详细介绍了viewpager+photoview实现图片查看器,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
kotlin练习项目,kotlin练习项目,kotlin练习项目,kotlin练习项目,kotlin练习项目,kotlin练习项目,kotlin练习项目,kotlin练习项目,
viewpager+photoview自带圆点支持放大缩小,仿微信朋友圈图片查看器,自定义dialog,项目中很实用。
实用viewpager+photoview实现图片左右滑动,缩放,自动恢复原图,拖拽,点击事件,长按事件等操作;
AXPhotoViewer 一个iOS照片查看器,用于查看非常大(或非常小的)数量的图像和GIF。 这个库支持上下文展现和解雇,互动的“轻弹到剔除”行为,并且轻松地与许多第三方异步图像下载/缓存库集成。
图像查看器图片查看器这是一个 ImageViewer,您可以为其设置一些参数,这将在您设置时显示。 更多的东西将添加到项目中。 该项目基于 Universal ImageLoader 和 PhotoView。 现在项目得到了它的基本功能。
图片浏览器,支持缩放,下拉缩小退出(效果同微信图片浏览)
该demo使用DrawerLayout实现了侧滑栏效果,RecyclerView+CardView实现瀑布流效果,glide实现图片加载,photoView实现了图片的查看效果,HorizontalScrollView+RadioGroup实现了横向滑动显示,类似于某视频网站的视频...
使用duilib实现的类似qq图片查看器。
资源名称:viewpager+photoview自带圆点支持放大缩小,仿微信朋友圈图片查看器 资源介绍:viewpager+photoview自带圆点支持放大缩小,仿微信朋友圈图片查看器,自定义dialog,项目中很实用。 文件名称:picShow.zip ...
图片查看器
即使使用起来非常简单,PhotoView仍可以通过其选项和控制器进行自定义。 安装 在您的pubspec.yaml文件中添加photo_view作为依赖项( )。 导入照片视图: import 'package:photo_view/photo_view.dart' ; 文件和...
常见应用场景如微信朋友圈照片九宫格和微信聊天图片,视频,gif预览,某些手机系统相册等viewpager图片查看 缩放 拖拽下拉缩小退出(效果同微信图片浏览) 特点 1.支持自定义图片加载框架。 2.支持重写activity,...
并对图片进行缓存使用到ViewPagerIndicator实现图片指示用到的开源框架有:PhotoView 图片缩放:支持双击缩放,手指捏拉缩放Universalimageloader 图片下载缓存库ViewPagerIndicator 分页指示器
mojito 功能列表支持Coil图片加载器支持Glide图片加载器支持Fresco图片加载器支持视频图片混合、GIF、图片预览支持拖拽关闭支持自定义页面索引指示器、进度条、Cover支持原图加载策略二维码下载体验通过视频查看效果...
*“通用 - 图片下载器”由格克汗Akkurt *“PinEntry”由webile - 机器人 *“UrlImageViewHelper”由KOUSHIK杜塔 *“ParallaxScrollView”由克里斯托弗·詹金斯 *“LazyList”由费多尔弗拉索夫 *...