RoundedImageView add border and shadow.

Question

I am using the following class to get a rounded ImageView: https://github.com/vinc3m1/RoundedImageView

Everything works fine, however I want to add a shadow and border to my image view like: How to add a shadow and a border on circular imageView android?

I modified the Rounded ImageView class to include these functions :

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 Bitmap convertToBitmap(Drawable drawable, int widthPixels, int heightPixels) {
        Bitmap mutableBitmap = Bitmap.createBitmap(widthPixels, heightPixels, Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(mutableBitmap);
        drawable.setBounds(0, 0, widthPixels, heightPixels);
        drawable.draw(canvas);

        return mutableBitmap;
    }

    @Override
    public void onDraw(Canvas canvas)
    {

            BitmapShader shader = new BitmapShader(Bitmap.createScaledBitmap(convertToBitmap(mDrawable,canvas.getWidth(), canvas.getHeight()), canvas.getWidth(), canvas.getHeight(), false), Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
            paint.setShader(shader);
            int circleCenter = viewWidth / 2;
            canvas.drawCircle(circleCenter + borderWidth, circleCenter + borderWidth, circleCenter + borderWidth - 4.0f, paintBorder);
            canvas.drawCircle(circleCenter + borderWidth, circleCenter + borderWidth, circleCenter - 4.0f, paint);
    }

Now I get the shadow effect, but I dont get the white border. Any hints?

score 0 · Answer 1 · answered Nov 10 '14 at 11:32

Use Linear layout and then set the layout background android:background="@drawable/layout_shadow_border"

and then set padding=4dp and put your image view inside the linear layout.

///////////////////////// layout_shadow_border.xml/////////////////

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#CABBBBBB"/>
            <corners android:radius="2dp" />
        </shape>
    </item>

    <item
        android:left="0dp"
        android:right="0dp"
        android:top="0dp"
        android:bottom="2dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white"/>
            <corners android:radius="2dp" />
        </shape>
    </item>
</layer-list>

Bro, I am using a circular imageview – User3 Nov 10 '14 at 11:42 — User3, Nov 10 '14 at 11:42

RoundedImageView add border and shadow.

1 Answers1