如何在圆形 imageView android 上添加一个阴影和边界？

来源：互联网发布：知乎如何发问题编辑：程序博客网时间：2024/06/15 18:31

我创建了 CircularImageView 这一问题：创建在 android 中的圆形图像视图

下载GitHub的项目

1）这是 CircularImageView 类：

public class CircularImageView extends ImageView {    public CircularImageView(Context context) {        super(context);    }    public CircularImageView(Context context, AttributeSet attrs) {        super(context, attrs);    }    public CircularImageView(Context context, AttributeSet attrs, int defStyle) {        super(context, attrs, defStyle);    }    @Override    protected void onDraw(Canvas canvas) {        Drawable drawable = getDrawable();        if (drawable == null) {            return;        }        if (getWidth() == 0 || getHeight() == 0) {            return;         }        Bitmap b =  ((BitmapDrawable)drawable).getBitmap() ;        Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);              Bitmap roundBitmap =  getCroppedBitmap(bitmap, getWidth());        canvas.drawBitmap(roundBitmap, 0, 0, null);    }    public static Bitmap getCroppedBitmap(Bitmap bmp, int radius) {        Bitmap sbmp;        if(bmp.getWidth() != radius || bmp.getHeight() != radius)            sbmp = Bitmap.createScaledBitmap(bmp, radius, radius, false);        else            sbmp = bmp;        Bitmap output = Bitmap.createBitmap(sbmp.getWidth(), sbmp.getHeight(), Bitmap.Config.ARGB_8888);        final Rect rect = new Rect(0, 0, sbmp.getWidth(), sbmp.getHeight());        Paint paint = new Paint();        paint.setAntiAlias(true);        paint.setFilterBitmap(true);        paint.setDither(true);              paint.setColor(Color.parseColor("#BAB399"));        Canvas c = new Canvas(output);                c.drawARGB(0, 0, 0, 0);        c.drawCircle(sbmp.getWidth() / 2+0.7f, sbmp.getHeight() / 2+0.7f, sbmp.getWidth() / 2+0.1f, paint);        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));        c.drawBitmap(sbmp, rect, rect, paint);        return output;    }}

2）我在我像这样的布局中使用：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="#cccccc"    android:gravity="center"    android:orientation="vertical"    android:padding="10dp" >    <com.mikhaellopez.circularimageview.CircularImageView        android:id="@+id/imageViewCircular"        android:layout_width="@dimen/image_view_size"        android:layout_height="@dimen/image_view_size"        android:layout_gravity="center"        android:background="@drawable/border"        android:src="@drawable/image" /></LinearLayout>

3）当前结果中的图片：

Current result

如何更改此代码有一个阴影和我 imageView 圆形边框？

关于结果：

Objectif result

解决方法 1:

我修改了CircularImageView 在这里找到实现你想要什么。

若要创建一个阴影边框四周，我只用这两条线：

this.setLayerType(LAYER_TYPE_SOFTWARE, paintBorder);paintBorder.setShadowLayer(4.0f, 0.0f, 2.0f, Color.BLACK);

你需要 setLayerType 由于硬件加速关于蜂窝和起来。没用没有它时尝试了它。

下面是完整的代码：

import android.annotation.SuppressLint;import android.content.Context;import android.graphics.Bitmap;import android.graphics.BitmapShader;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Shader;import android.graphics.drawable.BitmapDrawable;import android.util.AttributeSet;import android.widget.ImageView;public class CircularImageView extends ImageView{    private int borderWidth = 4;    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.WHITE);        paintBorder.setAntiAlias(true);        this.setLayerType(LAYER_TYPE_SOFTWARE, paintBorder);        paintBorder.setShadowLayer(4.0f, 0.0f, 2.0f, Color.BLACK);    }    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)        {            shader = new BitmapShader(Bitmap.createScaledBitmap(image, canvas.getWidth(), canvas.getHeight(), false), Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);            paint.setShader(shader);            int circleCenter = viewWidth / 2;            // 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 + borderWidth - 4.0f, paintBorder);            canvas.drawCircle(circleCenter + borderWidth, circleCenter + borderWidth, circleCenter - 4.0f, 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 + 2);    }}

0 0