How do I leave a round image?

Question

I need the image to be round as well as the contact images of Whatsapp. I have tried to do some forms, for example with the tag < Shape>, but I didn’t get the right result.

How could I get this result?

Example:

Answer 1

Use this API I found on the internet:

In Gradle add dependency: compile 'de.hdodenhof:circleimageview:2.0.0'

And in place of ImageView in XML just add:

<de.hdodenhof.circleimageview.CircleImageView
       android:src="@drawable/sua_imagem"
       android:layout_width="90dp"
       android:layout_height="90dp"
       app:civ_border_width="2dp"
       app:civ_border_color="#ff000000" />

Source for the API: https://github.com/hdodenhof/CircleImageView

Answer 2

Here is an example of implementation:

Roundedimageview.java

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;

public class RoundedImageView extends ImageView {

    public RoundedImageView(Context context) {
        super(context);
    }

    public RoundedImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public RoundedImageView(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;
        }
        // pegamos o drawable e transformamos em Bitmap
        Bitmap b = convertToBitmap(drawable, drawable.getBounds().width() ,drawable.getBounds().height());
        // pegamos o tamanho da imagem
        int w = getWidth(), h = getHeight();
        // geramos a imagem redonda..
        Bitmap roundBitmap = getCroppedBitmap(b, w);
        //desenhamos a imagem
        canvas.drawBitmap(roundBitmap, 0, 0, null);
    }


    /**
     * Responsavel por Converter um Drawable em Bitmap
     */
    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;
    }

    /**
     * Disponibiliza uma imagem redonda
     */
    public Bitmap getCroppedBitmap(Bitmap bmp, int radius) {
        Bitmap sbmp;
        // Ajustamos o tamanho, se necessario
        if (bmp.getWidth() != radius || bmp.getHeight() != radius)
            sbmp = Bitmap.createScaledBitmap(bmp, radius, radius, false);
        else
            sbmp = bmp;
        // Nova Imagem...
        Bitmap output = Bitmap.createBitmap(sbmp.getWidth(), sbmp.getHeight(), Config.ARGB_8888);
        // Canvas onde iremos desenhar
        Canvas canvas = new Canvas(output);
        //  Configuramos o Paint...
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, sbmp.getWidth(), sbmp.getHeight());
        paint.setAntiAlias(true);
        paint.setFilterBitmap(true);
        paint.setDither(true);
        canvas.drawCircle(sbmp.getWidth() / 2 + 0.7f,  sbmp.getHeight() / 2 + 0.7f, sbmp.getWidth() / 2 + 0.1f, paint);
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        canvas.drawBitmap(sbmp, rect, rect, paint);
        return output;
    }

}

xml

 <com.br.seu.pacote.RoundedImageView
            android:id="@+id/image_item"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_centerVertical="true"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true" />

Utilizing

 RoundedImageView image = RoundedImageView.class.cast(v.findViewById(R.id.image_item));
image.setImageResource(R.mipmap.ic_launcher);

Answer 3

Glide

Add this to your build.Radle :APP

implementation 'com.github.bumptech.Glide:4.6.1' Link

implementation 'jp.wasabeef:Glide-Transformations:3.2.0' Link

 RequestOptions options = new RequestOptions();
    options.placeholder(R.drawable.demo)
            .diskCacheStrategy(DiskCacheStrategy.AUTOMATIC)
            .error(R.drawable.error)
            .transform(new CropCircleTransformation());

    Glide.with(this).load("url")
            .apply(options)
            .into(mImageView); 

Picasso

Add this to your build.Radle :APP

implementation 'com.squareup.Picasso:Picasso:2.71828' Link

   Picasso.get().load("url")
            .resize(w, h)
            .into(mImageView, new Callback() {
                @Override
                public void onSuccess() {
                    Bitmap imageBitmap = ((BitmapDrawable) mImageView.getDrawable()).getBitmap();
                    RoundedBitmapDrawable imageDrawable = RoundedBitmapDrawableFactory.create(getResources(), imageBitmap);
                    imageDrawable.setCircular(true);
                    imageDrawable.setCornerRadius(Math.max(imageBitmap.getWidth(), imageBitmap.getHeight()) / 2.0f);
                    mImageView.setImageDrawable(imageDrawable);
                }

                @Override
                public void onError(Exception e) {
                    mImageView.setImageResource(R.drwable.error);
                }

            });