Search code examples
androidimageviewontouchlistenertouch-event

How to set Image align to parent when ScaleType is matrix


I have an imageview which I want to rotate, zoom and scale down or up and drag on user touch. So far all things are working perfect and in good way.

I have followed this code and some code others to get best result. now I want the image that is to be drag , move , zoom and rotate should be align to parents bottom. but when I Apply scale type to matrix the image shows on the top left corner on the screen when the screen is started. here is part of this code and you can also check in the link I shared, that guy is also using matrix as a scale type.

<ImageView
            android:id="@+id/iv_overlay"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_alignParentBottom="true"
            android:src="@drawable/groom01"
            android:scaleType="matrix"
            />

if I remove the matrix as scale type it comes down but in the center but not in the bottom. and as i touch the imageview its looks like the matrixs get applied the picture flickers for a single sharp moment and comes again where we touch.

The flickering i due to the matrixs I believe which is set in the code also ,I think the image tries to go to left top of screen but comes down where we have clicked.

here is the part in on touch

@Override
    public boolean onTouch(View v, MotionEvent event) {

        ImageView view = (ImageView) v;

        view.setScaleType(ImageView.ScaleType.MATRIX);

        float scale;

        // Dump touch event to log
       // dumpEvent(event1);

        // Handle touch events here...
        switch (event.getAction() & MotionEvent.ACTION_MASK) {
            case MotionEvent.ACTION_DOWN: //first finger down only
                savedMatrix.set(matrix);
                start.set(event.getX(), event.getY());
                Log.d(TAG, "mode=DRAG" );
                mode = DRAG;
                break;

            case MotionEvent.ACTION_POINTER_DOWN:
                oldDist = spacing(event);
                if (oldDist > 10f) {
                    savedMatrix.set(matrix);
                    midPoint(mid, event);
                    mode = ZOOM;
                }
                lastEvent = new float[4];
                lastEvent[0] = event.getX(0);
                lastEvent[1] = event.getX(1);
                lastEvent[2] = event.getY(0);
                lastEvent[3] = event.getY(1);
                d = rotation(event);
                break;

            case MotionEvent.ACTION_UP: //first finger lifted
            case MotionEvent.ACTION_POINTER_UP: //second finger lifted
                mode = NONE;
                Log.d(TAG, "mode=NONE" );
                break;


            case MotionEvent.ACTION_MOVE:
                if (mode == DRAG) {
                    toggleSaveButtonState();
                    // ...
                    matrix.set(savedMatrix);
//                    matrix.postTranslate(event.getX() - start.x, event.getY()
//                            - start.y);

                    matrix.getValues(matrixValues);
                    matrixX = matrixValues[2];
                    matrixY = matrixValues[5];
                    width = matrixValues[0] * (((view).getDrawable()
                            .getIntrinsicWidth() / 2));
                    height = matrixValues[4] * (((view).getDrawable()
                            .getIntrinsicHeight() / 2));

                    dx = event.getX() - start.x;
                    dy = event.getY() - start.y;
                    float newX = event.getX() - start.x;
                    Log.v("bounds out", "matrixsX=" + matrixX+ " dx" + dx);
                            //if image will go outside left bound
                    if (matrixX + dx < 0-width){
                        dx = -matrixX-width;


                        Log.v("bounds", "matrixsX=" + matrixX + " dx" + dx + " width" + width + "image width  = " + view.getWidth()/2);
//                        if (dx != -0.0) {
//
//                            //  dx=(float)-0.0;
//                        }}
                         }
                    //if image will go outside right bound
                    if (matrixX + dx + width > view.getWidth()) {
                        dx = view.getWidth() - matrixX - width;

                        Log.v("bounds", "matrixsX=" + matrixX + " dx" + dx + " width" + width + "image width  = " + view.getWidth());
                    }
                    //if image will go oustside top bound
                    if (matrixY + dy < 0) {
                        dy = -matrixY;

                    }
                    //if image will go outside bottom bound
                    if (matrixY + dy + height > view.getHeight()) {
                        dy = view.getHeight() - matrixY - height;

                    }
                    matrix.postTranslate(dx, dy);

                } else if (mode == ZOOM && event.getPointerCount() == 2) {
                    float newDist = spacing(event);
                    matrix.set(savedMatrix);
                    if (newDist > 10f) {
                        scale = newDist / oldDist;
                        float[] values = new float[9];
                        matrix.getValues(values);
                        float currentScale = values[Matrix.MSCALE_X];
                        if (scale * currentScale > MAX_ZOOM) {
                            scale = MAX_ZOOM / currentScale;
                        }
                        else if (scale * currentScale < MIN_ZOOM)
                        {   scale = MIN_ZOOM / currentScale;}

                        matrix.postScale(scale, scale, mid.x, mid.y);
                    }
                    if (lastEvent != null) {
                        newRot = rotation(event);
                        float r = newRot - d;
                        matrix.postRotate(r, view.getMeasuredWidth() / 2,
                                view.getMeasuredHeight() / 2);
                    }
                }
                break;

        }

you can see the second line is

view.setScaleType(ImageView.ScaleType.MATRIX); so if I do comment it , then Image view is unable to move rotate or to do anything.

so what I am supposed to do in this condition ? How can I set it to the bottom of screen and when the user touch it , he may be able to take it anywhere where he wants . Please show me a way to do it.


Solution

  • Just move image initially using matrix.postTranslate(leftOffset, topOffset); after it loaded.

    See more info here