int count) {
selection.setText(edit.getText());
}
public void beforeTextChanged(CharSequence s, int start,
int count, int after) {
// needed for interface, but not used
}
public void afterTextChanged(Editable s) {
// needed for interface, but not used
}
}
This time, our activity implements TextWatcher, which means our callbacks are onTextChanged() and beforeTextChanged(). In this case, we are only interested in the former, and we update the selection label to match the AutoCompleteTextView’s current contents.
Figures 8-6, 8-7, and 8-8 show the application results.
Figure 8-6. The AutoCompleteDemo sample application, as initially launched
Figure 8-7. The same application, after a few matching letters were entered, showing the auto-complete drop-down
Figure 8-8. The same application, after the auto-complete value was selected
Galleries, Give or Take the Art
The Gallery widget is not one ordinarily found in GUI toolkits. It is, in effect, a horizontally-laid-out listbox. One choice follows the next across the horizontal plane, with the currently-selected item highlighted. On an Android device, one rotates through the options through the left and right D-pad buttons.
Compared to the ListView, the Gallery takes up less screen space while still showing multiple choices at one time (assuming they are short enough). Compared to the Spinner, the Gallery always shows more than one choice at a time.
The quintessential example use for the Gallery is image preview — given a collection of photos or icons, the Gallery lets people preview the pictures in the process of choosing one.
Code-wise, the Gallery works much like a Spinner or GridView. In your XML layout, you have a few properties at your disposaclass="underline"
• android:spacing controls the number of pixels between entries in the list.
• android:spinnerSelector controls what is used to indicate a selection — this can either be a reference to a Drawable (see the resources chapter) or an RGB value in #AARRGGBB or similar notation.
• android:drawSelectorOnTop indicates if the selection bar (or Drawable) should be drawn before (false) or after (true) drawing the selected child — if you choose true, be sure that your selector has sufficient transparency to show the child through the selector, otherwise users will not be able to read the selection.
CHAPTER 9
Getting Fancy with Lists
The humble ListView is one of the most important widgets in all of Android, simply because it is used so frequently. Whether choosing a contact to call or an email message to forward or an ebook to read, ListView widgets are employed in a wide range of activities. Of course, it would be nice if they were more than just plain text.
The good news is that they can be as fancy as you want, within the limitations of a mobile device’s screen, of course. However, making them fancy takes some work and some features of Android that I will cover in this chapter.
Getting to First Base
The classic Android ListView is a plain list of text — solid but uninspiring. This is because all we hand to the ListView is a bunch of words in an array, and we tell Android to use a simple built-in layout for pouring those words into a list.
However, you can have a list whose rows are made up of icons, or icons and text, or checkboxes and text, or whatever you want. It is merely a matter of supplying enough data to the adapter and helping the adapter to create a richer set of View objects for each row.
For example, suppose you want a ListView whose entries are made up of an icon, followed by some text. You could construct a layout for the row that looks like this, found in the FancyLists/Static sample project available in the Source Code section of the Apress Web site:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="@+id/icon"
android:layout_width="22px"
android:paddingLeft="2px"
android:paddingRight="2px"
android:paddingTop="2px"
android:layout_height="wrap_content"
android:src="@drawable/ok"
/>
<TextView
android:id="@+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="44sp"
/>
</LinearLayout>
This layout uses a LinearLayout to set up a row, with the icon on the left and the text (in a nice big font) on the right.
By default, though, Android has no idea that you want to use this layout with your ListView. To make the connection, you need to supply your Adapter with the resource ID of the custom layout shown in the preceding code:
public class StaticDemo extends ListActivity {
TextView selection;
String[] items={"lorem", "ipsum", "dolor", "sit", "amet",
"consectetuer", "adipiscing", "elit", "morbi", "vel",
"ligula", "vitae", "arcu", "aliquet", "mollis",
"etiam", "vel", "erat", "placerat", "ante",
"porttitor", "sodales", "pellentesque", "augue",
"purus"};
@Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.main);
setListAdapter(new ArrayAdapterString(this,
R.layout.row, R.id.label, items));
selection = (TextView)findViewById(R.id.selection);
}
public void onListItemClick(ListView parent, View v,
int position, long id) {
selection.setText(items[position]);