How to get and populate a menu item created through custom layout?

Question

I've been trying to load an image into a menu item which has been created through a custom layout and have been checking on the official documentation and on posts such as these Custom view for Menu Item but..

That's my onCreateOptionsMenu ond OnPrepareOptionsMenu

  @Override
    public boolean onPrepareOptionsMenu(Menu menu) {
        final MenuItem alertMenuItem = menu.findItem(R.id.action_my_personal);
        FrameLayout rootView = (FrameLayout) alertMenuItem.getActionView();

        redCircle = (FrameLayout) rootView.findViewById(R.id.view_alert_red_circle);
        countTextView = (TextView) rootView.findViewById(R.id.view_alert_count_textview);
        ImageView hc_image_menu_inflated = (ImageView) rootView.findViewById(R.id.hc_image_menu);

        rootView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                onOptionsItemSelected(alertMenuItem);
            }
        });


        if (menu.findItem(R.id.hc_image_menu) != null) {
            loadMenuIcon(menu.findItem(R.id.hc_image_menu), my_image_url);
        }

        return super.onPrepareOptionsMenu(menu);
    }

@Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.toolbar_menu_main, menu);

        return true;
    }

As you can see I have added these lines to avoid the app crashing, as menu.finditem(R.id.hc_image_menu) is returning as null and that's where the problem is, as I want to populate the ImageView that has the id hc_image_menu but am not being successful despite so many attempts

 if (menu.findItem(R.id.hc_image_menu) != null) {
        loadMenuIcon(menu.findItem(R.id.hc_image_menu), my_image_url);
    }

My code for my toolbar_main_menu layout is this:

<item
        android:id="@+id/action_my_personal"
        app:actionLayout="@layout/toolbar_menu_hc"
        android:orderInCategory="100"
        android:title="My Personal Trainer"
        app:showAsAction="always" />

And for my custom layout (toolbar_hc_menu) is this one:

<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="48dp"
android:layout_height="32dp"
android:layout_gravity="center">


<ImageView
    android:id="@+id/hc_image_menu"
    android:layout_marginRight="8dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:src="@drawable/gavin"/>

<FrameLayout
    android:id="@+id/view_alert_red_circle"
    android:layout_width="14dp"
    android:layout_height="14dp"
    android:layout_gravity="top|end"
    android:background="@drawable/date_circle"
    android:visibility="gone"
    tools:visibility="visible">

    <TextView
        android:id="@+id/view_alert_count_textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textColor="@color/white"
        android:textSize="10sp"
        tools:text="3"/>

</FrameLayout>

Thanks very much for any help on that. Really much appreciated!! :)

Answer 1

Issue fixed. :)

I had to load the image into the ImageView after getting the alertMenuItem.

if (my_image_url!= null) {
        Picasso.with(getApplicationContext()).load(my_image_url).into(hc_image_menu_inflated);
    }