Skip to content

Instantly share code, notes, and snippets.

@bkurzius
Last active September 21, 2020 16:18
Show Gist options
  • Save bkurzius/99c945bd1bdcf6af8f99 to your computer and use it in GitHub Desktop.
Save bkurzius/99c945bd1bdcf6af8f99 to your computer and use it in GitHub Desktop.
Circular NetworkImageView for use with Volley. Creates a circular bitmap and uses whichever dimension is smaller to determine the radius. Also constrains the circle to the leftmost part of that image. Used in the same way as the Volley NetworkImageView, in both code and xml. Of course you'll need to include the Volley Library in you app too.
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Bitmap.Config;
import android.graphics.PorterDuff.Mode;
import android.graphics.drawable.BitmapDrawable;
import android.util.AttributeSet;
import com.android.volley.toolbox.NetworkImageView;
public class CircularNetworkImageView extends NetworkImageView {
Context mContext;
public CircularNetworkImageView(Context context) {
super(context);
mContext = context;
}
public CircularNetworkImageView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
mContext = context;
}
public CircularNetworkImageView(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
mContext = context;
}
@Override
public void setImageBitmap(Bitmap bm) {
if(bm==null) return;
setImageDrawable(new BitmapDrawable(mContext.getResources(),
getCircularBitmap(bm)));
}
/**
* Creates a circular bitmap and uses whichever dimension is smaller to determine the width
* <br/>Also constrains the circle to the leftmost part of the image
*
* @param bitmap
* @return bitmap
*/
public Bitmap getCircularBitmap(Bitmap bitmap) {
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Config.ARGB_8888);
Canvas canvas = new Canvas(output);
int width = bitmap.getWidth();
if(bitmap.getWidth()>bitmap.getHeight())
width = bitmap.getHeight();
final int color = 0xff424242;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, width, width);
final RectF rectF = new RectF(rect);
final float roundPx = width / 2;
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
return output;
}
}
@power7714
Copy link

How can I use this to show image with corners in top left and bottom right only?

@luqmanoop
Copy link

Ahhh. Thank you sooooo much

@thetundedoherty
Copy link

This is working perfectly..Thanks

@ShilpaCISPL
Copy link

Thanks..It works

@samuelDeveloperiOS
Copy link

Thanks. it works perfect.

@nanom1t
Copy link

nanom1t commented Jun 6, 2018

How I can use this?

    <com.android.volley.toolbox.NetworkImageView
        android:id="@+id/photo"
        android:layout_width="@dimen/sidebar_header_photo_size"
        android:layout_height="@dimen/sidebar_header_photo_size"
        android:paddingTop="@dimen/sidebar_header_spacing_vertical"
        android:scaleType="fitXY"
        app:srcCompat="@mipmap/ic_launcher_round" />
        CircularNetworkImageView navigationHeaderPhotoView = navigationHeader.findViewById(R.id.photo);
        String navigationHeaderPhotoUrl = profile.getPhotoUrl();
        ImageLoader navigationHeaderPhotoLoader = APIRequest.getInstance(getApplicationContext()).getImageLoader();
        navigationHeaderPhotoView.setImageUrl(navigationHeaderPhotoUrl, navigationHeaderPhotoLoader);

java.lang.RuntimeException: Unable to start activity ComponentInfo{net.app.android/net.app.android.MainActivity}: java.lang.ClassCastException: com.android.volley.toolbox.NetworkImageView cannot be cast to net.app.android.views.CircularNetworkImageView

@bhatguru03
Copy link

How I can use this?

    <com.android.volley.toolbox.NetworkImageView
        android:id="@+id/photo"
        android:layout_width="@dimen/sidebar_header_photo_size"
        android:layout_height="@dimen/sidebar_header_photo_size"
        android:paddingTop="@dimen/sidebar_header_spacing_vertical"
        android:scaleType="fitXY"
        app:srcCompat="@mipmap/ic_launcher_round" />
        CircularNetworkImageView navigationHeaderPhotoView = navigationHeader.findViewById(R.id.photo);
        String navigationHeaderPhotoUrl = profile.getPhotoUrl();
        ImageLoader navigationHeaderPhotoLoader = APIRequest.getInstance(getApplicationContext()).getImageLoader();
        navigationHeaderPhotoView.setImageUrl(navigationHeaderPhotoUrl, navigationHeaderPhotoLoader);

java.lang.RuntimeException: Unable to start activity ComponentInfo{net.app.android/net.app.android.MainActivity}: java.lang.ClassCastException: com.android.volley.toolbox.NetworkImageView cannot be cast to net.app.android.views.CircularNetworkImageView

In your xml file instead of using com.android.volley.toolbox.NetworkImageView use net.app.android.views.CircularNetworkImageView

@bhatguru03
Copy link

Thanks for the solution... Helped a lot

@hmzgtl16
Copy link

i'm rewrite this code in Kotlin, the color code its made error type mismatch with print.color

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment