Android App Interface ListView Layout in-combat walkthrough _android

I. Inheriting listactivity, using Arrayadapter
using ListView and Arrayadapter layouts is the simplest of ListView layouts, and first we'll create a component to display data, such as Main.xml

<?xml version= "1.0" encoding= "Utf-8"?> 
<!--The main interface itself is a display component--> <textview xmlns:android= 
"http ://schemas.android.com/apk/res/android " 
  android:layout_width=" fill_parent " 
  android:layout_height=" fill _parent " 
  android:padding=" 10DP " 
  android:textsize=" 16sp " 
    > 
 
</TextView> 

The activity code is as follows

Package Cn.com.android.grid; 
 
Import android.app.ListActivity; 
Import Android.os.Bundle; 
Import Android.widget.ArrayAdapter; 
 
public class Listviewtest extends Listactivity { 
 
  @Override 
  protected void onCreate (Bundle savedinstancestate) { 
    super.oncreate (savedinstancestate); 
    String data[] = GetData (); 
    arrayadapter<string> arrayadapter = new Arrayadapter<string> (this, r.layout.main, data); 
    This.setlistadapter (arrayadapter);//Arrayadapter inherits from Baseadapter,baseadapter and inherits from ListAdapter 
     
     
  } 
 
  /** 
   * @author Chenzheng_java 
   * @description get an array list 
   * 
  /private string[] GetData () { 
    string[] data = new STRING[100]; 
    for (int i = 0; i < i++) { 
      data[i] = "list items" + i; 
    } 
    return data; 
     
  } 
   
 

If the activity here does not want to inherit listactivity, then we can write

Package Cn.com.android.grid; 
 
Import android.app.Activity; 
Import Android.os.Bundle; 
Import Android.widget.ArrayAdapter; 
Import Android.widget.ListView; 
 
public class ListViewTest2 extends activity { 
 
  @Override 
  protected void onCreate (Bundle savedinstancestate) { 
    super.oncreate (savedinstancestate); 
     
    ListView ListView = new ListView (this);  
    Listview.setadapter (New arrayadapter<string> (This,r.layout.main,getdata ()));  
    Setcontentview (ListView);  
 
  } 
  /** 
   * @author Chenzheng_java 
   * @description get an array list 
   * 
  /private string[] GetData () { 
    string[ ] data = new STRING[100]; 
    for (int i = 0; i < i++) { 
      data[i] = "list items" + i; 
    } 
    return data; 
     
  } 
   
 

Gums
The two implementation methods write code gap is very large, there are many beginners may be very dizzy. But it doesn't matter, let's see how the Listactivity is implemented together.
The code excerpt is as follows

public class Listactivity extends activity { 
  /** 
   * This field should being made private, so it's hidden from the SDK . 
   * {@hide} * * 
  protected listadapter madapter; 
  /** 
   * This field should being made private, so it is hidden from the SDK. 
   * {@hide} * * 
  protected ListView mlist; 

We see, in fact, when we inherit listactivity, in fact there is already a listactivity inherited from the ListView, so do not think that the gap is very large, in essence, the steps to achieve the same touch. You can assume that Android provides you with a free tool class. It's nothing strange.

Steps, or three strides:
Step one: Prepare the layout file Main.xml
Step two: Get the data getData ()
Step three: Bind the data source Setlistadapter ();

Second, binding data with Simpleadapter
Final Effect Diagram

Directory structure

Main.xml Master layout file, code

<?xml version= "1.0" encoding= "Utf-8"?> <linearlayout xmlns:android= "http://schemas.android.com/apk/res/" 
  Android "android:orientation=" vertical "android:layout_width=" fill_parent "android:layout_height=" Fill_parent " > <textview android:layout_width= "fill_parent" android:layout_height= wrap_content "android:text=" @str 
  Ing/hello "/> <linearlayout android:layout_width= wrap_content" android:layout_height= "Wrap_content" > <textview android:text= "@string/name" android:gravity= "center" android:layout_width= "150px" and roid:layout_height= "Wrap_content"/> <textview android:text= "@string/age" android:gravity= "Cente R "android:layout_width=" 170px "android:layout_height=" Wrap_content "/> </LinearLayout> & Lt ListView android:id= "@+id/listview" android:layout_width= "wrap_content" android:layout_height= "wrap_content"/ > </linearlayouT> 

 

User.xml Component Layout File code

<?xml version= "1.0" encoding= "Utf-8"?> 
<!--Create a component that holds one row of data--> <tablelayout xmlns:android= 
 "Http://schemas.android.com/apk/res/android" 
 android:layout_width= "fill_parent" 
 android:layout_height= "Wrap_content" > 
 <TableRow> 
  
 <imageview 
  android:id= "@+id/image" 
  android:layout_width = "50px"   
  android:layout_height= "50px"  
 ></ImageView> 
  
 <textview 
  android:id= "@+id/ UserName " 
  android:gravity=" center " 
  android:layout_height=" wrap_content " 
  android:layout_width=" 150px " 
 ></TextView> 
  
 <textview 
  android:id=" @+id/userage " 
  android:gravity=" Center " 
  android:layout_height=" wrap_content " 
  android:layout_width=" 170px " 
 ></TextView> 
  
 </TableRow> 
</TableLayout> 

Main Activity,listview.java Code

Package Cn.com.android.listView; 
Import java.util.ArrayList; 
Import Java.util.HashMap; 
Import java.util.List; 
 
Import Java.util.Map; 
Import android.app.Activity; 
Import Android.os.Bundle; 
Import Android.widget.ListView; 
 
Import Android.widget.SimpleAdapter; public class ListView extends activity {@Override public void onCreate (Bundle savedinstancestate) {SUPER.ONCR 
    Eate (savedinstancestate); 
    Setcontentview (R.layout.main); 
    ListView ListView = (ListView) Findviewbyid (R.id.listview); /* parameter is more than one, some people are dizzy. 
     Here, the meaning of each parameter is explained. * The first parameter this represents the current context, which can be understood as the activity you are currently in * the second parameter getData () a list containing the data, note that the list must be stored in a map object. The limit in Simpleadapter is such a list<?  
     Extends map<string,?>> data * Third parameter R.layout.user display information component * Fourth parameter a String array that holds the key in the MAP where you store the data. * Fifth parameter: An int array, the array is stored in your display information component, the specific display position of each data, and the fourth parameter one by one corresponds * * */Simpleadapter adapter = new Simpleadapter (th is, GetData (), R.layout.user, new string[]{"image", "UserName "," Userage "}, New Int[]{r.id.image,r.id.username,r.id.userage}); 
     
  Listview.setadapter (adapter); /** * @author Chenzheng_java * @description prepare some test data * @return A HASHMAP set containing data information * * * Private ARR  Aylist 

Strings.xml Code

<?xml version= "1.0" encoding= "Utf-8"?> 
<resources> 
  <string name= "Hello" > Layout list Show </ string> 
  <string name= "app_name" > List layout </string> 
  <string name= "name" > Name </string> 
  <string name= "Age" > Ages </string> 
</resources> 

Nonsense rolling:
Let's look at the structure, a master layout file, a component layout file, an activity class.
is still divided into three steps:
The first step: Define the layout file, design the UI, including looking for the right picture, and so on ...
Step two: Get the data. Here the simpleadapter is used, so the data must be in a fixed format;
Step three: Bind the data source.
Then we can see the results we want.

Third, the ListView with buttons
Here's what we're looking at: Using custom adapter binding data, and binding data by Contextview.settag, the final result graph

Schematic diagram of code structure

Vlist2.xml Code:

<?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=" fill_parent "> <imageview android:id=" 
 @+id/image "android:layout_width=" wrap_content "android:layout_height=" wrap_content "android:layout_margin=" 5px " /> <linearlayout android:layout_width= "wrap_content" android:layout_height= "Wrap_content" Android:or ientation= "vertical" > <textview android:id= "@+id/title" android:layout_width= "Wrap_content" an droid:layout_height= "Wrap_content" android:textcolor= "#FFFFFFFF" android:textsize= "22px"/> &L T  
    TextView android:id= "@+id/info" android:layout_width= "wrap_content" android:layout_height= "Wrap_content" 
  Android:textcolor= "#FFFFFFFF" android:textsize= "13px"/> </LinearLayout> <button Android:id= "@+id/view_btn" 
  Android:layout_width= "Wrap_content" android:layout_height= "wrap_content" android:text= "click Me" Android:gra 

 vity= "Center"/> </LinearLayout>

Listview3.java Code

Package Cn.com.android2.listview; 
Import java.util.ArrayList; 
 
Import Java.util.HashMap; 
Import android.app.ListActivity; 
Import Android.os.Bundle; 
Import Android.util.Log; 
Import Android.view.View; 
 
Import Android.widget.ListView; public class ListView3 extends listactivity {@Override public void onCreate (Bundle savedinstancestate) {Super 
    . OnCreate (Savedinstancestate); 
    Get the virtual data, the format of the data has strict requirements oh arraylist 

Zujian.java

Package Cn.com.android2.listview; 
 
Import Android.widget.Button; 
Import Android.widget.ImageView; 
Import Android.widget.TextView; 
 
Public final class Zujian {public 
 
  imageview ImageView; 
  Public TextView Titleview; 
  Public TextView InfoView; 
  Public button button; 
   
   
 

Myadapter.java

Package Cn.com.android2.listview; 
Import java.util.ArrayList; 
 
Import Java.util.HashMap; 
Import Android.app.AlertDialog; 
Import Android.content.Context; 
Import Android.content.DialogInterface; 
Import Android.view.LayoutInflater; 
Import Android.view.View; 
Import Android.view.ViewGroup; 
Import Android.view.View.OnClickListener; 
Import Android.widget.BaseAdapter; 
Import Android.widget.Button; 
Import Android.widget.ImageView; 
Import Android.widget.TextView;  
   
  /** * @author Chenzheng_java * @description part of the implementation of this class mimics the Simpleadapter/public class Myadapter extends Baseadapter { 
  Private arraylist 

Gums

The comments in the code are clearly explained here, again, three steps
The first step: Prepare the Master layout file, component layout file, etc.
Step two: Get and organize the data
Part III: Binding data, here we are through their own writing adapter to complete.

ListView at the beginning of the drawing, the system first calls the GetCount () function, based on the length of his return, which is worth the ListView, and then, based on that length, invokes GetView () to draw each row individually.
If your GetCount () returns a value of 0, the list will not show the same return 1, showing only one row.
When the system displays a list, it first instantiates an adapter (this will instantiate the custom adapter). When you manually complete the adaptation, you must manually map the data, which requires overriding the GetView () method. This method is called when the system draws each row of the list.
GetView () has three parameters, position represents the row to be displayed, and Covertview is the layout inflate from the layout file. We use the Layoutinflater method to extract the defined Vlist2.xml file into a view instance for display. The individual components in the XML file are then instantiated (a simple Findviewbyid () method).
This allows the data to be mapped to individual components. But in response to the Click event, the button needs to add a click listener for it to capture the click event. Now that a custom ListView is done, let's go back and look at the process. System to draw ListView, he first obtained the length of the list to be drawn, and then began to draw the first line, how to draw it? Call the GetView () function. In this function you first get a view (actually a viewgroup), and then instantiate and set up each component to display it. All right, I've finished drawing this line. Then draw the next line until the painting is finished. In the actual run, you will find that each row of ListView has no focus, because the button robs the focus of the ListView, as long as the button is set to no focus in the layout file.