Android 图片预览器加载微博长图，大图

来源：互联网发布：java web投票系统编辑：程序博客网时间：2024/05/22 11:18

通常图片预览的做法是ViewPager+PhotoView，但是遇到很长的图（比如微博长图），在设置

 android:scaleType="centerCrop"

这个属性的前提下

用ImageLoader 加载会比较模糊（应该是压缩的比较厉害），不设置这个属性，长图不能放大。用Glide加载，虽然就能清楚加载，但是不能滑动。那怎么办呢？

好在GitHub上又大神给我提供了subsampling-scale-image-view，上面介绍了基本用法，这个View能很好的加载长图的问题，在配合Glide的使用，完美的展现一个高效的图片预览，首先添加依赖：

compile 'com.github.bumptech.glide:glide:3.6.1'

 compile 'com.davemorrissey.labs:subsampling-scale-image-view:3.5.0'

创建一个包含此View的布局：

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:background="#ff000000">    <uk.co.senab.photoview.PhotoView        android:id="@+id/zoom_image_view"        android:layout_width="match_parent"        android:scaleType="centerCrop"        android:visibility="gone"        android:layout_height="match_parent" />    <com.davemorrissey.labs.subscaleview.SubsamplingScaleImageView        android:id="@+id/imageView"        android:layout_width="match_parent"        app:quickScaleEnabled="true"        android:layout_height="match_parent"/>    <ProgressBar        android:id="@+id/loading"        android:layout_width="30dp"        android:layout_height="30dp"        android:visibility="gone"        android:layout_gravity="center" /></FrameLayout>

核心代码：

 View view = inflater.inflate(R.layout.content_picture_preview,container,false);            //View view = inflater.inflate(R.layout.content_picture_preview, container, false);            //final PhotoView photoView = (PhotoView) view.findViewById(R.id.zoom_image_view) ;           // photoView.setScaleType(ImageView.ScaleType.CENTER_CROP);            //final ProgressBar spinner = (ProgressBar) view.findViewById(R.id.loading);            //photoView.setBackgroundColor(0xff000000);            String imagePath = mPaths.get(position);            final SubsamplingScaleImageView imageView =  (SubsamplingScaleImageView)view.findViewById(R.id.imageView);            //手势回调            gestureDetector = new GestureDetector(PicturePreviewActivity.this, new GestureDetector.SimpleOnGestureListener() {                @Override                public boolean onSingleTapConfirmed(MotionEvent e) {                    if (imageView.isReady()) {                        PointF sCoord = imageView.viewToSourceCoord(e.getX(), e.getY());                        Toast.makeText(getApplicationContext(), "单击: " + ((int) sCoord.x) + ", " + ((int) sCoord.y),                                Toast.LENGTH_SHORT).show();                    } else {                       // Toast.makeText(getApplicationContext(), fail_tips, Toast.LENGTH_SHORT).show();                    }                    return false;                }                @Override                public void onLongPress(MotionEvent e) {                    if (imageView.isReady()) {                        PointF sCoord = imageView.viewToSourceCoord(e.getX(), e.getY());                        Toast.makeText(getApplicationContext(), "长按: " + ((int) sCoord.x) + ", " + ((int) sCoord.y),                                Toast.LENGTH_SHORT).show();                    } else {                        //Toast.makeText(getApplicationContext(), fail_tips, Toast.LENGTH_SHORT).show();                    }                }                @Override                public boolean onDoubleTap(MotionEvent e) {                    if (imageView.isReady()) {                        PointF sCoord = imageView.viewToSourceCoord(e.getX(), e.getY());                        Toast.makeText(getApplicationContext(), "双击: " + ((int) sCoord.x) + ", " + ((int) sCoord.y),                                Toast.LENGTH_SHORT).show();                    } else {                        Toast.makeText(getApplicationContext(), "", Toast.LENGTH_SHORT).show();                    }                    return false;                }            });            imageView.setOnTouchListener(new View.OnTouchListener() {                @Override                public boolean onTouch(View view, MotionEvent motionEvent) {                    return gestureDetector.onTouchEvent(motionEvent);                }            });           final int pos = position;           // imageView.setMinimumScaleType(SubsamplingScaleImageView.SCALE_TYPE_CUSTOM);            imageView.setMaxScale(15);            imageView.setZoomEnabled(true);           // spinner.setVisibility(View.GONE);            imageView.setMinimumScaleType(SubsamplingScaleImageView.SCALE_TYPE_CUSTOM);            Glide.with(mContext)                    .load(imagePath).downloadOnly(new SimpleTarget<File>() {                @Override                public void onResourceReady(File resource, GlideAnimation<? super File> glideAnimation) {                    // 将保存的图片地址给SubsamplingScaleImageView,这里注意设置ImageViewState设置初始显示比例                    ImageSource imageSource = ImageSource.uri(Uri.fromFile(resource));                   int  sWidth = BitmapFactory.decodeFile(resource.getAbsolutePath()).getWidth();                    int sHeight = BitmapFactory.decodeFile(resource.getAbsolutePath()).getHeight();                    WindowManager wm = (WindowManager) mContext                            .getSystemService(Context.WINDOW_SERVICE);                    int width = wm.getDefaultDisplay().getWidth();                    int height = wm.getDefaultDisplay().getHeight();                    float scale = SystemUtil.displaySize.x / (float) sWidth;                    //float centerX = SystemUtil.displaySize.x / 2;                   // imageView.setImage(ImageSource.uri(Uri.fromFile(resource)), new ImageViewState(2.0F, new PointF(0, 0), 0));                    //imageView.setImage(ImageSource.uri(Uri.fromFile(resource)), new ImageViewState(2.0F, new PointF(0, 0), 0));                  if (sHeight >= height                            && sHeight / sWidth >=3) {                        imageView.setMinimumScaleType(SubsamplingScaleImageView.SCALE_TYPE_CENTER_CROP);                        imageView.setImage(ImageSource.uri(Uri.fromFile(resource)), new ImageViewState(2.0F, new PointF(0, 0), 0));                    }else {                       imageView.setMinimumScaleType(SubsamplingScaleImageView.SCALE_TYPE_CUSTOM);                       imageView.setImage(ImageSource.uri(Uri.fromFile(resource)));                       imageView.setDoubleTapZoomStyle(ZOOM_FOCUS_CENTER_IMMEDIATE);                    }                }});

Glide加载图片判断图片的宽高比例，来做相应的逻辑处理。通过

GestureDetector

来控制单击，双击，长按的逻辑控制。这样就能完美加载长图了，赶紧加入到的项目中吧！

0 0