How to set user avatar for Navigation drawer via url in android?

Question

This is my header.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="@dimen/nav_header_height"
    android:background="@drawable/side_nav_bar"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:theme="@style/ThemeOverlay.AppCompat.Dark" android:orientation="vertical"
    android:gravity="bottom">

    <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:paddingTop="@dimen/nav_header_vertical_spacing"
        android:src="@android:drawable/sym_def_app_icon" android:id="@+id/imageView" />

    <TextView android:layout_width="match_parent" android:layout_height="wrap_content"
        android:paddingTop="@dimen/nav_header_vertical_spacing" android:text="Android Studio"
        android:textAppearance="@style/TextAppearance.AppCompat.Body1" />

    <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:text="android.studio@android.com" android:id="@+id/textView" />

</LinearLayout>

This is my oncreate method, i am using Navigation view

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

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

        ImageLoader.getInstance().init(ImageLoaderConfiguration.createDefault(MainActivity.this));
        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);
        ImageView imageView = (ImageView) navigationView.getHeaderView(0).findViewById(R.id.imageView);
        ImageLoader.getInstance().displayImage("https://www.google.co.in/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png", imageView);
    }

I tried this, but the image is not changing at all? Nothings happening,i have included universalimageloader.jar, and added all dependencies too. what can be the issue?

Answer 1

I assume that you use NavigationView from Android Design Support Library as in the link: Android blogspot

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

<!-- your content layout -->

<android.support.design.widget.NavigationView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/drawer_header"
        app:menu="@menu/drawer"/>
</android.support.v4.widget.DrawerLayout>

With drawer_header.xml as:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="match_parent"
          android:layout_height="100dp"
          android:gravity="bottom"
          android:orientation="vertical"
          android:theme="@style/ThemeOverlay.AppCompat.Dark">
<ImageView
    android:id="@+id/ivHeader"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>
</LinearLayout>

This is how I load image for ImageView in header using UniversalImageLoader :

initImageLoader(this);
NavigationView navigationView = (NavigationView) findViewById(R.id.navigation);
ImageView imageView = (ImageView) navigationView.getHeaderView(0).findViewById(R.id.ivHeader);
ImageLoader.getInstance().displayImage("YourImageUrl", imageView);

Note that from version compile 'com.android.support:design:23.1.1' , HeaderView can be find by using navigationView.getHeaderView(0) . Hope it helps.

Answer 2

Kingfisher's Answer is correct, but Image caching is not good, i tried using, Ion library, and its functional too.. and caches image better.

OnCreate
{
        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);
        imageView = (ImageView) navigationView.getHeaderView(0).findViewById(R.id.imageView);
loadWebImage(imageView);
}

     private void loadWebImage(final ImageView imageView) {
            final String URL = "http://d22r54gnmuhwmk.cloudfront.net/app-assets/global/default_user_icon-7a95ec473c1c41f6d020d32c0504a0ef.jpg";
            Ion.with(this).load(URL).asBitmap().setCallback(new FutureCallback<Bitmap>() {
                @Override
                public void onCompleted(Exception e, Bitmap result) {
                    if (e == null) {
                        imageView.setImageBitmap(result);
                    } else {
                        Toast.makeText(getApplicationContext(),e.toString(),Toast.LENGTH_LONG).show();

                        Toast.makeText(getApplicationContext(),"not found",Toast.LENGTH_LONG).show();
                        imageView.setImageResource(R.mipmap.ic_launcher);
                    }
                }
            });
        }