列表視圖（ListView）是Android平臺(tái)下用于顯示不定數(shù)量的數(shù)據(jù)最有用的視圖控件之一。在這個(gè)教程中，我們將向你展示如何使用ListView來(lái)瀏覽文章列表。

　　在之前的文章中，你看到了許多關(guān)于不同布局控件的教程。在今天這個(gè)教程中，你將結(jié)合使用它們。應(yīng)用程序本身非常簡(jiǎn)單：它將顯示文章標(biāo)題列表，當(dāng)點(diǎn)擊標(biāo)題時(shí)，顯示文章內(nèi)容。這篇文章的節(jié)奏將比我們的入門(mén)教程更快一些。如果你對(duì)基本的Android控件或概念不熟悉你可能需要復(fù)習(xí)這個(gè)網(wǎng)站上我們其它的一些教程，甚至是Android API參考。最終的開(kāi)源代碼可以在Google code上下載到。

步驟1: 創(chuàng)建項(xiàng)目

　　在Eclipse中創(chuàng)建一個(gè)新的Android項(xiàng)目。我們將項(xiàng)目命名為MT-List，起始活動(dòng)命名為T(mén)utListActivity。這個(gè)Activity必須繼承ListActivity類(lèi)，它是一個(gè)特殊的Activity類(lèi)，用于幫助管理ListView控件。我們使用的是Android2.3.3的API。

步驟2: 設(shè)計(jì)列表界面

　　實(shí)際上，這一步要做的很少。一個(gè)由重復(fù)項(xiàng)組成的ListView控件，每一項(xiàng)都有相同的布局（一項(xiàng)一個(gè)模板）。我們想要顯示一個(gè)文章標(biāo)題列表。每個(gè)標(biāo)題都是ListView中的一項(xiàng)。因此，每個(gè)列表項(xiàng)的模板只需要一個(gè)TextView控件。在你的項(xiàng)目中添加一個(gè)叫做list_item.xml布局資源文件，它描述了列表中的每一項(xiàng)的模板布局。在這個(gè)例子中，它看起來(lái)可能像這樣：

<?xml version="1.0" encoding="utf-8"?>
<TextView
xmlns:android="//schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="24dp"
android:padding="6dp" />

　　字號(hào)加上填充屬性值要確保在平均大小的屏幕下列表每一項(xiàng)對(duì)于平均手指的大小來(lái)說(shuō)是足夠大的觸摸目標(biāo)。

步驟3: 為L(zhǎng)istView填充數(shù)據(jù)

　　ListView控件設(shè)計(jì)用于從數(shù)據(jù)源加載數(shù)據(jù)。可以使用適配器從數(shù)據(jù)庫(kù)，數(shù)組或其它數(shù)據(jù)源讀取數(shù)據(jù)。在這個(gè)程序中我們使用數(shù)組作為數(shù)據(jù)源。今后，你可以將數(shù)組替換為某些實(shí)時(shí)數(shù)據(jù)源。在你的項(xiàng)目中創(chuàng)建兩個(gè)字符串?dāng)?shù)組（你可以將他們添加到strings.xml或者一個(gè)分離的arrays.xml文件，隨你愿意）。將一個(gè)數(shù)組取名為“tut_titles”，另一個(gè)名為“tut_links”。用網(wǎng)站上的有效的標(biāo)題和URL填充這兩個(gè)數(shù)組。下面是我們的數(shù)組：

<string-array name="tut_titles">
<item>Design &amp; Build a 1980s iOS Phone App: Design Comp Slicing</item>
<item>Best of Tuts+ in February 2011</item>
<item>Create a Brick Breaker Game with the Corona SDK: Game Controls</item>
<item>Exporting Graphics for Mobile Apps: PNG or JPEG?</item>
<item>Android Tablet Design</item>
<item>Build a Titanium Mobile Pizza Ordering App: Order Form Setup</item>
<item>Create a Brick Breaker Game with the Corona SDK: Application Setup</item>
<item>Android Tablet Virtual Device Configurations</item>
<item>Build a Titanium Mobile Pizza Ordering App: Topping Selection</item>
<item>Design &amp; Build a 1980s iOS Phone App: Interface Builder Setup</item>
</string-array>
<string-array name="tut_links">
<item>//mobile.tutsplus.com/tutorials/mobile-design-tutorials/80s-phone-app-slicing/</item>
<item>//mobile.tutsplus.com/articles/news/best-of-tuts-in-february-2011/</item>
<item>//mobile.tutsplus.com/tutorials/corona/create-a-brick-breaker-game-with-the-corona-sdk-game-controls/</item>
<item>//mobile.tutsplus.com/tutorials/mobile-design-tutorials/mobile-design_png-or-jpg/</item>
<item>//mobile.tutsplus.com/tutorials/android/android-tablet-design/</item>
<item>//mobile.tutsplus.com/tutorials/appcelerator/build-a-titanium-mobile-pizza-ordering-app-order-form-setup/</item>
<item>//mobile.tutsplus.com/tutorials/corona/corona-sdk_brick-breaker/</item>
<item>//mobile.tutsplus.com/tutorials/android/android-sdk_tablet_virtual-device-configuration/</item>
<item>//mobile.tutsplus.com/tutorials/appcelerator/pizza-ordering-app-part-2/</item>
<item>//mobile.tutsplus.com/tutorials/iphone/1980s-phone-app_interface-builder-setup/</item>
</string-array>

　　當(dāng)然這個(gè)數(shù)據(jù)是靜態(tài)的。在一些情況下，使用靜態(tài)數(shù)據(jù)對(duì)于一個(gè)ListView來(lái)說(shuō)也是有意義的。對(duì)于這些情況，使用一個(gè)字符串?dāng)?shù)組資源非常簡(jiǎn)單和方便。需要確保標(biāo)題和鏈接的排序是一致的，這樣兩個(gè)數(shù)組才能匹配。

步驟4: 將數(shù)組適配到ListView

　　現(xiàn)在程序已經(jīng)有數(shù)據(jù)了，現(xiàn)在來(lái)顯示它們。回到TutListActivity.java，修改onCreate()方法，使用setListAdapter()方法來(lái)加載數(shù)據(jù)。和常規(guī)的活動(dòng)不一樣，對(duì)于整個(gè)活動(dòng)就僅僅只是一個(gè)ListView的情況，ListActivity不需要使用setContentView()。完成后，你的整個(gè)ListActivity將看起來(lái)像這樣：

public class TutListActivity extends ListActivity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setListAdapter(ArrayAdapter.createFromResource(getApplicationContext(),
R.array.tut_titles, R.layout.list_item));
}
}

　　這時(shí)候，你已經(jīng)可以運(yùn)行這個(gè)程序了。你將看到一個(gè)具有所有本教程中所有標(biāo)題的ListView。上劃和下劃都正常。但是，點(diǎn)擊標(biāo)題還沒(méi)有任何反應(yīng)。

步驟5：處理ListView條目點(diǎn)擊

　　處理ListView中條目的點(diǎn)擊與其它視圖對(duì)象的處理方式相似：使用偵聽(tīng)器（listener）。在這里，我們關(guān)注OnTimeClickListener。你可能注意到我們還沒(méi)有直接處理過(guò)ListView對(duì)象。現(xiàn)在是時(shí)候了。在ListActivity中，簡(jiǎn)單地調(diào)用getListView()方法來(lái)遍歷ListView，然后調(diào)用setOnItemClickListener()方法并且一次性實(shí)現(xiàn)它們：

getListView().setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
// TBD
}
});

　　onItemClick()方法會(huì)在用戶(hù)每次點(diǎn)擊列表視圖中的每一項(xiàng)時(shí)被調(diào)用。為了方便，它可以傳入幾個(gè)有用的參數(shù)，其中一個(gè)我們需要它來(lái)啟動(dòng)查看器活動(dòng)（viewer activity）。等等，什么是查看器活動(dòng)？

步驟6：創(chuàng)建查看器活動(dòng)

　　非常好的問(wèn)題。讓我們現(xiàn)在就來(lái)創(chuàng)建一個(gè)查看器活動(dòng)！這個(gè)活動(dòng)將用于向用戶(hù)顯示教程內(nèi)容。通過(guò)繼承Activity創(chuàng)建一個(gè)新的類(lèi)，并把它命名為T(mén)utViewerActivity.java。為它創(chuàng)建一個(gè)布局資源文件，文件只包括一項(xiàng)：一個(gè)WebView控件。布局文件應(yīng)該看起來(lái)如下：

<?xml version="1.0" encoding="utf-8"?>
<WebView
xmlns:android="//schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/tutView">
</WebView>

　　在TutViewerActivity類(lèi)的onCreate()方法中，調(diào)用setContentView()方法并將這個(gè)布局傳入。最后，不要忘了將這個(gè)活動(dòng)添加到你的AndroidManifest.xml 文件。

步驟7：?jiǎn)?dòng)Details Activity

　　注意力回到TutListActivity一會(huì)。讓我們看看我們需要做什么來(lái)啟動(dòng)這個(gè)查看器Activity顯示合適文章鏈接。在onItemClick()方法中，被點(diǎn)擊項(xiàng)的位置被作為一個(gè)int型的值傳入。這就是我們需要用來(lái)訪問(wèn)文章鏈接數(shù)組的值。
鏈接數(shù)組里的字符串值是URL。傳遞URL到另一個(gè)活動(dòng)的簡(jiǎn)便方法是通過(guò)setData()方法向Intent添加一個(gè)Uri。下面是onItemClick()的最終實(shí)現(xiàn)，它啟動(dòng)查看器活動(dòng)，傳入合適的URL：

@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
String content = links[position];
Intent showContent = new Intent(getApplicationContext(),
TutViewerActivity.class);
showContent.setData(Uri.parse(content));
startActivity(showContent);
}

　　如果你只是將這些代碼直接粘貼到onCreate()方法的最后面，你會(huì)注意到links變量還沒(méi)有定義。因?yàn)樗鼘?用于OnItemClickListener類(lèi)，變量必須是一個(gè)final值，如下：

final String[] links = getResources().getStringArray(R.array.tut_links);

　　這一行必須放在OnItemClickListener的定義之前。是的，你可以將它定義成非final的成員變量。對(duì)于更復(fù)雜的情況，那樣做甚至是必須的。但是在這里，我們可以在方法中放置所有代碼。
現(xiàn)在如果你運(yùn)行這個(gè)程序，你將得到一個(gè)空白的查看器界面。活動(dòng)正確地啟動(dòng)了，但是我們需要去連接查看器活動(dòng)來(lái)在WebView控件中加載URL。

步驟8：加載URL

　　注意力回到TutViewerActivity.java文件。在調(diào)用setContentView()方法之后，添加代碼，在傳入的Intent中檢索Uri并將它轉(zhuǎn)換成String變量。然后將一個(gè)調(diào)用添加到WebView類(lèi)的loadUrl()方法。整個(gè)TutViewerActivity類(lèi)的代碼將看起來(lái)像這樣：

public class TutViewerActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.tut_view);
Intent launchingIntent = getIntent();
String content = launchingIntent.getData().toString();
WebView viewer = (WebView) findViewById(R.id.tutView);
viewer.loadUrl(content);
}
}

　　現(xiàn)在再運(yùn)行程序。正常了么？還沒(méi)有！最后一個(gè)細(xì)節(jié)：你必須把網(wǎng)終權(quán)限添加到AndroidManifest.xml文件。現(xiàn)在運(yùn)行這個(gè)程序，你將看到程序正常運(yùn)行了：

步驟9：改善體驗(yàn)（可選）

　　目前來(lái)看，用戶(hù)體驗(yàn)只是做到了僅僅是可以用。ListView展示所有文章標(biāo)題，用戶(hù)可以點(diǎn)擊列表某一項(xiàng)并且可以轉(zhuǎn)到一個(gè)帶有WebView控件的活動(dòng)來(lái)展示合適的URL的內(nèi)容。為了將這個(gè)最基本的實(shí)現(xiàn)變得更優(yōu)雅一些你可能考慮以下幾個(gè)方面：

• 設(shè)置瀏覽視圖的初始縮放以應(yīng)對(duì)接來(lái)的縮放
• 配置WebView使其包含更多增強(qiáng)瀏覽體驗(yàn)的控件
• 動(dòng)態(tài)加載文章列表，而不是使用靜態(tài)數(shù)組
• 為L(zhǎng)istView添加特效視覺(jué)效果
• 充分利用大屏幕
• 向ListView增加附加的信息：副標(biāo)題，難度級(jí)別，圖標(biāo)，已讀指示，收藏按鈕等。

總結(jié)

　　ListView小工具是在界面上以列表形式組織數(shù)據(jù)的快速方式。在這個(gè)教程中我們只是接觸到ListView控件的最表層。然而，你學(xué)到了最基礎(chǔ)的：創(chuàng)建列表項(xiàng)，使用數(shù)據(jù)適配器，以及處理列表項(xiàng)點(diǎn)擊。