如何使用矩阵比例尺中心imageView?

时间:2016-05-17 07:42:59

标签: android imageview position image-zoom scaletype

我使用 Android Studio 来显示 imageView 。我使用捏拉缩放与我的ImageView进行交互。

代码:

private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener{
    @Override
    public boolean onScale(ScaleGestureDetector detector) {
        scale = scale * detector.getScaleFactor();
        scale = Math.max(0.1f, Math.min(scale, 5f));
        matrix.setScale(scale, scale);

        imageView.setImageMatrix(matrix);
        return true;
    }
}

@Override
public boolean onTouchEvent(MotionEvent event) {
    scaleGestureDetector.onTouchEvent(event);
    return true;
}

缩放很好,但问题是imageview的位置,它被卡在左上角。尝试布局更改但无关。经过一些研究后,我在论坛ImageView Center in position with ScaleType MatrixCenter the image in ImageView after zoom-pinch中看到了这些链接,但这些解决方案都不起作用,我还检查了内部给出的链接。

帮助将不胜感激,

谢谢!

编辑:添加了关于我如何获取ImageView的代码

Picasso.with(this).load(url).resize(350, 330).centerInside().into(imageView);

onCreate Code

onCreate

ScaleListner类和手势代码

listener

1 个答案:

答案 0 :(得分:7)

    Picasso.with(this).load(url).into(imageView, new Callback.EmptyCallback() {
        @Override
        public void onSuccess() {
            Drawable d = imageView.getDrawable();
            // TODO: check that d isn't null

            RectF imageRectF = new RectF(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());
            RectF viewRectF = new RectF(0, 0, imageView.getWidth(), imageView.getHeight());
            matrix.setRectToRect(imageRectF, viewRectF, ScaleToFit.CENTER);
            imageView.setImageMatrix(matrix);
        }
    });

编辑2:

如何将图像居中,如CENTER_INSIDE,但使用矩阵:

首先我们需要一个带图像尺寸的矩形:

    Drawable d = imageView.getDrawable();
    // TODO: check that d isn't null

    RectF imageRectF = new RectF(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());

接下来,您需要一个包含视图尺寸的矩形:

    RectF viewRectF = new RectF(0, 0, imageView.getWidth(), imageView.getHeight());

现在我们在矩阵上运行一个方法,将图像置于视图中心:

    matrix.setRectToRect(imageRectF, viewRectF, ScaleToFit.CENTER);

这样做是设置矩阵,以便第一个矩形将变换为第二个矩形。 ScaleToFit.CENTER将保留宽高比,并与缩放类型CENTER_INSIDE具有相同的效果。

所以如果你打电话

    imageView.setImageMatrix(matrix);

此时,您将拥有居中的图像。

编辑:我认为你差不多了。

您的矩阵将撤消毕加索所做的图像居中,因此您需要在缩放之前进行平移以使图像居中。

    @Override
    public boolean onScale(ScaleGestureDetector detector) {

        Drawable d = imageView.getDrawable();
        // if d is null, then Picasso hasn't loaded the image yet

        float offsetX = (imageView.getWidth() - d.getIntrinsicWidth()) / 2F;
        float offsetY = (imageView.getHeight() - d.getIntrinsicHeight()) / 2F;

        float centerX = imageView.getWidth() / 2F;
        float centerY = imageView.getHeight() / 2F;

        // note that these offset and center values don't change with the scaling, 
        // so you can calculate them somewhere else and then use them here.

        scale *= detector.getScaleFactor();
        scale = Math.max(0.1f, Math.min(scale, 5f));

        matrix.setScale(scale, scale, centerX, centerY);
        matrix.preTranslate(offsetX, offsetY);

        imageView.setImageMatrix(matrix);
    }

您正在使用setScale(float sx, float sy)。还有另一个版本setScale(float sx, float sy, float px, float py),其中px,py是枢轴点

因此,如果您想使图像居中,请确定视图的中心,并使用x,y值作为轴心点。

您还需要将图像置于视图中心,因此在缩放之前需要先移动图像。

    float offsetX = (imageView.getWidth() - bitmap.getIntrinsicWidth()) / 2F;
    float offsetY = (imageView.getHeight() - bitmap.getIntrinsicHeight()) / 2F;

    float centerX = imageView.getWidth() / 2F;
    float centerY = imageView.getHeight() / 2F;

    matrix.setScale(scale, scale, centerX, centerY);
    matrix.preTranslate(offsetX, offsetY);