Android高效入門-上下不同種類的Fragment與Support v4

Android高效入門-上下不同種類的Fragment與Support v4

瞭解Fragment的由來與生命週期後,實作Fragment時,可使用Android Studio提供方便的功能,設計出不同需求的APP畫面配置,例如「上下不同種類Fragment」或是「同一位置更換不同的Fragment」等,這些都是常見的應用實例,本篇將建立一個Activity,其上下使用不同種類的Fragment類別,例如上面是聯絡人清單,下方是某聯絡人的詳細資訊。

進行本篇內容之前,請先參考「Android高效入門-Fragment片段的由來與生命週期

Fragment實作

功能與畫面的配置有非常多種,不同功能需求應以不同的架構設計,本篇的情境是當Activity中有上下兩個Fragment,而上方位置永遠使用某一個特定Fragment,下方則使用另一種Fragment,Fragment裏的內容可能會改變,但其所在位置不會放入其他種類的Fragment。

上下不同種類的Fragment

開發應用程式時常需要自行設計Fragment類別,建立一個新類別,並繼承Fragment類別,本篇將設計兩個Fragment類別,一為ContactFragment類別,第二個是DetailFragment,它們都在一個Activity中,並以上下方式顯示,如下圖:

A4486

如上圖的Activity,可在上方Fragment中顯示如聯絡人的清單,當點擊其中一個聯絡人則在下方的Fragment中顯示該聯絡人的詳細資訊。

建立時,應先產生兩個Fragment後,再加入到ContactActivity的畫面中,接下來將先建立Fragment,待完成後再產生ContactAcvitiy類別,步驟說明如下。

建立新類別並繼承Fragment類別

先點擊專案視窗中的「app」後,在功能表中點擊「File/New/Fragment/Blank Fragment」建立一個新的空白Fragment,如下圖:

A4474

上圖的功能項目中還有另外兩個功能:

  • Fragment(List)

產生一個內有ListView清單元件的Fragment。

  • Fragment(with a +1 button)

產生一個內有一個按鈕元件的Fragment,按鈕中文字為「+1」,使用Material Design實感設計與其浮動鈕。

請先選擇建立「Fragment(Blank)」空白Fragment,再為其更改預設名稱為ContactFragment,如下圖:

A4985

為了不增加複雜度,先不勾選最右邊的,兩個選項的意義如下:

  • Create layout XML

建立該Fragment的版面設計檔,本例為「res/layout/fragment_contact」。

  • Include fragment factory methods?

是否在ContactFragment類別中自動產生工廠方法,也就是類別層級的newInstance方法,不需使用或設計複雜的建構子,提供一個建立與取得物件方法,產生的newInstance方法內容如下:

public static ContactFragment newInstance(String param1, String param2) {
    ContactFragment fragment = new ContactFragment();
    Bundle args = new Bundle();
    args.putString(ARG_PARAM1, param1);
    args.putString(ARG_PARAM2, param2);
    fragment.setArguments(args);
    return fragment;
}
  • Include interface callbacks?

如果Fragment所在的Activity想要得到Fragment變動的資訊時,此選擇會建立一個呼叫機制(Java的介面),當勾選此選項時,Activity類別需實作一個客製化的介面(Interface)才能呼叫成功,在此先不勾選。

自動產生的檔案如下:

package com.tom.fragmentlifecycle;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class ContactFragment extends Fragment {
    // TODO: Rename parameter arguments, choose names that match
    // the fragment initialization parameters, e.g. ARG_ITEM_NUMBER
    private static final String ARG_PARAM1 = "param1";
    private static final String ARG_PARAM2 = "param2";
    // TODO: Rename and change types of parameters
    private String mParam1;
    private String mParam2;
    public ContactFragment() {
        // Required empty public constructor
    }
    // TODO: Rename and change types and number of parameters
    public static ContactFragment newInstance(String param1, String param2) {
        ContactFragment fragment = new ContactFragment();
        Bundle args = new Bundle();
        args.putString(ARG_PARAM1, param1);
        args.putString(ARG_PARAM2, param2);
        fragment.setArguments(args);
        return fragment;
    }
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        if (getArguments() != null) {
            mParam1 = getArguments().getString(ARG_PARAM1);
            mParam2 = getArguments().getString(ARG_PARAM2);
        }
    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_contact, container, false);
    }
}

fragment_contact.xml的原始碼如下:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.tom.fragmentlifecycle.ContactFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="聯絡人清單Fragment" />
</FrameLayout>

將上述的版面設計檔內的TextView的「android:text」屬性值改為「聯絡人清單Fragment」。

接著請用同樣的方式,再產生另一個「DetailFragment」,它的程式碼與ContactFragment類似,其版面版置檔「fragment_detial.xml」如下:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.tom.fragmentlifecycle.DetailFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="聯絡人詳細資料Fragment" />
</FrameLayout>

也請把TextView的文字屬性值改為「聯絡人詳細資料Fragment」,以便未來執行時能夠辨識。

設計ContactActivity

當兩個Fragment都完成後,再開始產生新的Activity畫面,請點擊功能表「File/New/Activity/Blank Activity」產生一個空白的Activity,名稱為「ContactActivity」,如下圖:

本文章內容擷取自[Android實作這樣學]電子書

相關文章:

Hank Tom

專長為程式語言、雲端服務開發,Linux系統管理, 任職:利拓科技 技術長,海林行動科技 技術總監 輔仁大學 兼任助理教授 , 為 Android高效入門>深度學習、CentOS 7建置、管理與伺服器架設實戰、Java網路程式設計、雲端網頁程式設計-Google App Engine應用實作 等書作者

發佈留言

×
×

Cart