How to add icons to items in a navigation drawer

Question

I would like to have icons next to my items in my navigation drawer that I have set up like this:

    Titles = getResources().getStringArray(R.array.array1);
    Icons = getResources().getIntArray(R.array.icons);
    mDrawerLayout = (DrawerLayout)findViewById(R.id.Welcome);
    mDrawerList = (ListView) findViewById(R.id.left_drawer);
    mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow, GravityCompat.START);
    mDrawerList.setAdapter( new ArrayAdapter<String>(this, R.layout.drawer_list_item, Titles));

I know that the process must involve adding an image view to the text view that is in the XML for the drawer_list_item but I'm not sure how to do that. What is the best way to accomplish this?

This is my drawer_list_item.xml:

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:gravity="center_vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textColor="#111"
android:background="?android:attr/activatedBackgroundIndicator"
android:minHeight="?android:attr/listPreferredItemHeightSmall"/>

Solution 1

The Navigation Drawer is essentially a list view. Create a drawer_item.xml with whatever layout you want (text+imageview) and pass it to the arrayAdapter. Then when populating the listView (in the getview method), assign the imageView to the drawable of your choosing.

Solution 2

**R.layout.my drawer_list_item.xml**

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="60dp" >

    <ImageView
        android:id="@+id/flag"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:paddingLeft="10dp"
        android:paddingTop="10dp"
        android:paddingRight="10dp"
        android:paddingBottom="10dp"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:contentDescription="@string/app_name" />

    <TextView
        android:id="@+id/country"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/flag"
        android:layout_centerVertical="true"
        android:textSize="15sp" />

    <TextView
        android:id="@+id/count"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:gravity="center"
        android:padding="0dp"
        android:background="@color/DarkGray"
        android:textSize="15sp" />

</RelativeLayout>


**java code**

 private SimpleAdapter mAdapter;
    private List<HashMap<String,String>> mList ;
    final private String ITEM = "item";
    final private String FLAG = "flag";
    final private String COUNT = "count";
    String[] mCountries =new String[]{"item 1","item 2","item3"} ;
    int[] mFlags = new int[]{
            R.drawable.abc_ic_clear,
            R.drawable.abc_ic_clear,
            R.drawable.abc_ic_clear,

    };
String[] mCount = new String[]{
 "1", "2", "3" };


    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);


        mList = new ArrayList<HashMap<String,String>>();
        for(int i=0;i<3;i++){
            HashMap<String, String> hm = new HashMap<String,String>();
            hm.put(ITEM, mCountries[i]);
            hm.put(COUNT, mCount[i]);
            hm.put(FLAG, Integer.toString(mFlags[i]) );
            mList.add(hm);
        }
    }


**set adapter for ListView**

 @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
    mDrawerListView = (ListView) inflater.inflate(
            R.layout.fragment_navigation_drawer, container, false);
    mDrawerListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            selectItem(position);
        }
    });

    String[] from = { FLAG,ITEM,COUNT };


    int[] to = { R.id.flag , R.id.country , R.id.count};

    mAdapter = new SimpleAdapter(getActionBar().getThemedContext(), mList, R.layout.my drawer_list_item, from, to);
    mDrawerListView.setAdapter(mAdapter);
    mDrawerListView.setItemChecked(mCurrentSelectedPosition, true);
    return mDrawerListView;
}