使用Ion创建圆形ImageView

Question

我正在使用Ion https://github.com/koush/ion来加载我的应用程序中的图像。

我需要使用Transform将一些图像变成圆形，但是在Google上我遇到了一些崩溃问题，我想永远解决这个错误。

我该如何解决这个问题？

以下是我的类：

public class CircleTransform implements Transform {

@Override
public Bitmap transform(Bitmap source) {
    int size = Math.min(source.getWidth(), source.getHeight());

    /* int x = (source.getWidth() - size) / 2 */;
    /* int y = (source.getHeight() - size) / 2 */;

    int x = (source.getWidth() - size);
    int y = (source.getHeight() - size);

    Bitmap squaredBitmap = Bitmap.createBitmap(source, x, y, size, size);
    if (squaredBitmap != source) {
        source.recycle();
    }

    Bitmap bitmap = Bitmap.createBitmap(size, size, source.getConfig());

    Canvas canvas = new Canvas(bitmap);
    Paint paint = new Paint();
    BitmapShader shader = new BitmapShader(squaredBitmap,
            BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP);
    paint.setShader(shader);
    paint.setAntiAlias(true);

    float r = size / 2f/* 2f */;
    canvas.drawCircle(r, r, r, paint);

    squaredBitmap.recycle();
    return bitmap;
}

@Override
public String key() {
    return "circle";
}
}

这是我遇到的崩溃信息：

  java.lang.RuntimeException: Canvas: trying to use a recycled bitmap android.graphics.Bitmap@41ff4570
 at android.graphics.Canvas.throwIfCannotDraw(Canvas.java:1084)
 at android.view.GLES20Canvas.drawBitmap(GLES20Canvas.java:844)
 at com.koushikdutta.ion.IonDrawable.draw(IonDrawable.java:673)
 at android.widget.ImageView.onDraw(ImageView.java:1019)
 at android.view.View.draw(View.java:14728)
 at android.view.View.getDisplayList(View.java:13588)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.View.draw(View.java:14430)
 at android.view.ViewGroup.drawChild(ViewGroup.java:3252)
 at android.view.ViewGroup.dispatchDraw(ViewGroup.java:3070)
 at android.view.View.getDisplayList(View.java:13580)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.View.draw(View.java:14430)
 at android.view.ViewGroup.drawChild(ViewGroup.java:3252)
 at android.view.ViewGroup.dispatchDraw(ViewGroup.java:3070)
 at android.view.View.draw(View.java:14739)
 at android.view.View.getDisplayList(View.java:13588)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.View.draw(View.java:14430)
 at android.view.ViewGroup.drawChild(ViewGroup.java:3252)
 at android.view.ViewGroup.dispatchDraw(ViewGroup.java:3070)
 at android.view.View.getDisplayList(View.java:13580)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.View.draw(View.java:14430)
 at android.view.ViewGroup.drawChild(ViewGroup.java:3252)
 at android.view.ViewGroup.dispatchDraw(ViewGroup.java:3070)
 at android.view.View.getDisplayList(View.java:13580)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.View.draw(View.java:14430)
 at android.view.ViewGroup.drawChild(ViewGroup.java:3252)
 at android.view.ViewGroup.dispatchDraw(ViewGroup.java:3070)
 at android.view.View.getDisplayList(View.java:13580)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.View.draw(View.java:14430)
 at android.view.ViewGroup.drawChild(ViewGroup.java:3252)
 at android.view.ViewGroup.dispatchDraw(ViewGroup.java:3070)
 at android.view.View.getDisplayList(View.java:13580)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.View.draw(View.java:14430)
 at android.view.ViewGroup.drawChild(ViewGroup.java:3252)
 at android.widget.ListView.drawChild(ListView.java:3387)
 at android.view.ViewGroup.dispatchDraw(ViewGroup.java:3070)
 at android.widget.AbsListView.dispatchDraw(AbsListView.java:2554)
 at android.widget.ListView.dispatchDraw(ListView.java:3382)
 at android.view.View.draw(View.java:14739)
 at android.widget.AbsListView.draw(AbsListView.java:4093)
 at android.view.View.getDisplayList(View.java:13588)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3226)
 at android.view.View.getDisplayList(View.java:13509)
 at android.view.View.getDisplayList(View.java:13635)
 at android.view.HardwareRenderer$GlRenderer.buildDisplayList(HardwareRenderer.java:1627)
 at android.view.HardwareRenderer$GlRenderer.draw(HardwareRenderer.java:1506)
 at android.view.ViewRootImpl.draw(ViewRootImpl.java:2722)
 at android.view.ViewRootImpl.performDraw(ViewRootImpl.java:2587)
 at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:2210)
 at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1189)
 at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:6223)
 at android.view.Choreographer$CallbackRecord.run(Choreographer.java:788)
 at android.view.Choreographer.doCallbacks(Choreographer.java:591)
 at android.view.Choreographer.doFrame(Choreographer.java:560)
 at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:774)
 at android.os.Handler.handleCallback(Handler.java:808)
 at android.os.Handler.dispatchMessage(Handler.java:103)
 at android.os.Looper.loop(Looper.java:193)
 at android.app.ActivityThread.main(ActivityThread.java:5292)
 at java.lang.reflect.Method.invokeNative(Native Method)
 at java.lang.reflect.Method.invoke(Method.java:515)
 at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:824)
 at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:640)
 at dalvik.system.NativeStart.main(Native Method)

- Jehad

---

http://stackoverflow.com/a/27438246/1318946 - Pratik Butani

不，它与Ion库不兼容。 - Jehad

我正在寻找一种方法来修复这个问题或在ion中实现它。 - koush

Answer 1

我刚刚为RoundedImageView添加了支持。 https://github.com/koush/ion/blob/master/ion-sample/src/com/koushikdutta/ion/sample/RoundedImageViewSample.java

- koush

Answer 2

也许你不想使用另一个库。这是我的解决方案：

Ion.with(imageview)
            .error(R.drawable.img)
            .placeholder(R.drawable.img)
            .transform(new Transform() {
                @Override
                public Bitmap transform(Bitmap b) {
                    return ImageUtil.createCircleBitmap(b);
                }

                @Override
                public String key() {
                    return null;
                }
            })
            .load(url);

而在ImageUtil中：

public static Bitmap createCircleBitmap(Bitmap bitmap){
    //设置一个与位图同样大小的新位图
    Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(),
            Bitmap.Config.ARGB_8888);

    //设置一个图片大小的矩形
    final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
    Canvas canvas = new Canvas(output);
    final Paint paint = new Paint();
    paint.setAntiAlias(true);
    int halfWidth = bitmap.getWidth()/2;
    int halfHeight = bitmap.getHeight()/2;
    canvas.drawCircle(halfWidth, halfHeight, Math.max(halfWidth, halfHeight), paint);
    //设置为取两层图像交集部门,只显示上层图像
    paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
    //画图像
    canvas.drawBitmap(bitmap, rect, rect, paint);
    return output;
}

这对我有用。但是我不知道在Ion transform中key方法的含义是什么。有人能告诉我吗？

- howerknea

Answer 3

这是我一直在使用的方法：

首先创建一个新的ImageView类，继承默认的ImageView类，我称之为：ImageViewRounded。以下是实现代码：

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PorterDuff.Mode;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.drawable.BitmapDrawable;
import android.util.AttributeSet;
import android.widget.ImageView;

public class ImageViewRounded extends ImageView {

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

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

    public ImageViewRounded(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        BitmapDrawable drawable = (BitmapDrawable) getDrawable();

        if (drawable == null) {
            return;
        }

        if (getWidth() == 0 || getHeight() == 0) {
            return;
        }

        Bitmap fullSizeBitmap = drawable.getBitmap();

        int scaledWidth = getMeasuredWidth();
        int scaledHeight = getMeasuredHeight();

        Bitmap mScaledBitmap;
        if (scaledWidth == fullSizeBitmap.getWidth()
                && scaledHeight == fullSizeBitmap.getHeight()) {
            mScaledBitmap = fullSizeBitmap;
        } else {
            mScaledBitmap = Bitmap.createScaledBitmap(fullSizeBitmap,
                    scaledWidth, scaledHeight, true /* filter */);
        }

        // Bitmap roundBitmap = getRoundedCornerBitmap(mScaledBitmap);

        // Bitmap roundBitmap = getRoundedCornerBitmap(getContext(),
        // mScaledBitmap, 10, scaledWidth, scaledHeight, false, false,
        // false, false);
        // canvas.drawBitmap(roundBitmap, 0, 0, null);

        Bitmap circleBitmap = getCircledBitmap(mScaledBitmap);

        canvas.drawBitmap(circleBitmap, 0, 0, null);

    }

    public Bitmap getRoundedCornerBitmap(Context context, Bitmap input,
            int pixels, int w, int h, boolean squareTL, boolean squareTR,
            boolean squareBL, boolean squareBR) {

        Bitmap output = Bitmap.createBitmap(w, h, Config.ARGB_8888);
        Canvas canvas = new Canvas(output);
        final float densityMultiplier = context.getResources()
                .getDisplayMetrics().density;

        final int color = 0xff424242;

        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, w, h);
        final RectF rectF = new RectF(rect);

        // make sure that our rounded corner is scaled appropriately
        final float roundPx = pixels * densityMultiplier;

        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
        canvas.drawRoundRect(rectF, roundPx, roundPx, paint);

        // draw rectangles over the corners we want to be square
        if (squareTL) {
            canvas.drawRect(0, 0, w / 2, h / 2, paint);
        }
        if (squareTR) {
            canvas.drawRect(w / 2, 0, w, h / 2, paint);
        }
        if (squareBL) {
            canvas.drawRect(0, h / 2, w / 2, h, paint);
        }
        if (squareBR) {
            canvas.drawRect(w / 2, h / 2, w, h, paint);
        }

        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(input, 0, 0, paint);

        return output;
    }

    Bitmap getCircledBitmap(Bitmap bitmap) {

        Bitmap result = Bitmap.createBitmap(bitmap.getWidth(),
                bitmap.getHeight(), Config.ARGB_8888);






        Canvas canvas = new Canvas(result);

        int color = Color.BLUE;
        Paint paint = new Paint();
        Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());

        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
//        canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
        canvas.drawCircle(bitmap.getWidth()/2, bitmap.getHeight()/2, bitmap.getHeight()/2, paint);

        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);



        return result;
    }

}

---

在您的布局中，将图像视图替换为新的ImageViewRounded，如下所示：

<com.sampleproject.ImageViewRounded
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:id="@+id/myImage"
        android:src="@drawable/no_photo_icon"
        android:layout_marginRight="2dp"/>

---

最后，在我的ArrayAdapter的getView方法中加载图像时，我会执行以下操作：

ImageView myImage=findViewById(R.id.myImage);
    Ion.with(context)
                    .load(your image url here)
                    .withBitmap().asBitmap()
                    .setCallback(new FutureCallback<Bitmap>() {
                        @Override
                        public void onCompleted(Exception e, Bitmap result) {
                            myImage.setImageBitmap(result);
                        }
                    });

Chale，你完成了！

- Andrew Sam