Create a border outside the circular ImageView

Question

I have created a circular ImageView, but I need to add a border outside the image.

Here is the code:

Bitmap circleBitmap = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);   
BitmapShader shader = new BitmapShader (bitmap,  TileMode.CLAMP, TileMode.CLAMP);

Paint paint = new Paint();
paint.setShader(shader);
paint.setAntiAlias(true);
paint.setFilterBitmap(true);
paint.setDither(true);      
paint.setColor(Color.parseColor("#BAB399"));

Canvas c = new Canvas(circleBitmap);        
c.drawARGB(0, 0, 0, 0);
c.drawCircle(50, 40,40, paint);

Could anybody help me to create a border outside the circular image?

Answer 1

First you create a circle shape like this,

    <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >
    <gradient android:startColor="#333440" android:endColor="#333440"
        android:angle="270"/>
</shape>

Then add a relative layout and add an imageview to it.Arrange it to the center of relative layout.And set this circle shape as Imageview's background.Then place your circular imageview above previously added imageview.Arrange it also to center.By changing your circular imageview margin you will get the desired border effect.

final code,

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="30dp">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/imageView14"
            android:background="@drawable/circ"
            android:layout_centerVertical="true"
            android:layout_centerHorizontal="true" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/imageView15"
            android:layout_centerVertical="true"
            android:layout_centerHorizontal="true"
            android:src="@drawable/linked"
            android:layout_margin="5dp" />
    </RelativeLayout>
</LinearLayout>