Add Icons to Android Navigation Drawer?

Question

I have scoured the web for an answer to this question but cannot seem to find one, even in the official Android documentation.

I am in the process of creating an app that implements Android's new Navigation Drawer layout. Documentation of this layout can be found here and here.

In the design documentation as well as in a number of popular apps such as Facebook and Google Currents, the drawer items have icons in front of them.

The design documentation itself mentions them, under "Content of the Navigation Drawer"

Navigation targets can have optional leading icons as well as trailing counters. Use the counters to inform users about a changed state of data in the corresponding view.

Unfortunately, the Developer documentation makes no mention of how to implement icons in this setup. It describes how to implement the list of items as so:

public class MainActivity extends Activity {
private String[] mPlanetTitles;
private ListView mDrawerList;
...

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

    mPlanetTitles = getResources().getStringArray(R.array.planets_array);
    mDrawerList = (ListView) findViewById(R.id.left_drawer);

    // Set the adapter for the list view
    mDrawerList.setAdapter(new ArrayAdapter<String>(this,
            R.layout.drawer_list_item, mPlanetTitles));
    // Set the list's click listener
    mDrawerList.setOnItemClickListener(new DrawerItemClickListener());

    ...
}
}

Because their implementation uses getStringArray(), there is no way I can think of to modify the row item's xml to include an icon.

This is baffling, because many apps seem to implement icons before each text item just fine, and the Design documentation even makes reference to adding icons. I feel that there must be some simple API call to accomplish adding these icons, and yet the only implementation I have found so far seems ridiculously complicated.

Does anyone know how to add icons to the Navigation Drawer items? Is there a way to do this with a simple API call, or have all these companies (Facebook, Google, etc) had to find ways to hack around the problem?

Thanks everyone.

Answer 1

Because their implementation uses getStringArray(), there is no way I can think of to modify the row item's xml to include an icon.

The choice of model data for a ListAdapter has no impact whatsoever on whether the rows created by that ListAdapter can have icons.

Does anyone know how to add icons to the Navigation Drawer items?

Put an ImageView in your row layout for the ListAdapter. Populate that ImageView via your ListAdapter, such as by overriding getView() on your ArrayAdapter. IOW, you do it the same way as you do for any other ListView, as has been done for years.

Is there a way to do this with a simple API call

That depends on your definitions of "simple" and "API call".