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

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.

>Solution :

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);