Glide circular image gets cropped

Question

I'm trying to make a circular imageview using glide... I followed this tutorial How to round an image with Glide library? but my image always get the top and bottom cropped

i tried to change imageview dimensions but nothing changes, always cropped and same ratio

what am i doing wrong

Glide.with(this).load(MasterFacade.getFacade().getLocalUser().getProfilePicUrl()).apply(RequestOptions.centerCropTransform()).into((ImageView) findViewById(R.id.profileImageView));

and the layout

<ImageView
                android:id="@+id/profileImageView"
                android:layout_width="200dp"
                android:layout_height="200dp"
                android:layout_gravity="center"
                android:scaleType="fitXY" />

score 1 · Accepted Answer · answered May 29 '18 at 23:41

1

<ImageView
                android:id="@+id/profileImageView"
                android:layout_width="200dp"
                android:layout_height="200dp"
                android:layout_gravity="center"
                android:layout_margin="15dp"
                android:scaleType="fitXY" />

The problem is that is overlaping the other views, with a margin it should solve your problem

answered May 29 '18 at 23:41

Gastón Saillén

12,319
5
67
77

it worked perfectly, but can you explain what is that margin doing? why do i need it? and HOW DID YOU GET 15 DP? – Rafael Lima May 29 '18 at 23:47
the margin is simply adding space of 15dp around all the image, its just like making space with the other views , it has margin top, marginright, marginleft and marginbottom – Gastón Saillén May 29 '18 at 23:48
a better approach should be place that image above your post following and followers view and below your toolbar, if you have this inside a relativelayout you can do it with above and below – Gastón Saillén May 29 '18 at 23:51
This solution hardly can help. – CoolMind Nov 14 '18 at 14:34

score 1 · Answer 2 · edited Oct 12 '20 at 14:56

1

Glide.with(context)
    .load("https://yourImageUrl.jpg")
    .apply(new RequestOptions().circleCrop())
    .into(headerImage);

edited Oct 12 '20 at 14:56

aboger

2,214
6
33
47

answered Oct 12 '20 at 09:43

Tippu Fisal Sheriff

2,177
11
19

2

Please don't post only code as answer, but also provide an explanation what your code does and how it solves the problem of the question. Answers with an explanation are usually more helpful and of better quality, and are more likely to attract upvotes. – Mark Rotteveel Oct 12 '20 at 15:27
Yeah Sure @Mark_Rotteveel, Thanks for your valuable suggestion. – Tippu Fisal Sheriff Oct 13 '20 at 16:17

score 0 · Answer 3 · answered May 30 '18 at 04:19

Try This

Add xml layout:

         <RelativeLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="1dp"
                    android:id="@+id/lay_profpic"
                    android:layout_gravity="center"
                    android:layout_margin="20dp"
                    android:background="@drawable/border_circle">

                    <ImageView
                         android:id="@+id/profile_picture"
                         android:scaleType="centerCrop"
                         android:layout_centerHorizontal="true"
                         android:src="@color/white"
                         android:layout_gravity="center"
                         android:layout_width="90"
                         android:layout_height="90dp" />
                </RelativeLayout>

Add Java code use Glide

Glide.with(this)
                .load(user.getProfilePicture())
                .transform(new CircleTransform(this))
                .into(new GlideDrawableImageViewTarget(ivProfilePicture) {
                    @Override
                    public void onResourceReady(GlideDrawable drawable, GlideAnimation anim) {
                        super.onResourceReady(drawable, anim);
                        ivProfilePicture.setImageDrawable(drawable);
                        ivProfilePicture.invalidate();
                        ivProfilePicture.requestLayout();
                    }
                });

Glide circular image gets cropped

3 Answers3

Linked