跟我學Android之十一 列表和適配器

視頻課：https://edu.csdn.net/course/play/7621

本章內容

第1節  列表類視圖概述

第2節  列表視圖ListView

第3節  下拉視圖Spinner

本章目標

理解 MVC 模式的設計思想 。

瞭解 AdapterView 的繼承關係圖 。

掌握掌握使用各種適配器顯示列表數據。

掌握列表視圖 ListView 的用法。

掌握下拉視圖 Spinner 的用法。

列表控件是界面設計中一種經常使用的控件

u主要用於展示一系列數據項供用戶選擇或瀏覽，好比：

Ø收件箱中的郵件標題列表

Ø通信錄中的聯繫人列表

Ø註冊用戶時的城市選擇列表

uAndroid系統中提供了多種形式的列表展示

Ø單選列表

Ø多選列表

Ø可展開列表

Android列表採用了MVC的設計模式

u用戶前端界面與後端的數據分離

uMVC設計模式的思想以下

Ø視圖模塊負責顯示用戶界面和響應用戶動做

Ø模型模塊負責管理維護數據

Ø控制器負責執行業務邏輯

AdapterView具備以下特徵。

uAdapterView繼承了 ViewGroup,它的本質是容器。

uAdapterView能夠包括多個「列表頊」，並將多個「列表項」以合適的形式示出來。

uAdapterView顯示的多個「列表項」由Adapter提供。調用AdapterView的setAdapter(Adapter)方法設置 Adapter便可。

經常使用列表視圖

ListView （列表視圖 ）

Spinner ( 下拉視圖 )

GridView （網格視圖 ）

ExpandableListView ( 可展開的列表組件 )

適配器在列表控件中的用途

u適配器就是列表控件的模型

Ø爲列表控件提供數據

Ø爲列表項提供了顯示視圖

適配器的基類是android.widget.Adapter

u定義了數據提供者的標準

u提供了不少子類實現了多種數據的提供手段，經常使用的實現類以下

ØArrayAdapter:簡單、易用的Adapter.一般用於將數組或List集合的多個值包裝成多個列表項。

ØSimpleAdapter:並不簡單、功能強大的Adapter。可用於將List集合的多個對象包裝成多個列表項。

ØBaseAdapter一般用於被擴展。擴展BaseAdapter能夠對各列表項進行最大限度的定製。

ListView控件用於以列表形式顯示數據

uListView採用MVC模式將前端顯示和後端數據進行了分離

ØListView裝載數據時並不使用ListView自己的方法

Ø經過指定一個Adapter對象給ListView提供數據

uListView顯示效果以下

與列表相關的主要事件有兩個

uItemSelected（列表項被選中時發生）

Ø經過列表控件的setOnItemSelectedListener()實現監聽

uItemClick（單擊列表項時發生）

Ø經過列表控件的setOnItemClickListener()實現監聽

uItemLongClick（長按列表項時發生）

Ø經過列表控件的setOnItemLongClickListener()實現監聽

使用數組做爲數據源

<ListView  	android:layout_width="fill_parent" 	android:layout_height="wrap_content" 	android:entries="@array/fruits"	android:divider="#f00"	android:dividerHeight="2px"	android:headerDividersEnabled="false"	/></LinearLayout>

 

ArrayAdapter經過數組爲列表控件提供數據， 構造ArrayAdapter的對象

<span style="font-size:14px;">String [] data = getResources().getStringArray(R.array.data);ArrayAdapter<String> adapter =new ArrayAdapter<String>(MainActivity.this,android.R.layout.simple_list_item_1, data);</span>

Ø第二個參數表示爲列表控件提供列表項的顯示視圖

Ø第三個參數即爲適配器所須要的數組數據

u使用ArrayAdapter對象做爲列表控件的數據源

<span style="font-size:14px;">ListView lv = (ListView)findViewById(R.id.listview);lv.setAdapter(adapter);</span>

設置可多選的ListView

<span style="font-size:14px;">final String[] arr1 = { "孫悟空", "豬八戒", "沙和尚" ,"白骨精"};ArrayAdapter<String> adapter1 = new ArrayAdapter<String>		(this, android.R.layout.simple_list_item_multiple_choice, arr1);list1.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);		// 爲ListView設置Adapter		list1.setAdapter(adapter1);</span>

SimpleAdapter概述

SimpleAdapter能夠用於顯示覆雜數據

uSimpleAdapter能夠在列表的一項中提供和顯示多個數據

uSimpleAdapter須要自定義數據結構和顯示視圖佈局

uSimpleAdapter的構造須要5個參數

Øcontext：爲使用SimpleAdapter的上下文

Ødata：爲用於顯示的具體數據

l這是一個map對象的list，list中的每一項是一個map

lmap中的每一項對應着列表項顯示視圖中的一個內容

Øresource：用於顯示具體數據的佈局資源

Øfrom：data數據中map所包含的每個項中key的名字的數組

Øto：map中的每個key的內容所對應的顯示視圖的資源id的數組

使用SimpleAdapter顯示覆雜數據須要設計好數據內容

u不過視圖如何複雜，列表的每一項內容由多個數據字段構成

u在提供數據的時候，須要爲每個數據字段設計一個名字

Ø字段名字和具體數據構成鍵值對，存放在map對象中

List<Map<String, Object>> listItems =				new ArrayList<Map<String, Object>>();for (int i = 0; i < names.length; i++){Map<String, Object> listItem = new HashMap<String, Object>();	listItem.put("header", imageIds[i]);	listItem.put("personName", names[i]);	listItem.put("desc", descs[i]);	listItems.add(listItem);}

顯示覆雜列表

u首先須要爲複雜數據結構定義用於顯示的列表項佈局

Ø佈局文件：R.layout.simple_item

Ø該文件包含一個頭像ImageView，名字TextView，簡介TextView

顯示覆雜列表，而後在ListView中使用SimpleAdapter

SimpleAdapter simpleAdapter = new SimpleAdapter(this, listItems,			R.layout.simple_item,			new String[] { "personName", "header" , "desc"},			new int[] { R.id.name, R.id.header , R.id.desc });ListView list = (ListView) findViewById(R.id.mylist);// 爲ListView設置Adapterlist.setAdapter(simpleAdapter);

系統內置列表項

Android爲列表控件提了一些基本的列表項佈局

u佈局基本都在android.R.layout中

Øandroid.R.layout.simple_list_item_1

Øandroid.R.layout.simple_list_item_2

Øandroid.R.layout.simple_list_item_checked

Øandroid.R.layout.simple_list_item_multiple_choice

Øandroid.R.layout.simple_list_item_single_choice

列表項的常見規劃設計

u在實際應用中，列表項顯示設計每每是多種多樣的

u一些常見的設計效果以下：

建立自定義適配器

u編寫自定義適配器，選擇繼承android.widget.BaseAdapter

u一般爲適配器關聯一個list，用於數據的提供

u覆蓋public int getCount()方法，用於告知列表有多少項數據

public int getCount() {return dataList.size();}

u覆蓋getView()方法，用於向列表提供列表項的顯示視圖

View getView (int position, View convertView, ViewGroup parent)

Ø列表項視圖一般有兩種方法

l經過佈局資源定義，而後採用動態加載的方法使用

l經過程序實現佈局

建立自定義適配器， 

getView()方法覆蓋示例

public View getView(int position, View convertView, ViewGroup parent) {String ns = Context.LAYOUT_INFLATER_SERVICE;LayoutInflater li = (LayoutInflater)context.getSystemService(ns);View layout = li.inflate(R.layout.simple_item, null);TextView titleView = (TextView)layout.findViewById(R.id.title);TextView bodyView = (TextView)layout.findViewById(R.id.body);Mail m = dataList.get(position);titleView.setText(m.getTitle());bodyView.setText(m.getMessage());return layout;}

使用自定義適配器實現動態顯示數據

u所謂動態顯示就是在運行過程當中經過程序增刪改列表項

u在自定義適配器中添加增刪改數據的方法

Ø在改變數據完成後必定要通知視圖

public void addMail(Mail m) {dataList.add(m);notifyDataSetChanged();}

Spinner控件用於顯示一個下拉列表

uSpinner採用MVC模式將前端顯示和後端數據進行了分離

ØSpinner裝載數據時並不使用Spinner自己的方法

Ø經過指定一個Adapter對象給Spinner提供數據

uSpinner顯示效果以下

 

建立Spinner

uSpinner至關於Android系統中的combobox（下拉選擇框）

uSpinner一樣使用Adapter提供數據顯示

u在佈局中使用<Spinner>標籤佈局

<Spinner  android:id="@+id/spinner"android:layout_width="match_parent"android:layout_height="wrap_content" />

u在Activity中獲取Spinner對象

Spinner  spinner = (Spinner)findViewById(R.id.spinner);

利用Spinner顯示數據

u在資源中準備要顯示的數據數組

<string-array name="moviearray"><item>獅子王</item><item>叢林大冒險</item><item>米老鼠和唐老鴨</item><item>黑貓警長</item></string-array>

u經過ArrayAdapter給Spinner提供數據顯示

String [] data = getResources().getStringArray(R.array.moviearray);ArrayAdapter<String> adapter = new ArrayAdapter<String>(MainActivity.this,android.R.layout.simple_spinner_item, data);s.setAdapter(adapter);

實現帶圖片的Spinner

u須要自定義Spinner的列表項視圖

u使用自定義列表項視圖的辦法有多種

Ø經過自定義適配器來使用

Ø經過繼承ArrayAdapter，覆蓋getDropDownView()方法

實現帶圖片的Spinner，經過覆蓋getDropDownView()方法實現自定義視圖

ArrayAdapter<CharSequence> adapter =new ArrayAdapter<CharSequence>(this, android.R.layout.spinner_item, p) {@Overridepublic View getDropDownView(int position, View convertView, ViewGroup parent) {View view = getLayoutInflater().inflate(R.layout.spinner_item, parent, false);TextView label = (TextView) view.findViewById(R.id.label);label.setText(getItem(position));if (spinner.getSelectedItemPosition() == position) {label.setTextColor(getResources().getColor(R.color.selected_fg));view.setBackgroundColor(getResources().getColor(R.color.selected_bg));view.findViewById(R.id.icon).setVisibility(View.VISIBLE);}return view;}};

後必定要通知視圖