CODEWITHSUNDEEP
androidbitmap
n83
n83

Reputation: 237

Scale bitmap from center point in Android for zoom in effect

I am trying to scale up a bitmap from its center point in Android to achieve a zoom effect, but without success. The code I have is:

float scaleWidth = ((float) width + (i * 5)) / width;
float scaleHeight = ((float) height + (i * 5)) / height;

Matrix matrix = new Matrix();
matrix.setScale(scaleWidth, scaleHeight, scaleWidth / 2, scaleHeight / 2);
Bitmap rescaledBitmap = Bitmap.createBitmap(src, 0, 0, width, height, matrix, true);

result.add(rescaledBitmap);

I am setting the pivot point by dividing the dimensions by 2, but the effect is just that the image is scaled from 0, 0 as coordinates instead of from the center. What I want is for the image to be a fixed size, but scaled up from its center point (thus cropping the image).

Upvotes: 2

Views: 4566

Answers (3)

Noltibus
Noltibus

Reputation: 1360

Sure this will come late, but for all looking after me:

double scaleFactor = 0.75; // Set this to the zoom factor
int widthOffset = (int) ((1 - scaleFactor)/2 * bmp.getWidth());
int heightOffset = (int) ((1 - scaleFactor)/2 * bmp.getHeight());
int numWidthPixels = bmp.getWidth() - 2 * widthOffset;
int numHeightPixels = bmp.getHeight() - 2 * heightOffset;
Bitmap rescaledBitmap = Bitmap.createBitmap(bmp, widthOffset, heightOffset, numWidthPixels, numHeightPixels, null, true);

This example will zoom in on the center of a bitmap and with a factor of 25%.

Upvotes: 3

frederick_c_siu
frederick_c_siu

Reputation: 540

I'm going to offer an alternative solution using a property animator since that is a cleaner solution I think.

SomeLayout.xml (The key here is that the ViewGroup is the same size as the View, so it will clip as you requested (like google maps zoom in))

<FrameLayout
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_gravity="center">
    <View
    android:id="@+id/zoom"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:background="@drawable/myCoolImage"
    />
</FrameLayout>

Code: (the 1,2,1 will start at a scale of 1x then 2x then back to 1x, it takes a list of values)

final View view = findViewById(R.id.zoom);
view.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            final ObjectAnimator animator = ObjectAnimator.ofFloat(view, View.SCALE_X, 1, 2, 1)
                    .ofFloat(view, View.SCALE_Y, 1, 2, 1)
                    .setDuration(5000);
            animator.setInterpolator(new AccelerateDecelerateInterpolator());
            animator.start();
        }
    });

So with this version image if you had a zoom +, and zoom - views with onClickListeners, you could basically simulate the controlled zooming as long as you know what values you want to zoom with.

Also as previously noted the ViewGroup being the same size as the internal view will force the animation to clip to it's parent bounds instead of being completely visible.

References:

Google Android ObjectAnimator

Upvotes: 3

nhgrif
nhgrif

Reputation: 62052

The second and third arguments in createBitmap take the x/y coordinates of the top left corner. You're sending 0,0, so if I understand correctly...

The image is correctly scaled, but the image is not centered, right?

To center it, you need to find the correct (x,y) point for the top left corner. This should be 1/4th the original width/height.

So...

Bitmap rescaledBitmap = Bitmap.createBitmap(src, (width/2), (height/2), width, height, matrix, true);

should work.

Upvotes: 0

Related Questions