8

我一直在研究如何在 Android 中创建圆形 ImageView。在阅读了 StackOverflow 上关于该主题的问题后:

如何使图像适合android中的圆形框架

如何在圆形图像视图中设置位图?

我使用链接作为指南将自己的 ImageView 放在一起,完成我需要做的事情:带边框的圆形图像。

下面是我正在使用的代码:

public class CircularImageView extends ImageView
{

private int borderWidth = 5;
private int viewWidth;
private int viewHeight;
private Bitmap image;
private Paint paint;
private Paint paintBorder;
private BitmapShader shader;

public CircularImageView(Context context) {
    super(context);
    setup();
}

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

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

private void setup()
{
    // init paint
    paint = new Paint();
    paint.setAntiAlias(true);

    paintBorder = new Paint();
    setBorderColor(Color.BLUE);
    paintBorder.setAntiAlias(true);     
}

public void setBorderWidth(int borderWidth)
{
    this.borderWidth = borderWidth;
    this.invalidate();
}

public void setBorderColor(int borderColor)
{       
    if(paintBorder != null)
        paintBorder.setColor(borderColor);

    this.invalidate();
}

private void loadBitmap()
{
    BitmapDrawable bitmapDrawable = (BitmapDrawable) this.getDrawable();

    if(bitmapDrawable != null)
        image = bitmapDrawable.getBitmap();
}

@SuppressLint("DrawAllocation")
@Override
public void onDraw(Canvas canvas)
{
    //load the bitmap
    loadBitmap();

    // init shader
    if(image !=null)
    {
        // Create a shader with a scaled bitmap to match the view dimensions            
        shader = new BitmapShader(Bitmap.createScaledBitmap(image, canvas.getWidth(), canvas.getHeight(), false), Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
        paint.setShader(shader);
        int circleCenter = viewWidth / 2;

                    // Draw the outer border
                    canvas.drawCircle(circleCenter + borderWidth, circleCenter + borderWidth, circleCenter + borderWidth, paintBorder);
        // circleCenter is the x or y of the view's center
        // radius is the radius in pixels of the cirle to be drawn
        // paint contains the shader that will texture the shape            
        canvas.drawCircle(circleCenter + borderWidth, circleCenter + borderWidth, circleCenter, paint);
    }       
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
    int width = measureWidth(widthMeasureSpec);
    int height = measureHeight(heightMeasureSpec, widthMeasureSpec);        

    viewWidth = width - (borderWidth *2);
    viewHeight = height - (borderWidth*2);

    setMeasuredDimension(width, height);
}

private int measureWidth(int measureSpec)
{
        int result = 0;
        int specMode = MeasureSpec.getMode(measureSpec);
        int specSize = MeasureSpec.getSize(measureSpec);

        if (specMode == MeasureSpec.EXACTLY) {
            // We were told how big to be
            result = specSize;
        } else {
            // Measure the text
            result = viewWidth;

        }

    return result;
}

private int measureHeight(int measureSpecHeight, int measureSpecWidth) {
    int result = 0;
    int specMode = MeasureSpec.getMode(measureSpecHeight);
    int specSize = MeasureSpec.getSize(measureSpecHeight);

    if (specMode == MeasureSpec.EXACTLY) {
        // We were told how big to be
        result = specSize;
    } else {
        // Measure the text (beware: ascent is a negative number)
        result = viewHeight;           
    }
    return result;
}
}

我正计划制作这个开源软件,因此如果有人可以查看代码以确保我做的一切正确,我将不胜感激。

4

4 回答 4

2

试试这个函数来获得圆角图像:

   private Bitmap getRoundedCornerBitmap(Bitmap bitmap, int pixels) 
    {
        Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Config.ARGB_8888);
        Canvas canvas = new Canvas(output);
        final int color = 0xff424242;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
        final RectF rectF = new RectF(rect);
        final float roundPx = pixels;
        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
        canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);
        return output;
    }
于 2013-03-30T09:45:53.407 回答
0

如果您对按钮的边框不是那么严格。那你为什么不制作一个带有透明边缘的圆形PNG图像文件。

于 2013-03-30T09:58:10.033 回答
0

这可能不是最好的方法,您可能无法更改很多属性,但它肯定是最简单的方法。我刚刚使用了这个库,并制作了一个带有边框的圆形图像视图。


所以,这是我的解决方案:

首先,我把它放在我的build.grandle

`compile 'com.github.siyamed:android-shape-imageview:0.9.+@aar'`

其次,我把它放在我的.xml布局文件中:

 <com.github.siyamed.shapeimageview.CircularImageView
                    android:layout_width="150dp"
                    android:layout_gravity="center_horizontal"
                    android:layout_height="150dp"
                    android:id="@+id/photo"
                    app:siBorderWidth="5dp"
                    app:siBorderColor="#ffffff"
                    android:layout_alignParentTop="true"
                    android:layout_centerHorizontal="true" />

在我的.java文件中,这是我可以采取或设置图像的方式CircularImageView

final com.github.siyamed.shapeimageview.CircularImageView photo = (com.github.siyamed.shapeimageview.CircularImageView) convertView.findViewById(R.id.photo);

photo.setBackgroundResource(R.drawable.female);

这就是我为制作带有白色边框的图像圆形所做的一切。

于 2015-01-21T10:39:41.413 回答
0

添加与 android x 兼容的最新依赖项

implementation 'com.github.arefhosseini:android-shape-imageview:1.0.3'
于 2019-08-28T09:18:41.637 回答