Using picasso library with a circle image view

I am looking at using the Picasso library to download an image from URL and pass this into circle image view, but since picasso requires that you pass in an actual imageView I have come to a standstill on how to do it

I am using the picasso library from here http://square.github.io/picasso/
and the circle image view class from here https://github.com/hdodenhof/CircleImageView

  • Android - R cannot be resolved to a variable
  • How to disable Firebase Crash Reporting when the app is running on debug?
  • Assets folder in Android Studio Unit Test
  • How to get complete address from latitude and longitude?
  • View can not be anchored to the the parent CoordinatorLayout
  • Need an example about RecyclerView.Adapter.notifyItemChanged(int position, Object payload)
  • Here is the start of my code to get the image

    private void getData() {
    
        userName.setText(prefs.getString("userName",""));
        jobTitle.setText(prefs.getString("profile",""));
        userLocation.setText(prefs.getString("location",""));
    
    
    
    
        // ??????    
    
        // Picasso.with(context).load(image link here).into(imageview here);
    
        //CircleImageView img = new CircleImageView(this);
        //img.setImageResource();
        //img.setImageBitmap();
        //img.setImageDrawable();
        //img.setImageURI();
    
    }
    

    Edit:

    here is the xml for the circleImageView

    <michael.CircleImageView
     android:layout_width="100dp"
     android:layout_height="100dp"
     android:src="@drawable/shadow"
     android:layout_gravity="center"
     android:layout_marginTop="16dp"
     app:border_width="2dp"
     app:border_color="#274978"
     android:id="@+id/circleImageView"
    

    Related posts:

    Samsung Smart Manager reporting slow app but shows information about errors
    playing HLS on Android (compare alternatives)
    Pass additional data to fragment shader through VBO - DynamicSpriteBatch
    How to capture the &ldquo;virtual keyboard show/hide&rdquo; event in Android?
    Tab not taking full width on Tablet device
    What is MergeRootFrame in FrameLayout?
  • android incoming call screen
  • Change generated apk name from “app-debug.apk”
  • Alignment issues with two-line button
  • Share text via Intent on Facebook without using Facebook sdk
  • Android Google Map v2 - Starting activity when clicking on marker infoWindow
  • Android Proguard - only obfuscation
  • 5 Solutions collect form web for “Using picasso library with a circle image view”

    Use This

    Activity Class

    public class MainActivity extends AppCompatActivity {
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            String imageUrl = "https://www.baby-connect.com/images/baby2.gif";
    
            CircleImageView imageView = (CircleImageView) findViewById(R.id.image);
    
            Picasso.with(getApplicationContext()).load(imageUrl)
                    .placeholder(R.drawable.images).error(R.drawable.ic_launcher)
                    .into(imageView);
        }
    }
    

    Layout File

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/image"
        android:layout_width="160dp"
        android:layout_height="160dp"
        android:layout_centerInParent="true"
        android:src="@drawable/images"
        app:border_color="#ffffff"
        app:border_width="2dp" />
    

    This is Working fine.

    I don’t think you require CircleImageView library

    You can implement Circular Transformation check the below gist

    https://gist.github.com/julianshen/5829333

    then

    Picasso.with(activity).load(image link here)
         .transform(new CircleTransform()).into(ImageView);
    

    Use this code to create Circular Imageview ….

    public class RoundedImageView extends ImageView {
    
    public RoundedImageView(Context context) {
        super(context);
        // TODO Auto-generated constructor stub
    }
    
    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; 
        }
        Bitmap b =  ((BitmapDrawable)drawable).getBitmap() ;
        Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);
    
        int w = getWidth(), h = getHeight();
    
    
        Bitmap roundBitmap =  getCroppedBitmap(bitmap, w);
        canvas.drawBitmap(roundBitmap, 0,0, null);
    
    }
    
    public static Bitmap getCroppedBitmap(Bitmap bmp, int radius) {
        Bitmap sbmp;
        if(bmp.getWidth() != radius || bmp.getHeight() != radius)
            sbmp = Bitmap.createScaledBitmap(bmp, radius, radius, false);
        else
            sbmp = bmp;
        Bitmap output = Bitmap.createBitmap(sbmp.getWidth(),
                sbmp.getHeight(), Config.ARGB_8888);
        Canvas canvas = new Canvas(output);
    
        final int color = 0xffa19774;
        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.drawARGB(0, 0, 0, 0);
        paint.setColor(Color.parseColor("#BAB399"));
        canvas.drawCircle(sbmp.getWidth() / 2+0.7f, sbmp.getHeight() / 2+0.7f,
                sbmp.getWidth() / 2+0.1f, paint);
        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(sbmp, rect, rect, paint);
    
    
                return output;
    }
    
    }
    

    Take the ID of CircleImageView first :

    CircleImageView mCircleImageView = (CircleImageView)findViewById(R.id.circleImageView);
    

    And pass the ID to Picasso library :

    Picasso.with(mContext).load(Uri.parse(link)).placeholder(drawable).into(mCircleImageView);
    

    This worked for me.

    I have created a target class that uses native Android’s RoundedBitmapDrawable class to make image round (removes the need to add a circle transform class to code), see solution below:

    public class RoundedImageBitmapTarget implements Target {
    
        private final Context context;
        private final ImageView view;
    
        public RoundedImageBitmapTarget(Context context, ImageView view) {
            this.context = context;
            this.view = view;
        }
    
        @Override
        public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
            setBitmap(bitmap);
        }
    
        @Override
        public void onBitmapFailed(Drawable errorDrawable) {
            setBitmap(((BitmapDrawable) errorDrawable).getBitmap());
        }
    
        @Override
        public void onPrepareLoad(Drawable placeHolderDrawable) {
            setBitmap(((BitmapDrawable) placeHolderDrawable).getBitmap());
        }
    
        public void setBitmap(Bitmap bitmap) {
            view.setImageDrawable(getRoundBitmap(context, bitmap));
        }
    
        public static RoundedBitmapDrawable getRoundBitmap(Context context, Bitmap bitmap) {
            Resources res = context.getResources();
            RoundedBitmapDrawable round = RoundedBitmapDrawableFactory.create(res, bitmap);
            round.setCircular(true);
            round.setTargetDensity(context.getResources().getDisplayMetrics());
            return round;
        }
    
        public static void load(Context context, ImageView view, String url, int size, @DrawableRes int placeholder) {
            RoundedImageBitmapTarget target;
            Picasso.with(context).load(url)
                    .resize(0, size)
                    .placeholder(placeholder)
                    .error(placeholder)
                    .into(target = new RoundedImageBitmapTarget(context, view));
            view.setTag(target);
        }
    
    }
    
    Android Babe is a Google Android Fan, All about Android Phones, Android Wear, Android Dev and Android Games Apps and so on.