Android學習之listView顯示下拉列表(2)(SimpleAdapter介面卡)
ListView顯示下拉列表(2)(SimpleAdapter介面卡)
上一篇文章我大概介紹了listView的主要功能以及用ArrayAdapter陣列介面卡實現純文字的下拉列表。但是在現實生活中,純文字的使用率不是很高,更多的是用SimpleAdapter實現圖文並茂的下拉列表,這種機制就和美團app和淘寶app的下拉列表一樣了,但是SimpleAdapter相對比較複雜,下面我來一一介紹。1.首先和ArrayAdapter一樣,要新建一個介面卡。
<span style="background-color: rgb(255, 255, 255); font-family: 'Microsoft YaHei'; font-size: 14px;">我們先宣告它:private SimpleAdapter sim_adapter;</span>
接著就是新建它,這裡要詳細介紹一下SimpleAdapter的幾個引數(content,data,resource,from,to):
content:和ArrayAdapter的一樣指的是上下文,我們就用我們的這個activity,所以用this.
data:是一個泛型資料來源(學過java應該知道什麼是泛型程式設計吧)一個map所組成的list集合
每一個map都會去對應ListView列表中的每一行
每一個map(鍵-值對)中的鍵必須包含在所有的from(下面有這個引數)中所指定的鍵
resource:列表佈局檔案的ID,就是你自己的xml檔案(和ArrayAdapter不同,ArrayAdapter是用android自帶的佈局)
from:map中的鍵名
to:繫結資料檢視中的ID,與from成對應關係
2..新建一個數據源,private List<Map<String,Object>>dataList;dataList=new ArrayList<Map<String,Object>>();
這裡我們用一個函式去新建這個資料來源
我們迴圈插入20行,每一行都是一個hashmap,接著把我們在xml中的圖片的id和文字的id放進put中的第一個引數裡面,圖片的第二個引數我們用自帶的圖片<span style="font-size:18px;"><strong> private List<Map<String,Object>> getdata(){ for (int i=0;i<20;i++){ Map<String,Object>map=new HashMap<String,Object>(); map.put("pic",R.drawable.ic_launcher); map.put("text","zhangxiang"+i); dataList.add(map); } return dataList; }</strong></span>
<span style="font-family:Microsoft YaHei;font-size:14px;">R.drawable.ic_launcher(小機器人),文字中的第二個引數我們隨便寫後面再加上一個i以便與區分,最後將map加入到dataList當中。</span>
3.關於from與to引數,我先把xml的原始碼附上以便解釋(即R.layout.item)
<span style="font-size:18px;"><strong><?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/pic"
android:layout_marginLeft="20dp"
android:layout_width="wrap_content"
android:layout_height="100dp"
android:src="@drawable/ic_launcher"/>
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="100dp"
android:textSize="20sp"
android:text="機器人"
android:paddingTop="40dp"
android:textColor="#ff450a0a"
/>
</LinearLayout></strong></span>
然後我們為from這個引數賦值new String[]{"pic","text"},為了便於對應鍵名就叫做pic與text
接著是to賦值new int []{R.id.pic,R.id.text},pic和text即你在xml中圖片與文字的id
最後新建的介面卡就是這樣的sim_adapter=new SimpleAdapter(this,getdata(),R.layout.item,new String[]{"pic","text"},new int []{R.id.pic,R.id.text});
然後 檢視載入介面卡即可:lv.setAdapter(sim_adapter);
整個activity中的原始碼奉上:
<span style="font-size:18px;"><strong>package xiang24.zhang.myapplicationnew;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AbsListView;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.Hashtable;
import java.util.List;
import java.util.Map;
import javax.xml.datatype.Duration;
public class MainActivity extends Activity {
private ListView lv;//下拉列表
private SimpleAdapter sim_adapter;
private List<Map<String,Object>>dataList;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
lv=(ListView)findViewById(R.id.listView);
//1.新建一個介面卡,新建資料來源
//ArrayAdapter(上下文,當前listView中載入的每一個列表項所對應的佈局檔案,資料來源)
//SimpleAdapter(content,data,resource,from,to)
/*content:上下文,
data:泛型資料來源,一個map所組成的list集合
每一個map都會去對應ListView列表中的每一行
每一個map(鍵-值對)中的鍵必須包含在所有的from中所指定的鍵
resource:列表項佈局檔案的ID
from:map中的鍵名
to:繫結資料檢視中的ID,與from成對應關係
*/
/*
2.介面卡載入資料來源
3.檢視載入介面卡
*/
dataList=new ArrayList<Map<String,Object>>();
sim_adapter=new SimpleAdapter(this,getdata(),R.layout.item,new String[]{"pic","text"},new int []{R.id.pic,R.id.text});
lv.setAdapter(sim_adapter);
}
private List<Map<String,Object>> getdata(){
for (int i=0;i<20;i++){
Map<String,Object>map=new HashMap<String,Object>();
map.put("pic",R.drawable.ic_launcher);
map.put("text","zhangxiang"+i);
dataList.add(map);
}
return dataList;
}
}
</strong></span>
最後實現的效果如圖所示:如果下拉列表會顯示剩餘資料(注意這裡出現的文字是zhangxiang+i,而不是我們在xml中定義的text的值)。
<img src="https://img-blog.csdn.net/20141214011032953?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvY2hpZWZfSVRfb3BlcmF0ZQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" align="left" width="250" height="350" style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);" alt="" />
注:感謝觀看,如果有喜歡android程式設計的同學可以加我qq805198265,大家一塊學習進步啊!