在android上转换原始位图(Transform original bitmap on android)

在android上转换原始位图(Transform original bitmap on android)

所以，我正在使用这个库https://github.com/thuytrinh/android-collage-views为我的ImageView添加“MultiTouchListener”功能。 基本上我允许用户使用旋转，缩放和翻译来修改照片以满足他的需求。 现在唯一的问题是如何保存它。 我是这样做的：

Bitmap bitmap = Bitmap.createBitmap(imageContainer.getWidth(), imageContainer.getHeight(), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(bitmap); canvas.drawColor(Color.WHITE); imageContainer.draw(canvas);

它有效，但图像不够大 - 它与手机上的视图一样大，因此取决于屏幕分辨率。 我想在全尺寸的给定位图上“应用”这些转换。 我希望转换后的图像看起来像在屏幕上（因此它需要将所有内容裁剪出屏幕）

我尝试了以下方法：

Bitmap newBitmap = Bitmap.createBitmap(image.getWidth(), image.getHeight(), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(newBitmap); canvas.drawColor(Color.WHITE); Paint paint = new Paint(); paint.setAntiAlias(true); canvas.drawBitmap(image, imageView.getMatrix(), paint);

但它看起来并不像预期的那样。

用户界面：

并输出图像（没有裁剪，因为我不想要裁剪哪一面）：

我怎样才能解决这个问题？ 有什么解决方案吗？

So, I'm using this library https://github.com/thuytrinh/android-collage-views to add "MultiTouchListener" feature to my ImageView. Basically I let user to modify a photo to his needs using rotation, scale and translation. Now the only problem is how to save it. I did it like this:

Bitmap bitmap = Bitmap.createBitmap(imageContainer.getWidth(), imageContainer.getHeight(), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(bitmap); canvas.drawColor(Color.WHITE); imageContainer.draw(canvas);

It works, but image is not big enough - it's as big as view on phone so it depends on screen resolution. And I want to "apply" these transformations on given bitmap with full size. And I want transformed image to look like on screen (so it'll need to crop everything out of screen)

I tried the following:

Bitmap newBitmap = Bitmap.createBitmap(image.getWidth(), image.getHeight(), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(newBitmap); canvas.drawColor(Color.WHITE); Paint paint = new Paint(); paint.setAntiAlias(true); canvas.drawBitmap(image, imageView.getMatrix(), paint);

But it doesn't look as expected.

User screen:

And output image (without cropping, because I don't want which side I should crop):

How can I fix this? Is there any solution?

最满意答案

这是一种方法，绝对不是完美的，但应该给你一个良好的开端：

在此， container指的是包含转换后的ImageView的视图，屏幕截图上的手机外壳和src原始源位图。

首先，您需要计算输出位图的所需宽度和高度，即在保持容器比率的同时使图像适合的大小：

float containerWidth = containerView.getWidth(); float containerHeight = containerView.getHeight(); float srcWidth = src.getWidth(); float srcHeight = src.getHeight(); float containerRatio = containerWidth / containerHeight; float srcRatio = srcWidth / srcHeight; float outputWidth, outputHeight; if(srcRatio > containerRatio) { //fits in width outputWidth = srcWidth; outputHeight = srcWidth / containerRatio; } else if(srcRatio < containerRatio) { //fits in height outputHeight = srcHeight; outputWidth = srcHeight * containerRatio; } else { outputWidth = srcWidth; outputHeight = srcHeight; }

将容器宽度/高度和输出宽度/高度之间的比率应用于包含用户所做转换的矩阵的平移部分

float containerToOutputRatioWidth = outputWidth / containerWidth; float containerToOutputRatioHeight = outputHeight / containerHeight; float[] values = new float[9]; transformedImageView.getMatrix().getValues(values); values[2] = values[2] * containerToOutputRatioWidth; values[5] = values[5] * containerToOutputRatioHeight; Matrix outputMatrix = new Matrix(); outputMatrix.setValues(values);

使用正确的大小（outputWidth，outputHeight）和矩阵（outputMatrix）绘制输出位图。

Bitmap newBitmap = Bitmap.createBitmap(Math.round(outputWidth), Math.round(outputHeight), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(newBitmap); canvas.drawColor(Color.WHITE); Paint paint = new Paint(); paint.setAntiAlias(true); canvas.drawBitmap(src, outputMatrix, paint);

。

警告

你应该小心内存分配，这段代码会导致分配一些大量的位图，你应该实现某种与你的需求相适应的限制。 （也在后台进行分配和绘图）

您可能需要进行一些调整，具体取决于您首先放置图像的位置。

Here is one way to do it, definitely not perfect but should give you a good start :

In this, container refers to the view that contains the transformed ImageView, the phone case on your screenshot and src the raw source bitmap.

First, you need to compute the desired width and height of the output bitmap, i.e the size it would be to make the image fit in it while keeping the ratio of the container :

float containerWidth = containerView.getWidth(); float containerHeight = containerView.getHeight(); float srcWidth = src.getWidth(); float srcHeight = src.getHeight(); float containerRatio = containerWidth / containerHeight; float srcRatio = srcWidth / srcHeight; float outputWidth, outputHeight; if(srcRatio > containerRatio) { //fits in width outputWidth = srcWidth; outputHeight = srcWidth / containerRatio; } else if(srcRatio < containerRatio) { //fits in height outputHeight = srcHeight; outputWidth = srcHeight * containerRatio; } else { outputWidth = srcWidth; outputHeight = srcHeight; }

Apply the ratio between container width/height and output width/height to the translation part of the matrix that hold the transformation that the user did

float containerToOutputRatioWidth = outputWidth / containerWidth; float containerToOutputRatioHeight = outputHeight / containerHeight; float[] values = new float[9]; transformedImageView.getMatrix().getValues(values); values[2] = values[2] * containerToOutputRatioWidth; values[5] = values[5] * containerToOutputRatioHeight; Matrix outputMatrix = new Matrix(); outputMatrix.setValues(values);

Draw the output bitmap as you were doing with the correct size (outputWidth, outputHeight) and matrix (outputMatrix).

Bitmap newBitmap = Bitmap.createBitmap(Math.round(outputWidth), Math.round(outputHeight), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(newBitmap); canvas.drawColor(Color.WHITE); Paint paint = new Paint(); paint.setAntiAlias(true); canvas.drawBitmap(src, outputMatrix, paint);

.

Warnings

You should be careful about memory allocation, this code will lead to allocate some massive bitmaps, you should implement some kind of limit that get along with your needs. (Also do allocation and drawing in background)

You might need to do some adjustment depending on where you place the image in the first place.