Android 3.0引入的新的片斷（Fragment）API，讓我們更容易地創(chuàng)建動態(tài)用戶界面。在這個(gè)教程中，我們學(xué)習(xí)如何將一個(gè)兩屏的ListView轉(zhuǎn)換成WebView流，以適應(yīng)大屏幕的單屏流設(shè)計(jì)，比如在平板設(shè)備中。

　　這篇文章的節(jié)奏將比我們的入門教程更快一些。如果你對基本的Android控件或概念不熟悉你可能需要復(fù)習(xí)這個(gè)網(wǎng)站上我們其它的一些教程，甚至是Android API參考。最終的開源代碼可以在Google code上下載到。

　　片段簡介

　　在我們開始之間，讓我們在更高的層次上定義一下什么是片段。通常來說，片段是一大塊用戶界面，它具有自己的生存周期。如果它聽起來像一個(gè)Activity，那是因?yàn)樗_實(shí)很像一個(gè)Activity。然而，片段與Activity不同，片段必須存在于Activity之內(nèi)。片段不須要在它每次初始化的時(shí)候與同一個(gè)Activity配對，這使它具有一些靈活性。與Activity一樣，片段也無需包含任何用戶界面。

　　步驟0：開始

　　這個(gè)教程假設(shè)你讀過我們的列表視圖教程，你可以下載那個(gè)教程的代碼，并完成一些任務(wù)，然后開始，也可以直接下載這個(gè)教程的代碼直接開始。

　　步驟1：重新設(shè)計(jì)界面

　　下圖示意了我上在列表視圖教程中所提到的文章閱讀應(yīng)用，我們還沒有考慮并使用片段：
　　這個(gè)流程在相對小屏幕上運(yùn)行得很不錯(cuò)。然而，在大屏幕上，比如Motorola Xoom平板的10寸屏幕上，在列表視圖上卻浪費(fèi)了很多空間。WebView看起來正常，但是有點(diǎn)枯燥。

　　這就是要引入片段的地方：在大屏幕上，我們可以提供更有效的用戶界面，如果我們可以在同一屏上顯示ListView和WebView。當(dāng)用戶點(diǎn)擊左邊“面板”的列表視圖中的某一項(xiàng)時(shí)，右邊的WebView更新顯示相應(yīng)的內(nèi)容。這種工作流程經(jīng)常用于email或文檔或RSS閱讀器。下圖就是重新設(shè)計(jì)之后的界面示意圖：

　　步驟2：轉(zhuǎn)換為基于片段的設(shè)計(jì)

　　現(xiàn)在我們知道了新的流程應(yīng)該如何設(shè)計(jì)，我們也知道當(dāng)前的兩個(gè)活動必須轉(zhuǎn)換成片段。我們將分幾步來完成這個(gè)轉(zhuǎn)換。第一步保持界面樣子不變，只是使用片段修改每個(gè)界面內(nèi)容。一個(gè)片段將包含當(dāng)前的ListView，另一個(gè)包含WebView。然后我們再轉(zhuǎn)到單個(gè)屏幕的實(shí)現(xiàn)，修改ListView和WebView之間的消息傳遞。

　　首先，將你的程序的項(xiàng)目構(gòu)建目標(biāo)改變Android 3.0。在Eclipse中，右鍵點(diǎn)擊項(xiàng)目并選擇“屬性”。點(diǎn)擊Android部分并選中Android 3.0。我們不使用任何Google API，所以Android開源項(xiàng)目版本足夠了。然后點(diǎn)擊“確定”按鈕。

現(xiàn)在你就可以訪問新的API了，包括片段API。

　　注意：在將來的教程中，我們將討論如何使用新的兼容層來使得像片段API這樣的技術(shù)在更早版本的Android設(shè)備上也能工作。但是現(xiàn)在它只能運(yùn)行在Android 3.0設(shè)備上。

　　步驟3：創(chuàng)建片段類

　　創(chuàng)建兩個(gè)Java類來代表兩個(gè)片段：ListView界面和WebView界面。將它們命名為TutListFragment和TutViewerFragment。TutListFragment將繼承ListFragment類，TutViewerFragment只是繼承Fragment類。

在TutListFragment類中，我們需要重寫兩個(gè)方法： onListItemClick()和onCreate()。這些方法的內(nèi)容看起來應(yīng)該很熟悉，它與之前我們講過的TutListActivity類的代碼一致。這個(gè)代碼很快就要修改，但是現(xiàn)在暫時(shí)不需要，下面是當(dāng)前TutListFragment類的代碼：

@Override
public void onListItemClick(ListView l, View v, int position, long id) {
 String[] links = getResources().getStringArray(R.array.tut_links);
 
 String content = links[position];
 Intent showContent = new Intent(getActivity().getApplicationContext(),
 TutViewerActivity.class);
 showContent.setData(Uri.parse(content));
 startActivity(showContent);
}
 
@Override
public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setListAdapter(ArrayAdapter.createFromResource(getActivity()
 .getApplicationContext(), R.array.tut_titles,
 R.layout.list_item));
}        

        

        
        
      
        
it知識庫：Android用戶界面設(shè)計(jì)：使用片段，轉(zhuǎn)載需保留來源！
        
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時(shí)間聯(lián)系我們修改或刪除，多謝。