Changing ImageView in a HeaderView

Question

So I'm kind of on the new side with Android Studio and Android programming as a whole. I'm currently working on an app that (where one of the features) will pull a user's profile picture from Facebook for example, and change the ImageView in the Navigation Drawer accordingly (for example on the Gmail app where it shows your G+ profile picture). The Facebook bit can be left for another day, however I've been stuck with a certain issue for the past 2 and a half hours, and might need some assistance. My onCreate method looks like the following:

@Override
protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
    fab.setOnClickListener(new View.OnClickListener()
    {
        @Override
        public void onClick(View view)
        {
            Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
                    .setAction("Action", null).show();
        }
    });

    DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
    ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
            this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
    drawer.setDrawerListener(toggle);
    toggle.syncState();

    NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
    navigationView.setNavigationItemSelectedListener(this);

    View headerView = navigationView.inflateHeaderView(R.layout.nav_header_main);

    imgProfilePic = (ImageView) headerView.findViewById(R.id.imgProfilePic);

    imgProfilePic.setImageResource(R.drawable.troll_face);
}

A lot of my onCreate method is still pretty "vanilla", the bit where I think the issue lies is before NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);. My main issue I'm experiencing here is that 2 headers now show up below each other in my Navigation Drawer, the regular one before the .setImageResource() was done, and the one (where the resource was changed) after it.

I have done a lot of Googling with regards to this issue, and some people mentioned it was due to a bug in Android Studio.

Any assistance with my problem would be greatly appreciated.

score 0 · Answer 1 · answered Mar 14 '16 at 19:36

In my application I show picture in this way:

if (mNavigationView.getHeaderCount() > 0) {
        ImageView mBackground = (ImageView) mNavigationView.getHeaderView(0).findViewById(R.id.user_background);
        CircleImageView mUserIcon = (CircleImageView) mNavigationView.getHeaderView(0).findViewById(R.id.user_icon);

        Glide.with(this).load(R.drawable.background).centerCrop().into(mBackground);
        Glide.with(this).load(R.drawable.me).centerCrop().into(mUserIcon);
    }

The important thing that I'd advise for you is using Glide even for settings the picture from resources. This library compresses the picture size and thus makes your app work much faster.

About the question - you have to look for the first and only header. That's the trick in this issue :)

Changing ImageView in a HeaderView

1 Answers1