Universal Image Loader 和 View Pager 的图像缩放问题 [英] Image Zoom Issue with Universal Image Loader and View Pager

问题描述

我想在 ImagePagerActivity 中将 ImageViewZoom 与 Universal Image Loader 一起使用.

I'd like to use ImageViewZoom with Universal Image Loader in ImagePagerActivity.

我可以缩放图像，滑动到下一张图像.但是当图像处于缩放位置时，我遇到了问题.

I am able to zoom the image, Swipe to the next image. But i am facing problem when image is in Zoom position.

如果图像被缩放并且我位于中心位置，如果我想查看同一图像的右侧部分并向左滑动，它将转到下一个图像.请帮我做这件事.

if an image is zoomed and i am at center position, if i want to see the right side part of the same image and swipe left it is going to the next image. Please help me in doing this.

这是我的 XML 代码:

here is my XML code:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:padding="1dip" >

  <it.sephiroth.android.library.imagezoom.ImageViewTouch
     android:layout_weight="1"
     android:id="@+id/image"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:scaleType="fitCenter" />

  <ProgressBar
    android:id="@+id/loading"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:visibility="gone" />

</FrameLayout>

感谢 NOSTRA，现在我可以使用以下代码控制缩放和滑动.但是多点触控缩放的问题.我无法用两根手指进行缩放.

Thank you NOSTRA, Now i am able to control the zoom and slide with the below code. But the problem with Multi touch zoom. I am not able to zoom with two fingers.

这是我之前的代码(用两根手指可以正常工作):

Here is my previous code(working fine with two finger):

public class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {


        @Override
        public boolean onScale( ScaleGestureDetector detector ) {
            Log.d( LOG_TAG, "onScale" );
            float span = detector.getCurrentSpan() - detector.getPreviousSpan();
            float targetScale = mCurrentScaleFactor * detector.getScaleFactor();
            if ( mScaleEnabled ) {
                targetScale = Math.min( getMaxZoom(), Math.max( targetScale, getMinZoom()-0.1f ) );
                zoomTo( targetScale, detector.getFocusX(), detector.getFocusY() );
                mCurrentScaleFactor = Math.min( getMaxZoom(), Math.max( targetScale, getMinZoom()-1.0f ) );
                mDoubleTapDirection = 1;
                invalidate();
                return true;
            }
            return false;
        }
    }

这是修改后的:

public class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
        @Override
        public boolean onScaleBegin(ScaleGestureDetector detector) {
            externalScaleListener.onScaleBegin();
                return super.onScaleBegin(detector);
        }
        @Override
        public void onScaleEnd(ScaleGestureDetector detector) {
            externalScaleListener.onScaleEnd(mCurrentScaleFactor);
        }
    }

推荐答案

首先你必须能够听到图像的缩放.ImageViewTouch 不支持这个功能(例如 gesture-imageview 支持)所以你应该自己实现它.

First you must be able to listen scaling of image. ImageViewTouch doesn't support this feature (e.g gesture-imageview support it) so you should implement it yourself.

像这样更改 ImageViewTouch.java:

public class ImageViewTouch extends ImageViewTouchBase {

    ...

    private OnPageScaleListener externalScaleListener;

    public void setOnScaleListener(OnPageScaleListener onScaleListener) {
        this.externalScaleListener = onScaleListener;
    }

    public interface OnPageScaleListener {
        void onScaleBegin();

        void onScaleEnd(float scale);
    }

    @Override
    protected void onZoom(float scale) {
        super.onZoom(scale);
        if (!mScaleDetector.isInProgress()) {
            mCurrentScaleFactor = scale;
            externalScaleListener.onScaleEnd(scale);
        }
    }

    public class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
        @Override
        public boolean onScaleBegin(ScaleGestureDetector detector) {
            externalScaleListener.onScaleBegin();
                return super.onScaleBegin(detector);
        }

        ...

        @Override
        public void onScaleEnd(ScaleGestureDetector detector) {
            externalScaleListener.onScaleEnd(mCurrentScaleFactor);
        }
    }

    ...
}

然后在您的应用程序中使用 ViewPager 的下一个实现:

Then use next implementation of ViewPager in your application:

import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.MotionEvent;

/**
 * {@link ViewPager} which can be deactivated (ignore touch events)
 * 
 * @author Sergey Tarasevich
 * @created 19.07.2012
 */
public class DeactivableViewPager extends ViewPager {

    private boolean activated = true;

    public DeactivableViewPager(Context context) {
        super(context);
    }

    public DeactivableViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public void activate() {
        activated = true;
    }

    public void deactivate() {
        activated = false;
    }

    @Override
    public boolean onInterceptTouchEvent(MotionEvent event) {
        if (activated) {
            try {
                return super.onInterceptTouchEvent(event);
            } catch (Exception e) { // sometimes happens
                return true;
            }
        } else {
        return false;
    }
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        try {
            return super.onTouchEvent(event);
        } catch (Exception e) {
            return true;
        }
    }
}

然后在 ViewPager 的适配器中，您应该为 ImageViewTouch 设置下一个比例监听器:

Then in your ViewPager's adapter you should set next scale listener for your ImageViewTouch:

ImageViewTouch imageView = ...;
imageView.setOnScaleListener(new OnPageScaleListener() {
    @Override
    public void onScaleBegin() {
        viewPager.deactivate();
    }

    @Override
    public void onScaleEnd(float scale) {
        if (scale > 1.0) {
            viewPager.deactivate();
        } else {
            viewPager.activate();
        }
    }
});

imageLoader.displayImage(url, imageView, ...);

并且不要忘记在 ImageLoader 的配置中为 maxImage***ForMemoryCache 设置较大的值，这样 UIL 就不会在解码为位图的过程中缩小原始图像:

And don't forget set big values for maxImage***ForMemoryCache in ImageLoader's configuration so UIL won't downscale original images during decoding to Bitmaps:

ImageLoaderConfiguration config = new ImageLoaderConfiguration.Builder(getApplicationContext())
        ...
        .memoryCacheExtraOptions(3000, 3000)
        ...
        .build();

这篇关于Universal Image Loader 和 View Pager 的图像缩放问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！