CODEWITHSUNDEEP
android
Edge
Edge

Reputation: 933

how to set rounded white border in Imageview in android

public Bitmap getRoundedShape1(Bitmap scaleBitmapImage) {
          int targetWidth = 65;
           int targetHeight = 65;
           Bitmap targetBitmap = Bitmap.createBitmap(targetWidth, targetHeight,Bitmap.Config.ARGB_8888);

           BitmapShader shader = new BitmapShader(targetBitmap,Shader.TileMode.CLAMP, Shader.TileMode.REPEAT);

           Paint paint = new Paint();
           paint.setAntiAlias(true);
           paint.setShader(shader);
           Canvas canvas = new Canvas(targetBitmap);
           Path path = new Path();
           path.addCircle(((float) targetWidth - 1) / 2,
           ((float) targetHeight - 1) / 2,
           (Math.min(((float) targetWidth),((float) targetHeight)) / 2),Path.Direction.CCW);
           paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
           paint.setStyle(Paint.Style.STROKE);
           canvas.clipPath(path);
           Bitmap sourceBitmap = targetBitmap;
           canvas.drawBitmap(sourceBitmap, new Rect(0, 0, sourceBitmap.getWidth(),sourceBitmap.getHeight()),
           new Rect(0, 0, targetWidth,targetHeight), null);
        return targetBitmap;
    }


String imagePath = Environment.getExternalStorageDirectory().toString()
                + "/.LociiImages/" + member_id + ".jpg";

        Bitmap bitmap = BitmapFactory.decodeFile(imagePath);


        BitmapDescriptor icon = BitmapDescriptorFactory
                .fromBitmap(getRoundedShape(getResizedBitmap(bitmap, 100, 100)));

using this code i m able to display Marker as rounded image but i want to set Border around that image i m trying to set border but unable to do that .

My Current Screen :enter image description here

Desire Screen:enter image description here

Upvotes: 0

Views: 1341

Answers (2)

Sam Bains
Sam Bains

Reputation: 548

It's often easier to use xml rather than do it in code.

Set the background of your ImageView to be something similar to this xml shape:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">

    <size
        android:height="20dp"
        android:width="20dp"/>

    <stroke
        android:color="@color/white"
        android:width="2dp"/>
</shape>

You can change the height and width values in size based on the size of your imageview. The stroke would draw a border around the ImageView.

Upvotes: 2

DroidDev
DroidDev

Reputation: 1525

Here is what I did to get a circular bitmap with a border:

public static Bitmap getCircleBitmap(Bitmap bitmap, boolean border) {

    int width=0;
    int height=0;
    int borderWidth=6;

    final Paint paint = new Paint();

    float radius = 0;

    Bitmap output;

    if (bitmap.getWidth() > bitmap.getHeight()) {
        output = Bitmap.createBitmap(bitmap.getHeight(), bitmap.getHeight(), Config.ARGB_8888);
    } else {
        output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getWidth(), Config.ARGB_8888);
    }

    if (bitmap.getWidth() > bitmap.getHeight()) {
        radius = output.getHeight() / 2;
    } else {
        radius = output.getWidth() / 2;
    }

    if(border){
        width = output.getWidth() + borderWidth;
        height = output.getHeight() + borderWidth;
    }
    else{
        width = output.getWidth();
        height = output.getHeight();
    }

    Bitmap canvasBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
    BitmapShader shader = new BitmapShader(bitmap, TileMode.CLAMP, TileMode.CLAMP);
    paint.setAntiAlias(true);
    paint.setShader(shader);
    Canvas canvas = new Canvas(canvasBitmap);
    canvas.drawCircle(width/2, height/2, radius, paint);
    paint.setShader(null);
    paint.setStyle(Paint.Style.STROKE);
    paint.setColor(0xff684321);
    if(border){
        paint.setStrokeWidth(borderWidth);
        canvas.drawCircle(width/2, height/2, radius - borderWidth / 2, paint);
    }
    return canvasBitmap;
}

I have written this method in a class as static and I just directly call it, with required variables, whenever I need a bitmap to be circular.

You can change the colour in paint.setColor(0xff684321); or you can even pass that as a parameter in method to make the method more dynamic.

Upvotes: 2

Related Questions