Loading an image inside a bottom navigation bar item icon using an URL

Question

I'm trying to load a profile image using the firebase storage url inside an item's icon of a bottom navigation bar, here's my code:

 Glide.with(getApplicationContext()).asBitmap().load(profilePicUrl)
    .into(new CustomTarget<Bitmap>() {

        @Override
        public void onResourceReady(@NonNull Bitmap resource, @Nullable Transition<? super Bitmap> transition) {
            Drawable profileImage = new BitmapDrawable(getResources(), resource);
            bottomNav.getMenu().getItem(4).setIcon(profileImage);
        }

        @Override
        public void onLoadCleared(@Nullable Drawable placeholder) {

        }
    });

The profilePicUrl does work, I already use it to for another image view. However when I run the app, the dimensions of the icon changes corresponding to the picture that I'm trying to load but there's no image inside, here's how it looks.

Answer 1

Menus do not support coloured images

You can not use a coloured image in these places and a bit more also:

1. In bottom navigation
2. In navigation drawer
3. In popup menu
4. etc...

Basically which ever view uses a menu file for its resource, cannot have a coloured image. That is why you don't see it. To test it yourself, take a colourful image in your drawable and set it as an icon for the bottom navigation. You notice that it comes the same way. This proves it

Edits

---

1. This post gives some info on how to do it
2. You can do it this way:

   mBottomNav.setItemIconTintList(null);