繁体   English   中英

使图像视图变圆(不是图像)

[英]Make Image view rounded (not the image)

要求是:

要求1:从网址获取图片

R2:将它们保存在缓存中

R3:使ImageView舍入而不是图像

因此,对于R1和R2,我找到了一个库: http : //loopj.com/android-smart-image-view/

对于R3,我已经做了很多研发工作,发现的所有内容都会转换图像而不是ImageView。 这是我搜索的内容:

使用圆角背景蒙版ImageView

如何制作带有圆角的ImageView?

https://github.com/vinc3m1/RoundedImageView

https://github.com/lopspower/CircularImageView

我知道可以使用ImageView位图并将图像四舍五入,但是对于我想使用的特定库,这是不可能的(对于非常复杂的线程来说可能)。

因此,请帮助我将ImageView舍入而不是四舍五入。

所以这是简约的版本:

class RoundImageView extends ImageView {
    private static final int RADIUS = 32;
    private Paint mPaint;
    private Paint mSrcIn;
    private RectF mRect;

    public RoundImageView(Context context) {
        super(context);
//        setBackgroundColor(0xffffffff);
        mSrcIn = new Paint();
        mSrcIn.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mRect = new RectF();
    }

    @Override
    public void onDraw(Canvas canvas) {
        Drawable dr = getDrawable();
        if (dr != null) {
            mRect.set(dr.getBounds());
            getImageMatrix().mapRect(mRect);
            mRect.offset(getPaddingLeft(), getPaddingTop());

            int rtc = canvas.saveLayer(mRect, null, Canvas.ALL_SAVE_FLAG);
            // draw DST
            canvas.drawRoundRect(mRect, RADIUS, RADIUS, mPaint);

            canvas.saveLayer(mRect, mSrcIn, Canvas.ALL_SAVE_FLAG);
            // draw SRC
            super.onDraw(canvas);
            canvas.restoreToCount(rtc);
        }
    }
}

或在不使用硬件加速的情况下使用甚至更短的一种,则可以使用Canvas.clipPath:

class RoundImageViewClipped extends ImageView {
    private static final int RADIUS = 32;
    private RectF mRect;
    private Path mClip;

    public RoundImageViewClipped(Context context) {
        super(context);
//        setBackgroundColor(0xffffffff);
        mRect = new RectF();
        mClip = new Path();
    }

    @Override
    public void onDraw(Canvas canvas) {
        Drawable dr = getDrawable();
        if (dr != null) {
            mRect.set(dr.getBounds());
            getImageMatrix().mapRect(mRect);
            mRect.offset(getPaddingLeft(), getPaddingTop());
            mClip.reset();
            mClip.addRoundRect(mRect, RADIUS, RADIUS, Direction.CCW);

            canvas.clipPath(mClip);
            super.onDraw(canvas);
        }
    }
}

我很确定您不能“使ImageView变圆”,因为所有View实际上都是矩形的,因此您要做的就是伪造它。

使用如下方法从图像上切出一个圆:

public Bitmap getRoundedBitmap(Bitmap scaleBitmapImage) {
    int targetRadius = scaleBitmapImage.getWidth();
    if(targetRadius > scaleBitmapImage.getHeight()) targetRadius = scaleBitmapImage.getHeight();

    Bitmap targetBitmap = Bitmap.createBitmap(targetRadius, targetRadius, Bitmap.Config.ARGB_8888);

    Canvas canvas = new Canvas(targetBitmap);
    Path path = new Path();
    path.addCircle(((float) scaleBitmapImage.getWidth() - 1) / 2, ((float) scaleBitmapImage.getHeight() - 1) / 2, (Math.min(((float) scaleBitmapImage.getWidth()), ((float) scaleBitmapImage.getHeight())) / 2), Path.Direction.CCW);

    canvas.clipPath(path);
    Bitmap sourceBitmap = scaleBitmapImage;
    canvas.drawBitmap(sourceBitmap, new Rect(0, 0, sourceBitmap.getWidth(), sourceBitmap.getHeight()), new Rect(0, 0, scaleBitmapImage.getWidth(), scaleBitmapImage.getHeight()), null);

    return targetBitmap;
}

由于修剪的部分是透明的,因此它将看起来像实际的“视图”是一个圆。 另外,请确保View的边界是平方的(或AdjustViewBounds =“ true”),否则可能会导致宽度或高度出现视觉失真。

可以肯定的是,这实际上与“舍入视图”非常接近。

Romain Guy提供的使用自定义Drawable的解决方案怎么样? 您的ImageView不会是圆形的,并且您的源图像将保持不变。

class StreamDrawable extends Drawable {

    private final float mCornerRadius;
    private final RectF mRect = new RectF();
    private final BitmapShader mBitmapShader;
    private final Paint mPaint;
    private final int mMargin;

    StreamDrawable(Bitmap bitmap, float cornerRadius, int margin) {
        mCornerRadius = cornerRadius;

        mBitmapShader = new BitmapShader(bitmap,
                Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);

        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setShader(mBitmapShader);

        mMargin = margin;
    }

    @Override
    protected void onBoundsChange(Rect bounds) {
        super.onBoundsChange(bounds);
        mRect.set(mMargin, mMargin, bounds.width() - mMargin, bounds.height() - mMargin);


    }

    @Override
    public void draw(Canvas canvas) {
        canvas.drawRoundRect(mRect, mCornerRadius, mCornerRadius, mPaint);
    }

    @Override
    public int getOpacity() {
        return PixelFormat.TRANSLUCENT;
    }

    @Override
    public void setAlpha(int alpha) {
        mPaint.setAlpha(alpha);
    }

    @Override
    public void setColorFilter(ColorFilter cf) {
        mPaint.setColorFilter(cf);
    }       
}

您可以使用GradientDrawable在android视图中添加圆角。 所以,

GradientDrawable gd = new GradientDrawable();
gd.setColor(Color.TRANSPARENT);
gd.setCornerRadius(15f);
gd.setStroke(1f,Color.BLACK);
yourImageView.setBackground(gd);

SmartImageView是从ImageView扩展的..所以您只需要从SmartImageView扩展即可

这是一个可行的解决方案(基于pskink代码和smartImageView lib)

创建一个新的班级

public class RoundedCornersSmartImageView extends SmartImageView{

private int RADIUS = 0;
private RectF mRect;
private Path mClip;

public RoundedCornersSmartImageView(Context context) {
    super(context);
    init();
}

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

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

@Override
public void onDraw(Canvas canvas) {
    Drawable dr = getDrawable();
    if (dr != null) {
        mRect.set(dr.getBounds());
        getImageMatrix().mapRect(mRect);
        mRect.offset(getPaddingLeft(), getPaddingTop());
        mClip.reset();
        mClip.addRoundRect(mRect, RADIUS, RADIUS, Path.Direction.CCW);

        canvas.clipPath(mClip);
        super.onDraw(canvas);
    }
}

public void setRadius(int radius){
    this.RADIUS = radius;
}

private void init(){
    mRect = new RectF();
    mClip = new Path();
}
}

用法

在布局文件中,您的SmartimageView应该看起来像这样

<your.package.path.RoundedCornersSmartImageView
        android:id="@+id/list_image"
        android:layout_width="60dip"
        android:layout_height="60dip"
        android:src="@drawable/profile_anonyme_thumb"/>

..并以这种方式在代码中初始化视图

RoundedCornersSmartImageView thumb_image=(RoundedCornersSmartImageView) findViewById(R.id.list_image);

thumb_image.setRadius(4);
//SmartImageView methode 
thumb_image.setImageUrl(bla.MY_THUMB_URL));

编辑半径以获得圆形图像..

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM