Keep image aspect ratio for profile drawer item icons

[raquelhortab]

About this issue

I am using ProfileDrawerItem with a non-square image as icon and the image gets deformed, is there any way to control how the aspect ratio behaves?

Details

• Used library version: com.mikepenz:materialdrawer:6.1.2

this is the code, it's an old app:

ProfileDrawerItem profileDrawerItem = new ProfileDrawerItem().withName(profile.getFullName());

userName = profile.getFullName();

if (profile.getAvatar() != null && profile.getAvatar().getThumbAvatarUrl() != null) {
  profileDrawerItem.withIcon(profile.getAvatar().getThumbAvatarUrl());
  userThumbnail = profile.getAvatar().getThumbAvatarUrl();
}

List<IProfile> list = new ArrayList<>();
list.add(profileDrawerItem);
header.setProfiles(list);

see the top avatar image:

I have tried PrimaryDrawerItem but it seems it does not accept an url, and I've read about DrawerImageLoader on the readme page (I use picasso on the app) but it is not clear how to use it with a DrawerItem, not even on the sample file...

Checklist

• [X] Searched for similar issues
• [ ] Checked out the sample application
• [X] Read the README
• [ ] Checked out the CHANGELOG
• [ ] Read the FAQ
• [ ] Checked out the MIGRATION GUIDE

[raquelhortab]

I see PrimaryDrawerIcon does not work with header.setProfiles(list); anyway.

[mikepenz]

@raquelhortab thank you for the report.

v6.x of the library is end-of-life and only provided anymore as-is.

When using an image loading library I'd suggest to use a transformer (or similar depending on the image loading logic you use) to transform the image into a square image, and then set the square to the item. This will solve the deformation.

Alternative you could also implement your own profile drawer item, but that may be more effort than providing a square right away.

[raquelhortab]

@raquelhortab thank you for the report.

v6.x of the library is end-of-life and only provided anymore as-is.

When using an image loading library I'd suggest to use a transformer (or similar depending on the image loading logic you use) to transform the image into a square image, and then set the square to the item. This will solve the deformation.

Alternative you could also implement your own profile drawer item, but that may be more effort than providing a square right away.

Hey! so I only went from this:

profileDrawerItem.withIcon(url);

to this:

avatarImageTarget = new Target() {
      @Override
      public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
        profileDrawerItem.withIcon(bitmap);
        //...
      }
      @Override
      public void onBitmapFailed(Exception e, Drawable errorDrawable) {
       //...
      }
    };
Picasso.get().load(url).into(avatarImageTarget);

and it's now shown correctly! no transformation required so it seems that passing a bitmap instead of an url solves the problem

Thanks for the help!