[Android] Action Bar Tabs 和 ListView簡易示範

範例下載：GitHub

　　相信大家對 Twitter和 Facebook這種 View應該都不陌生吧！拜諸多大神所賜，現在要寫出這種 View已經是非常容易的事情。今天我們就來簡單實作這種 View─ Action Bar Tabs，並且加入幾個 UI及示範 ListView。

一、首先要創立專案，這裡要特別注意的是在最低版本中需要選擇 API 11(Android 3.0)以上。

　　接著就一直下一步，直到 Create Activity的地方選擇 Blank Activity，然後下一步。接著在 Blank Activity的 Navigation Type中選擇 Action Bar Tabs (with ViewPager)這個選項，然後「完成」。

接著我們就直接來 Demo一下剛產生的專案：

接著就可以試著左右滑動，看一下這三個 View，是不是很快呢？

二、接著我們稍微改一下這個專案，將 3個 Fragment改成兩個 Fragment，並且分別在兩個 View中加入不同的元素

改成兩個 Fragment其實也很簡單，只要更改 getCount函數中的回傳值就可以了。

@Override
public int getCount() {
    return 2;
}

　　接著為了要方便管理兩個 Fragment，我們將直接修改 PlaceholderFragment這個函數以達到我們的需求：

public static class Fragment0 extends Fragment {

    private static final String ARG_SECTION_NUMBER = "section_number";

        public static Fragment0 newInstance(int sectionNumber) {
            Fragment0 fragment = new Fragment0();
            Bundle args = new Bundle();
            args.putInt(ARG_SECTION_NUMBER, sectionNumber);
            fragment.setArguments(args);
            return fragment;
        }

        public Fragment0() {
        }

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
            View rootView = inflater.inflate(R.layout.fragment_main, container, false);
            TextView textView = (TextView) rootView.findViewById(R.id.section_label);
            textView.setText(Integer.toString(getArguments().getInt(
                ARG_SECTION_NUMBER)));
            return rootView;
        }
}

　　然後依樣畫葫蘆，創造出另一個 Fragment1。也由於我們要分開控制兩個 Fragment，所以也要為它們各自產生 layout，我們可以選擇直接更改 fragment_main.xml成 fragment0.xml，並且複製一份成為 fragment1.xml：

　　由於 layout改變了，所以我們必須回去修改 MainActivity的 getItem函數，讓它分別對照到兩個 layout：

@Override
public Fragment getItem(int position) {
    switch(position){
        case 0:
        return Fragment0.newInstance(0);
        case 1:
        return Fragment1.newInstance(1);
        default:
        return Fragment0.newInstance(0);   
    }
}

備註：getItem函數可以回傳拿到上面第幾個 Fragment的實體。

這時候我們在第二個 Fragment加入一個 EditText和一個 Button。

Demo一下改完後的狀況：

三、接下來我們要在第一個 Fragment加入 ListView，並且簡單示範一下。

關於ListView：
　　ListView是在 Android中很常見的一種 UI，與 iOS的 Table View雷同， ListView 通常使用在需在同一畫面大量使用時，如：電話簿、檔案管理、條列資訊....，都很建議使用。而 ListView在使用上需要搭配 Adapter用以連接資料。

不多說，先在 fragment0.xml加入ListView：

<ListView
    android:id="@+id/listView1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true" >
</ListView>

然後我們修改 Fragment1的 onCreateView：

public View onCreateView(LayoutInflater inflater, ViewGroup container,
    Bundle savedInstanceState) {
    View rootView = inflater.inflate(R.layout.fragment0, container, false);
    ListView listView=(ListView) rootView.findViewById(R.id.listView1);
    String[] testArryStrings = new String[]{"1", "2", "3", "4", "5"};
    ArrayAdapter aa= new ArrayAdapter(getActivity(),
        android.R.layout.simple_expandable_list_item_1,
        testArryStrings);
    listView.setAdapter(aa);
    return rootView;
}

關於ArrayAdapter：
　　ArrayAdapter是 Android中的一個 Adapter，它可以連結字串陣列到單一個 Text View的 List物件當中。上方程式碼有幾個重點：

• ArrayAdapte所接收之項目為 Array。
• ArrayAdapte的方法裡面並沒有提供多欄位的顯示方式。
• 第一個參數代表目標為 Fragment1的 Activity。
• 在第二個參數中使用 "android.R.layout.simple_expandable_list_item_1"，表示是用 Android 內建的配置。
• 最後一個參數是欲顯示的項目(字串陣列)。

Demo一下：

~今天就講解到這裡~

Reference 

• ListView 之一：Adapter 介紹與使用
• ArrayAdapter 的使用
• Android 學習_ArrayAdapter 的使用