Android ListView初步

   一、基本概念

 ListView相信大家一定不陌生,用了安卓手机也有一些时间了,我发现几乎所有的应用都用到了ListView,所以可见ListView是多么重要的一个组件。但是,感觉自己对它的掌握和理解还是差很多,于是根据开发经验以及网上的资料来写一篇文章整理对ListView的理解。

ListView

extends AbsListView
java.lang.Object
   ↳ android.view.View
     ↳ android.view.ViewGroup
       ↳ android.widget.AdapterView<T extends android.widget.Adapter>
         ↳ android.widget.AbsListView
           ↳ android.widget.ListView
Known Direct Subclasses

     ListView是一个显示一个垂直滚动列表中项目的视图,项目来自与此视图相关的ListAdapter。

 

 

    XML属性:

      (4)android:divider  各个项目之间的分隔符,可以用Drawable 或者 color 来表示。

    (2)android:dividerHeight divader的高度。

    (3)android:entries  对数组资源,的引用用来填充列表,事实上很多人用ArrayAdapter。

    还用一个比较重要的方法就是SetAdapter()。当我们实例化一个ListView,然后就调用SetAdapter()方法来进行数据的绑定。其中Adapter一般有以下几种:ArrayAdapter,SimpleAdapter和SimpleCursorAdapter以及BaseAdapter。ArrayAdapter最为简单,只能展示一行字。SimpleAdapter有最好的扩充性,可以自定义出各种效果。SimpleCursorAdapter可以认为是SimpleAdapter对数据库的简单结合,可以方面的把数据库的内容以列表的形式展示出来。

 

   二、实例

       ①用ListView来显示文本,点击文本进入另一个Activity。

    我们用两种方法来实现,一个是用xml属性里的entries,另一个是ArrayAdapter。先用第一种方法,在values文件夹里面新建arrays.xml: 

 

  1. <span style="font-size:14px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <resources>  
  3.   
  4.     <string-array name="listtext">  
  5.         <item>安卓</item>  
  6.         <item>苹果</item>  
  7.         <item>WindowsPhone</item>  
  8.     </string-array>  
  9.   
  10. </resources></span>  
 main.xml中添加ListView组件,如下:  

 

 

  1. <span style="font-size:14px;"><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     tools:context=".ListViewDemo" >  
  6.   
  7.     <ListView  
  8.         android:id="@+id/listview"  
  9.         android:layout_width="match_parent"  
  10.         android:entries="@array/listtext"//用来在ListView显示的文本  
  11.         android:layout_height="match_parent" >  
  12.     </ListView>  
  13.   
  14. </RelativeLayout></span>  
   MainActivity.javaa如下: 

 

 

  1. <span style="font-size:14px;">package com.example.listviewdemo;  
  2. import java.util.ArrayList;  
  3. import java.util.HashMap;  
  4. import java.util.List;  
  5. import java.util.Map;  
  6. import android.os.Bundle;  
  7. import android.app.Activity;  
  8. import android.content.Intent;  
  9. import android.database.DataSetObserver;  
  10. import android.view.Menu;  
  11. import android.view.View;  
  12. import android.view.ViewGroup;  
  13. import android.widget.AdapterView;  
  14. import android.widget.AdapterView.OnItemClickListener;  
  15. import android.widget.ArrayAdapter;  
  16. import android.widget.ListAdapter;  
  17. import android.widget.ListView;  
  18. import android.widget.SimpleAdapter;  
  19.   
  20. public class ListViewDemo extends Activity {  
  21.   
  22.     private ListView listView;  
  23.     private Intent intent;  
  24.     @Override  
  25.     protected void onCreate(Bundle savedInstanceState) {  
  26.         super.onCreate(savedInstanceState);  
  27.         setContentView(R.layout.activity_list_view_demo);  
  28.         listView=(ListView) findViewById(R.id.listview);      
  29.         listView.setOnItemClickListener(new OnItemClickListener() {  
  30.             @Override  
  31.             public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,  
  32.                     long arg3) {  
  33.                 switch(arg2){  
  34.                 case 0:  
  35.                     intent=new Intent(ListViewDemo.this,OtherActivity.class);  
  36.                     startActivity(intent);  
  37.                     break;  
  38.                 case 1:  
  39.                     intent=new Intent(ListViewDemo.this,OtherActivity.class);  
  40.                     startActivity(intent);  
  41.                       
  42.                 case 2:  
  43.                     intent=new Intent(ListViewDemo.this,OtherActivity.class);  
  44.                     startActivity(intent);  
  45.                 }  
  46.                   
  47.             }  
  48.               
  49.         });  
  50.     }     
  51.     @Override  
  52.     public boolean onCreateOptionsMenu(Menu menu) {  
  53.         // Inflate the menu; this adds items to the action bar if it is present.  
  54.         getMenuInflater().inflate(R.menu.activity_list_view_demo, menu);  
  55.         return true;  
  56.     }  
  57.   
  58.   
  59. }</span>  


 

    另一种方式就是ArrayAdapter:

 

  1. <span style="font-size:14px;">public class ListViewDemo  extends Activity {  
  2.    
  3.     private ListView listView;  
  4.     @Override  
  5.     public void onCreate(Bundle savedInstanceState){  
  6.         super.onCreate(savedInstanceState);  
  7.         setContentView(R.layout.activity_list_view_demo);  
  8.         listView=(ListView) findViewById(R.id.listview);  
  9.  listView.setAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_expandable_list_item_1,getData())); setContentView(listView); } private List<String> getData(){ List<String> data = new ArrayList<String>(); data.add("苹果"); data.add("安卓"); data.add("windowsphone"); return data;   
  10. }}</span>  

 

 


 

效果如下:

 

                         

     还有可以用SimpleAdapter和SimpleCursorAdapter往列表中添加图片等其他组件。simpleAdapter的扩展性最好,可以定   义各种各样的布局出来,可以放上ImageView(图片),还可以放上Button(按钮),CheckBox(复选框)等等。  SimpleCursorAdapter比SimpleAdapter多了一个可以从数据库查询数据并显示在ListView中。    当然,我们最常用的还是BaseAdapter,可以根据需求来写我们自己的Adapter。下面这个例子就用到了BaseAdapter。      用过安卓的用户都知道,像软件市场,微信对话里面都用到了ListView。比如软件Marcket里面基本上就是一个ListView,每一个item有一个软件,如图:

                                             

    之前我们在ListView的item里面只是显示文本,这种情况比较适合在设置界面,那Marcket的item是如何实现的呢。无非也就是在item里面显示图片,文本以及按钮。

    下面模仿这个效果做一下:

    xml文件:

    

  1. <span style="font-size:14px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent" >  
  5.   
  6.     <LinearLayout  
  7.         android:id="@+id/linear1"  
  8.         android:layout_width="wrap_content"  
  9.         android:layout_height="wrap_content"  
  10.         android:layout_alignParentLeft="true"  
  11.         android:layout_marginLeft="10dp"  
  12.          >  
  13.   
  14.         <ImageView  
  15.             android:id="@+id/appimg"  
  16.             android:layout_width="40dp"  
  17.             android:layout_height="40dp"  
  18.              />  
  19.     </LinearLayout>  
  20.   
  21.     <LinearLayout  
  22.         android:id="@+id/linear2"  
  23.         android:layout_width="wrap_content"  
  24.         android:layout_height="wrap_content"  
  25.         android:layout_alignBottom="@+id/linear1"  
  26.         android:layout_alignParentTop="true"  
  27.         android:layout_marginLeft="5dp"  
  28.         android:layout_toRightOf="@id/linear1"  
  29.         android:orientation="vertical" >  
  30.   
  31.         <LinearLayout  
  32.             android:id="@+id/sublinear1"  
  33.             android:layout_width="wrap_content"  
  34.             android:layout_height="wrap_content" >  
  35.   
  36.             <TextView  
  37.                 android:id="@+id/appnametext"  
  38.                 android:layout_width="wrap_content"  
  39.                 android:layout_height="wrap_content"   
  40.                 android:text="@string/weixin"  
  41.                 />  
  42.         </LinearLayout>  
  43.   
  44.         <LinearLayout  
  45.             android:id="@+id/sublinear2"  
  46.             android:layout_marginTop="5dp"  
  47.             android:layout_width="wrap_content"  
  48.             android:layout_height="wrap_content"  
  49.             android:orientation="horizontal"  
  50.              >  
  51.   
  52.             <TextView  
  53.                 android:id="@+id/sizetext"  
  54.                 android:layout_width="wrap_content"  
  55.                 android:layout_height="wrap_content"  
  56.                 android:text="@string/weixinsize"  
  57.                  />  
  58.   
  59.             <ImageView   
  60.                 android:id="@+id/slashimg"  
  61.                 android:layout_width="wrap_content"  
  62.                 android:layout_height="wrap_content"  
  63.                 android:layout_marginLeft="3dp"  
  64.                 android:layout_marginRight="3dp"  
  65.                 android:src="@drawable/slash"  
  66.                 />  
  67.             <TextView  
  68.                 android:id="@+id/amounttext"  
  69.                 android:layout_width="wrap_content"  
  70.                 android:layout_height="wrap_content"   
  71.                 android:text="@string/downamount"  
  72.                 />  
  73.         </LinearLayout>  
  74.     </LinearLayout>  
  75.   
  76.     <LinearLayout  
  77.         android:id="@+id/linear3"  
  78.         android:layout_width="wrap_content"  
  79.         android:layout_height="wrap_content"  
  80.         android:layout_alignParentRight="true"  
  81.         android:layout_marginRight="10dp"  
  82.          >  
  83.   
  84.         <Button  
  85.             android:id="@+id/dowmbutton"  
  86.             android:layout_width="wrap_content"  
  87.             android:layout_height="35dp"  
  88.             android:layout_marginTop="5dp"  
  89.             android:text="@string/downapp" />  
  90.   
  91.     </LinearLayout>  
  92.   
  93. </RelativeLayout></span>  
   Activity代码如下:

 

 

  1. <span style="font-size:14px;">package com.example.listviewdemo;  
  2.   
  3. import java.util.ArrayList;  
  4. import java.util.HashMap;  
  5. import java.util.List;  
  6. import java.util.Map;  
  7. import android.os.Bundle;  
  8. import android.app.Activity;  
  9. import android.content.Context;  
  10. import android.content.Intent;  
  11. import android.database.DataSetObserver;  
  12. import android.view.LayoutInflater;  
  13. import android.view.Menu;  
  14. import android.view.View;  
  15. import android.view.ViewGroup;  
  16. import android.widget.AdapterView;  
  17. import android.widget.AdapterView.OnItemClickListener;  
  18. import android.widget.ArrayAdapter;  
  19. import android.widget.BaseAdapter;  
  20. import android.widget.Button;  
  21. import android.widget.ImageView;  
  22. import android.widget.ListAdapter;  
  23. import android.widget.ListView;  
  24. import android.widget.SimpleAdapter;  
  25. import android.widget.TextView;  
  26.   
  27. public class ListViewDemo extends Activity {  
  28.   
  29.     private ListView listView;  
  30.     private Intent intent;  
  31.     private List<Map<String, Object>> mData;  
  32.   
  33.     @Override  
  34.     protected void onCreate(Bundle savedInstanceState) {  
  35.         super.onCreate(savedInstanceState);  
  36.         setContentView(R.layout.activity_list_view_demo);  
  37.         listView = (ListView) findViewById(R.id.listview);    
  38.         SimpleAdapter simpleAdapter = new SimpleAdapter(this, getData(),  
  39.                 R.layout.item, new String[] { "nametext""teitext",  
  40.                         "amounttext" }, new int[] { R.id.name_text,  
  41.                         R.id.tel_text, R.id.image });  
  42.         listView.setAdapter(simpleAdapter);  
  43.         mData = getData();  
  44.             MyAdapter adapter = new MyAdapter(this);  
  45.             listView.setAdapter(adapter);  
  46.     }  
  47.   
  48.     public List<Map<String, Object>> getData() {  
  49.         List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();  
  50.         Map<String, Object> map = new HashMap<String, Object>();  
  51.           
  52.         map.put("appnametext""微信");  
  53.         map.put("sizetext""15.2");  
  54.         map.put("amounttext""1234323");  
  55.         map.put("appimg", R.drawable.weixin);  
  56.         list.add(map);  
  57.           
  58.         map = new HashMap<String, Object>();  
  59.         map.put("appnametext""手机QQ");  
  60.         map.put("sizetext""8.5");  
  61.         map.put("amounttext""122073323");  
  62.         map.put("appimg", R.drawable.qq);  
  63.         list.add(map);  
  64.           
  65.         map = new HashMap<String, Object>();  
  66.         map.put("appnametext""手机QQ空间");  
  67.         map.put("sizetext""6.3");  
  68.         map.put("amounttext""122393");  
  69.         map.put("appimg", R.drawable.qqko);  
  70.         list.add(map);  
  71.           
  72.         map = new HashMap<String, Object>();  
  73.         map.put("appnametext""微博");  
  74.         map.put("sizetext""7.7");  
  75.         map.put("amounttext""1278323");  
  76.         map.put("appimg", R.drawable.weib);  
  77.         list.add(map);  
  78.           
  79.         map = new HashMap<String, Object>();  
  80.         map.put("appnametext""陌陌");  
  81.         map.put("sizetext""6.9");  
  82.         map.put("amounttext""1279073");  
  83.         map.put("appimg", R.drawable.mom);  
  84.         list.add(map);  
  85.           
  86.         map = new HashMap<String, Object>();  
  87.         map.put("appnametext""飞信");  
  88.         map.put("sizetext""6.9");  
  89.         map.put("amounttext""1279073");  
  90.         map.put("appimg", R.drawable.fei);  
  91.         list.add(map);  
  92.         return list;  
  93.     }  
  94.   
  95.     public final class ViewHolder {  
  96.         public ImageView appimg;  
  97.         public TextView appnametext;  
  98.         public TextView sizetext;  
  99.         public TextView amounttext;  
  100.         public Button dowmbutton;  
  101.     }  
  102.   
  103.     public class MyAdapter extends BaseAdapter {  
  104.   
  105.         private LayoutInflater mInflater;  
  106.   
  107.         public MyAdapter(Context context) {  
  108.             this.mInflater = LayoutInflater.from(context);  
  109.         }  
  110.   
  111.         @Override  
  112.         public int getCount() {  
  113.             return mData.size();  
  114.         }  
  115.   
  116.         @Override  
  117.         public Object getItem(int arg0) {  
  118.             return null;  
  119.         }  
  120.   
  121.         @Override  
  122.         public long getItemId(int arg0) {  
  123.             return 0;  
  124.         }  
  125.   
  126.         @Override  
  127.         public View getView(int arg0, View arg1, ViewGroup arg2) {  
  128.             ViewHolder holder = null;  
  129.             if (arg1 == null) {  
  130.   
  131.                 holder = new ViewHolder();  
  132.   
  133.                 arg1 = mInflater.inflate(R.layout.item1, null);  
  134.                 holder.appimg = (ImageView) arg1.findViewById(R.id.appimg);  
  135.                 holder.appnametext = (TextView) arg1.findViewById(R.id.appnametext);  
  136.                 holder.sizetext = (TextView) arg1.findViewById(R.id.sizetext);  
  137.                 holder.amounttext = (TextView) arg1.findViewById(R.id.amounttext);  
  138.                 holder.dowmbutton = (Button) arg1.findViewById(R.id.dowmbutton);  
  139.                   
  140.                 arg1.setTag(holder);  
  141.             } else {  
  142.                 holder = (ViewHolder) arg1.getTag();  
  143.             }  
  144.               
  145.             holder.appimg.setBackgroundResource((Integer) mData.get(arg0).get("appimg"));  
  146.             holder.appnametext.setText((String) mData.get(arg0).get("appnametext"));  
  147.             holder.sizetext.setText((String) mData.get(arg0).get("sizetext"));  
  148.             holder.amounttext.setText((String) mData.get(arg0).get("amounttext"));  
  149.               
  150.             return arg1;  
  151.         }  
  152.   
  153.     }  
  154. }</span>  

 效果如下:

 

                                                                

      虽然效果达到了,但是我们这只是一个本地的显示,实际应用中都是从网络上下载然后展示的。流程应该是从数据库中获取数据,然后封装成josn或xml,之后安卓端异步解析并且显示。关于ListView还有很多要说的东西,优化,分页加载,下拉刷新等等。

  1. <pre></pre>  
  2. <pre></pre>  
  3. <pre></pre>  
  4. <pre></pre>  
  5. <pre></pre>  
posted @ 2013-05-31 09:57  skyyhu  阅读(225)  评论(1编辑  收藏  举报