Android Navigation Drawer with Image Error

Question

I have written a simple application for navigation Drawer based on this tutorial: https://www.youtube.com/watch?v=tZ2DNC3FIic
but there is a problem when I run the application.

The Error is i am having a blank or Empty Drawer List when i launch the application, and instead of that i Got the list in the application launch.

like this image:

This is the main_activity layout:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:id="@+id/drawer_layout"
    android:layout_height="match_parent"
    tools:context="com.subhi.tabhost.MainActivity">

   <RelativeLayout
       android:layout_width="match_parent"
       android:id="@+id/main_content"
       android:layout_height="match_parent"></RelativeLayout>


    <RelativeLayout
        android:layout_width="match_parent"
        android:id="@+id/drawer_pane"
        android:layout_gravity="start"
        android:background="#FF4081"
        android:layout_height="match_parent"></RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:id="@+id/profile_box"
        android:padding="8dp"
        android:gravity="center_vertical"
        android:layout_height="100dp">


        <ImageView
            android:id="@+id/icon"
            android:layout_margin="5dp"
            android:layout_width="50dp"
            android:background="@drawable/ic_launcher"
            android:layout_height="50dp" />


        <LinearLayout
            android:layout_width="match_parent"
            android:orientation="vertical"
            android:layout_toRightOf="@+id/icon"
            android:layout_height="match_parent">

            <TextView
                android:layout_width="wrap_content"
                android:textSize="18sp"
                android:textStyle="bold"
                android:textColor="#000000"
                android:text="Subhi"
                android:layout_height="wrap_content" />
            <TextView
                android:layout_width="wrap_content"
                android:textSize="18sp"
                android:textStyle="bold"
                android:textColor="#000000"
                android:text="Subhi"
                android:layout_height="wrap_content" />

        </LinearLayout>
    </RelativeLayout>

    <ListView
        android:layout_width="match_parent"
        android:id="@+id/nav_list"
        android:layout_below="@id/profile_box"
        android:choiceMode="singleChoice"
        android:background="#ffffff"
        android:layout_height="match_parent"></ListView>
</android.support.v4.widget.DrawerLayout>

and this is the MainActivity class:

package com.subhi.tabhost;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ListView;
import android.widget.RelativeLayout;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    DrawerLayout drawerLayout;
    RelativeLayout drawerPane;
    ListView lvNav;

    List<NavItem> listNavItems;
    List<Fragment> listFragments;

    ActionBarDrawerToggle actionBarDrawerToggle;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        drawerLayout=(DrawerLayout)findViewById(R.id.drawer_layout);
        drawerPane= (RelativeLayout) findViewById(R.id.drawer_pane);
        lvNav =(ListView)findViewById(R.id.nav_list);

        listNavItems=new ArrayList<NavItem>();
        listNavItems.add(new NavItem("sHome", "HomePage", R.drawable.ic_launcher));
        listNavItems.add(new NavItem("Setting", "HomePage", R.drawable.ic_launcher));
        listNavItems.add(new NavItem("Setting", "HomePage", R.drawable.ic_launcher));

        NavListAdapter navListAdapter=new NavListAdapter(getApplicationContext(),R.id.nav_list,listNavItems);

        lvNav.setAdapter(navListAdapter);

        listFragments=new ArrayList<Fragment>();
        listFragments.add(new MyHome());
        listFragments.add(new MySettings());
        listFragments.add(new MyAbout());

        FragmentManager fragmentManager=getSupportFragmentManager();
        fragmentManager.beginTransaction().replace(R.id.main_content,listFragments.get(0)).commit();


        setTitle(listNavItems.get(0).getTitle());
        lvNav.setItemChecked(0, true);

        drawerLayout.closeDrawer(drawerPane);

        lvNav.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {

                FragmentManager fragmentManager = getSupportFragmentManager();
                fragmentManager.beginTransaction().replace(R.id.main_content, listFragments.get(position)).commit();


                setTitle(listNavItems.get(position).getTitle());
                lvNav.setItemChecked(position, true);

                drawerLayout.closeDrawer(drawerPane);
            }
        });


        actionBarDrawerToggle=new ActionBarDrawerToggle(this,drawerLayout,R.string.drawer_opened,R.string.drawer_closed){

            @Override
            public void onDrawerOpened(View drawerView) {
                invalidateOptionsMenu();
                super.onDrawerOpened(drawerView);
            }

            @Override
            public void onDrawerClosed(View drawerView) {
                invalidateOptionsMenu();
                super.onDrawerClosed(drawerView);
            }
        };

        drawerLayout.setDrawerListener(actionBarDrawerToggle);



    }

    @Override
    protected void onPostCreate(Bundle savedInstanceState) {
        super.onPostCreate(savedInstanceState);
        actionBarDrawerToggle.syncState();
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        return super.onCreateOptionsMenu(menu);
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {

        if(actionBarDrawerToggle.onOptionsItemSelected(item))
            return true;
        return super.onOptionsItemSelected(item);
    }
}

and this is the Navlist Adapter Class:

package com.subhi.tabhost;

import android.annotation.SuppressLint;
import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import java.util.List;

/**
 * Created by subhi on 2/9/2016.
 */
public class NavListAdapter extends ArrayAdapter<NavItem> {

    Context context;
    int reslayout;
    List<NavItem> listNavItem;


    public NavListAdapter(Context context, int reslayout,  List<NavItem> listNavItem) {
        super(context, reslayout,  listNavItem);

        this.context=context;
        this.reslayout=reslayout;
        this.listNavItem=listNavItem;
    }


    @SuppressLint("ViewHolder") @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        View v=View.inflate(context, reslayout, null);

        TextView tvtitle= (TextView) v.findViewById(R.id.titlemain);
        TextView tvsubtitle=(TextView)v.findViewById(R.id.subtitle);
        ImageView navicon= (ImageView) v.findViewById(R.id.nav_icon);

        NavItem navItem=listNavItem.get(position);
        tvtitle.setText(navItem.getTitle());
        tvsubtitle.setText(navItem.getSubtitle());
        navicon.setImageResource(navItem.getResicon());



        return v;
    }
}

and this is the NavItem Class:

package com.subhi.tabhost;

/**
 * Created by subhi on 2/9/2016.
 */
public class NavItem {

    private String title;
    private String subtitle;
    private int resicon;

    public NavItem(String title,String subtitle, int resicon ) {
        this.subtitle = subtitle;
        this.resicon = resicon;
        this.title = title;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getSubtitle() {
        return subtitle;
    }

    public void setSubtitle(String subtitle) {
        this.subtitle = subtitle;
    }

    public int getResicon() {
        return resicon;
    }

    public void setResicon(int resicon) {
        this.resicon = resicon;
    }
}

and this is one of the Fragments that i used when the item is clicked:

package com.subhi.tabhost;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

/**
 * Created by subhi on 2/9/2016.
 */
public class MyHome extends Fragment {

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        View v=inflater.inflate(R.layout.fragment_home,container,false);

        return super.onCreateView(inflater, container, savedInstanceState);
    }
}

and this is the item_nav_list.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:padding="10dp"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/ic_launcher"
        android:id="@+id/nav_icon" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:orientation="vertical"
        android:gravity="center_vertical"
        android:layout_margin="10dp"
        android:layout_height="40dp">


        <TextView
            android:layout_width="wrap_content"
            android:id="@+id/titlemain"
            android:textStyle="bold"
            android:textSize="18sp"
            android:text="Titile"
            android:textColor="#000"
            android:layout_height="wrap_content" />
        <TextView
            android:layout_width="wrap_content"
            android:text="title2"
            android:textSize="18sp"
            android:id="@+id/subtitle"
            android:textColor="#000"
            android:layout_height="wrap_content" />
    </LinearLayout>

</LinearLayout>

score 2 · Answer 1 · answered Feb 09 '16 at 19:08

2

The error is from this line

new NavListAdapter(getApplicationContext(),R.id.nav_list,listNavItems)

The parameter that you have for R.id.nav_list should be a R.layout.nav_item where nav_item.xml is the layout for a row in the NavListAdapter.

answered Feb 09 '16 at 19:08

OneCricketeer

179,855
19
132
245

Sir, Thanks For Answering. i had Modify the Code and the application run but Unfortunately it Starts Showing the Navigation List and when I open the List it Give Blank List – Subhi Feb 09 '16 at 19:17
This answer solves your question, so you can either accept it and make a new one with your new problem, or you can you update your question with the XML for the nav list items – OneCricketeer Feb 09 '16 at 19:23
@SubhiAyman - 1) When you want to notify someone use the **@** feature. 2) Please post new questions for new problems, it is as simple as that. I believe I answered your first problem, but now you want me to rewrite it? That isn't fair to others on this site who could have gained knowledge from this answer and your initial code – OneCricketeer Feb 11 '16 at 07:48

M G · Accepted Answer · 2016-02-09T20:11:05.200

Here

NavListAdapter navListAdapter=new NavListAdapter(getApplicationContext(),R.id.nav_list,listNavItems);

you pass R.id.nav_list which then you want to inflate with

View v=View.inflate(context, reslayout, null);

reslayout cannot be R.id, it has to be layout file (R.layout).

EDIT

Now your main_layout is wrong. Should be like this:

    <?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:id="@+id/drawer_layout"
    android:layout_height="match_parent"
    tools:context="com.subhi.tabhost.MainActivity">

   <RelativeLayout
       android:layout_width="match_parent"
       android:id="@+id/main_content"
       android:layout_height="match_parent"></RelativeLayout>


    <RelativeLayout
        android:layout_width="match_parent"
        android:id="@+id/drawer_pane"
        android:layout_gravity="start"
        android:background="#FF4081"
        android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="match_parent"
        android:id="@+id/profile_box"
        android:padding="8dp"
        android:gravity="center_vertical"
        android:layout_height="100dp">


        <ImageView
            android:id="@+id/icon"
            android:layout_margin="5dp"
            android:layout_width="50dp"
            android:background="@drawable/ic_launcher"
            android:layout_height="50dp" />


        <LinearLayout
            android:layout_width="match_parent"
            android:orientation="vertical"
            android:layout_toRightOf="@+id/icon"
            android:layout_height="match_parent">

            <TextView
                android:layout_width="wrap_content"
                android:textSize="18sp"
                android:textStyle="bold"
                android:textColor="#000000"
                android:text="Subhi"
                android:layout_height="wrap_content" />
            <TextView
                android:layout_width="wrap_content"
                android:textSize="18sp"
                android:textStyle="bold"
                android:textColor="#000000"
                android:text="Subhi"
                android:layout_height="wrap_content" />

        </LinearLayout>
    </RelativeLayout>

    <ListView
        android:layout_width="match_parent"
        android:id="@+id/nav_list"
        android:layout_below="@id/profile_box"
        android:choiceMode="singleChoice"
        android:background="#ffffff"
        android:layout_height="match_parent"></ListView>
</RelativeLayout>
</android.support.v4.widget.DrawerLayout>

Sir, Thanks For Answering. i had Modify the Code and the application run but Unfortunately it Starts Showing the Navigation List and when I open the List it Give Blank List. — Subhi, Feb 09 '16 at 19:15
At the end, second RelativeLayout should be closed just before DrawerLayout is closed and after ListView — M G, Feb 09 '16 at 20:10

Android Navigation Drawer with Image Error

2 Answers2