Android Simple List App

Android Simple Lists: 1 2 3

In this section, we're going to tackle Android Lists. You've no doubt seen may apps that use a list view. They look like this:

Android Phone Emulator showing a Simple List App

If there are too many items in the list, you can scroll down to see more.

When you select an item on the list, you typically go to a new Activity. In the image below, we've selected Ruby on Rails from the previous list of programming courses:

Second Activity started from a Simple List

Let's make a start in creating a simple list that goes to a second screen when a list item is selected.

Start a new project for this. Type Simple List as the application name, and Empty Activity as the template. When your project loads, click on the activity_main.xml tab. Make sure you are in Design view and not Text view. Click on the default "Hello World" TextView and press the delete key on your keyboard to get rid of it. In the Palette area on the left, expand the Containers item and locate ListView:

ListView showing in the Android Studio palette

Drag one onto your blank Activity (or onto the Component Tree). It should look like this:

A ListView showing on a layout

As you can see, it's an empty container. It will get filled with your list items when your app is up and running.

To add the constraint, make sure your ListView is selected. Now click the Infer Constraints icon in the toolbar:

Teh Infer Constraints icon in Android Studio

Take a look at the properties area on the right and it should look like this:

The properties area for a ListView

In the ID property at the top, type myListView. We'll need this ID in our code:

Adding an ID for a ListView

If you have a look at your layout, it may have turned into this:

A default ListView showing in the layout editor

These are default placeholders for a TextView and a sub TextView. We'll be replacing Item 1, Item2, Item 3, etc, with our own headings. (We'll be making use of the sub views in the next section, and adding an image to the left of the TextViews.)

That's all we need for the design of the layout. We can get some coding done now.