圆形加边框图片

原理:

1、继承imageview,重写设置图片的方法,将图片保存下来

2、在onSizeChanged的方法里面去重画图片

3、将图片压缩为设定大小,用圆形画笔画在画布上,再在外面画一个圆形边框

源码如下:

public class CircleImageView extends ImageView {

private static final ScaleType SCALE_TYPE = ScaleType.CENTER_CROP;
private static final Bitmap.Config BITMAP_CONFIG = Bitmap.Config.ARGB_8888;
private static final int COLORDRAWABLE_DIMENSION = 1;
private final Paint mBitmapPaint = new Paint();
private final Paint mBorderPaint = new Paint();
private final Paint mBorderOutPaint = new Paint();
private int mBorderWidth;
private int mOutBorderWidth;
private float bmRaduis;
private float outRaduis;

public CircleImageView(Context context) {
this(context, null);
}

public CircleImageView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}

public CircleImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
setScaleType(SCALE_TYPE);
mBorderWidth = (int) getResources().getDimension(R.dimen.px6_dip);
mOutBorderWidth = (int) getResources().getDimension(R.dimen.px2_dip);
initPaint();
}

public void setBorderWidth(float px) {
mBorderWidth = (int) px;
}

private void initPaint() {
mBitmapPaint.setAntiAlias(true);
mBitmapPaint.setFilterBitmap(true);
mBitmapPaint.setStyle(Paint.Style.FILL);
mBorderPaint.setStyle(Paint.Style.STROKE);
mBorderPaint.setAntiAlias(true);
mBorderPaint.setColor(Color.WHITE);
mBorderPaint.setStrokeWidth(mBorderWidth);
mBorderOutPaint.setStyle(Paint.Style.STROKE);
mBorderOutPaint.setAntiAlias(true);
mBorderOutPaint.setColor(Color.parseColor("#f5f5f5"));
mBorderOutPaint.setStrokeWidth(mOutBorderWidth);
}

@Override
public ScaleType getScaleType() {
return SCALE_TYPE;
}

@Override
public void setScaleType(ScaleType scaleType) {
if (scaleType != SCALE_TYPE) {
throw new IllegalArgumentException("not support");
}
}

@Override
protected void onDraw(Canvas canvas) {
if (getDrawable() == null) {
return;
}
canvas.drawCircle(getWidth() / 2, getHeight() / 2, bmRaduis, mBitmapPaint);
canvas.drawCircle(getWidth() / 2, getHeight() / 2, bmRaduis, mBorderPaint);
canvas.drawCircle(getWidth() / 2, getHeight() / 2, outRaduis, mBorderOutPaint);
}

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
setup(getBitmapFromDrawable(getDrawable()));
}

@Override
public void setImageBitmap(Bitmap bm) {
super.setImageBitmap(bm);
setup(bm);
}

private void setup(Bitmap bm) {
if (bm == null) {
return;
}
RectF rectF = new RectF();
rectF.set(0, 0, getWidth(), getHeight());
final float min = Math.min(rectF.width(), rectF.height());
int bmWidth = bm.getWidth();
int bmHeight = bm.getHeight();
float scale;
float dx = 0;
float dy = 0;
Matrix matrix = new Matrix();
matrix.set(null);
if (bmWidth * rectF.height() > rectF.width() * bmHeight) {
scale = rectF.height() / (float) bmHeight;
dx = (rectF.width() - bmWidth * scale) * 0.5f;
} else {
scale = rectF.width() / (float) bmWidth;
dy = (rectF.height() - bmHeight * scale) * 0.5f;
}
matrix.setScale(scale, scale);
matrix.postTranslate((int) (dx + 0.5f) + mBorderWidth, (int) (dy + 0.5f) + mBorderWidth);
Shader shader = new BitmapShader(bm, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
shader.setLocalMatrix(matrix);
mBitmapPaint.setShader(shader);
bmRaduis = min / 2 - mOutBorderWidth - mBorderWidth;
outRaduis = min / 2 - mOutBorderWidth - mBorderWidth / 2;
invalidate();
}

@Override
public void setImageDrawable(Drawable drawable) {
super.setImageDrawable(drawable);
setup(getBitmapFromDrawable(drawable));
}

@Override
public void setImageResource(int resId) {
super.setImageResource(resId);
setup(getBitmapFromDrawable(getDrawable()));
}

private Bitmap getBitmapFromDrawable(Drawable drawable) {
if (drawable == null) {
return null;
}

if (drawable instanceof BitmapDrawable) {
return ((BitmapDrawable) drawable).getBitmap();
}
try {
Bitmap bitmap;

if (drawable instanceof ColorDrawable) {
bitmap = Bitmap.createBitmap(COLORDRAWABLE_DIMENSION, COLORDRAWABLE_DIMENSION, BITMAP_CONFIG);
} else {
bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), BITMAP_CONFIG);
}
Canvas canvas = new Canvas(bitmap);
drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
drawable.draw(canvas);
return bitmap;
} catch (OutOfMemoryError e) {
return null;
}
}

private int dip(int dp) {
return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, getResources().getDisplayMetrics());
}
}

这个只是一个小技巧,主要在与理解imageview显示图片的过程,如有疑问,欢迎在下面留言

### 回答1: 要在Android Studio中的圆形边框中添图片,您可以按照以下步骤进行操作: 1. 在res/drawable文件夹中创建一个XML文件(例如circlular_border.xml),并添以下代码: ``` <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <corners android:radius="50dp"/> <stroke android:width="2dp" android:color="@color/black"/> <solid android:color="@color/white"/> </shape> ``` 2. 在布局文件中添ImageView控件,并为其设置背景为刚刚创建的XML文件: ``` <ImageView android:id="@+id/imageView" android:layout_width="100dp" android:layout_height="100dp" android:background="@drawable/circular_border" /> ``` 3. 在Java代码中载您想要添图片,并将其设置为ImageView的源(src): ``` ImageView imageView = findViewById(R.id.imageView); imageView.setImageResource(R.drawable.your_image_file); ``` 这样,您就可以在圆形边框中添图片了。请注意,如果您想要实现圆形ImageView,可以使用CircleImageView库。 ### 回答2: 在Android Studio中添圆形边框并在其中添图片的步骤如下: 1. 首先,在drawable文件夹下创建一个圆形边框的XML文件。例如,创建一个名为circle_border.xml的文件。 2. 在circle_border.xml文件中,使用shape标签定义一个圆形的形状,并设置边框的颜色和宽度。例如,可以使用solid标签设置边框的颜色,stroke标签设置边框的宽度。同时,设置一个size属性来限定圆形的大小。以下是circle_border.xml文件的示例代码: ```xml <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="#FF0000" /> <stroke android:color="#000000" android:width="2dp" /> <size android:width="100dp" android:height="100dp" /> </shape> ``` 3. 在布局文件中,添一个ImageView元素,并为它设置drawable属性为前面创建的circle_border.xml文件。例如,可以将drawable属性设置为@drawable/circle_border。以下是一个示例代码: ```xml <ImageView android:id="@+id/imageView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/circle_border" /> ``` 4. 最后,在Java代码中,使用Glide或者Picasso等图片载库来载要显示的图片,并将其设置到ImageView元素中。以下是一个使用Glide库图片的示例代码: ```java ImageView imageView = findViewById(R.id.imageView); Glide.with(this) .load(R.drawable.your_image) .into(imageView); ``` 以上就是在Android Studio中添圆形边框并添图片的步骤。通过创建圆形边框的XML文件,并将该边框作为ImageView的drawable属性,再图片到ImageView中,即可实现圆形边框中添图片的效果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值