Android Fragment(片段)的簡單用法

來源:互聯網
上載者:User

標籤:

1、片段是什麼

  片段(Fragment)是一種可以嵌入在活動當中的UI片段,它能讓程式更加合理和充分地利用大螢幕的空間,因而在平板上應用的非常廣泛。雖然片段對你來說應該是個全新的概念,但我相信你學習起來應該毫不費力,因為它和活動實在是太像了,同樣都能包含布局,同樣都有自己的生命週期。你甚至可以將片段理解成一個迷你型的活動,雖然這個迷你型的活動有可能和普通的活動是一樣大的。

  那麼究竟要如何使用片段才能充分地利用平板螢幕的空間呢?想象我們正在開發一個新聞應用,其中一個介面使用ListView展示了一組新聞的標題,當點擊了其中一個標題,就開啟另一個介面顯示新聞的詳細內容。如果是在手機中設計,我們可以將新聞標題列表放在一個活動中,將新聞的詳細內容放在另一個活動中,1所示。

                                                    圖1

可是如果在平板上也這麼設計,那麼新聞標題列表將會被拉長至填充滿整個平板的螢幕,而新聞的標題一般都不會太長,這樣將會導致介面上有大量的空白地區,2所示。

                                                    圖2

因此,更好的設計方案是將新聞標題列表介面和新聞詳細內容介面分別放在兩個片段中,然後在同一個活動裡引入這兩個片段,這樣就可以將螢幕空間充分地利用起來了,3所示。

                                            圖3

2、片段的使用方式

 

建立一個FragmentTest項目,然後開始我們的片段探索之旅吧。

建立一個左側片段布局left_fragment.xml,代碼如下所示:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >        <Button         android:id="@+id/button"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center_horizontal"        android:text="Button"        />    </LinearLayout>

這個布局非常簡單,只放置了一個按鈕,並讓它水平置中顯示。然後建立右側片段布局right_fragment.xml,代碼如下所示:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="#00ff00"    android:orientation="vertical" >        <TextView         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center_horizontal"        android:textSize="20sp"        android:text="This is right fragment"        />    </LinearLayout>

可以看到,我們將這個布局的背景色設定成綠色,並放置了一個TextView用於顯示一段文本。接著建立一個LeftFragment類,繼承自Fragment。注意,這裡可能會有兩個不同包下的Fragment供你選擇,建議使用android.app.Fragment,因為我們的程式是面向Android 4.0以上系統的,另一個包下的Fragment主要是用於相容低版本的Android系統。LeftFragment的代碼如下所示:

public class LeftFragment extends Fragment {    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container,            Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.left_fragment, container, false);        return view;    }}

這裡僅僅是重寫了Fragment的onCreateView()方法,然後在這個方法中通過LayoutInflater的inflate()方法將剛才定義的left_fragment布局動態載入進來,整個方法簡單明了。接著我們用同樣的方法再建立一個RightFragment,代碼如下所示:

public class RightFragment extends Fragment {    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container,            Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.right_fragment, container, false);        return view;    }}

建立another_right_fragment.xml,代碼如下所示:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="#ffff00"    android:orientation="vertical" >        <TextView         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center_horizontal"        android:textSize="20sp"        android:text="This is another right fragment"        />    </LinearLayout>

這個布局檔案的代碼和right_fragment.xml中的代碼基本相同,只是將背景色改成了黃色,並將顯示的文字改了改。然後建立AnotherRightFragment作為另一個右側片段,代碼如下所示:

public class AnotherRightFragment extends Fragment {        @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container,            Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.another_right_fragment, container, false);        return view;    }    }

代碼同樣非常簡單,在onCreateView()方法中載入了剛剛建立的another_right_fragment布局。這樣我們就準備好了另一個片段,接下來看一下如何將它動態地添加到活動當中。修改activity_main.xml,代碼如下所示:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent">
<!-- 靜態載入Fragment --> <fragment android:id="@+id/left_fragment" android:name="com.example.fragmenttest.LeftFragment" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <FrameLayout android:id="@+id/right_layout" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" >
     <!-- 可以在這個容器中動態載入Fragment -->
        <fragment            android:id="@+id/right_fragment"            android:name="com.example.fragmenttest.RightFragment"            android:layout_width="match_parent"            android:layout_height="match_parent" />    </FrameLayout></LinearLayout>

可以看到,現在將右側片段放在了一個FrameLayout中,這是Android中最簡單的一種布局,它沒有任何的定位方式,所有的控制項都會擺放在布局的左上方。由於這裡僅需要在布局裡放入一個片段,因此非常適合使用FrameLayout。

之後我們將在代碼中替換FrameLayout裡的內容,從而實現動態添加片段的功能。修改MainActivity中的代碼,如下所示:

public class MainActivity extends Activity implements OnClickListener {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        Button button = (Button) findViewById(R.id.button);        button.setOnClickListener(this);    }    @Override    public void onClick(View v) {        switch (v.getId()) {        case R.id.button:            AnotherRightFragment fragment = new AnotherRightFragment();            FragmentManager fragmentManager = getFragmentManager();            FragmentTransaction transaction = fragmentManager. beginTransaction();            transaction.replace(R.id.right_layout, fragment);            transaction.commit();            break;        default:            break;        }    }}

可以看到,首先我們給左側片段中的按鈕註冊了一個點擊事件,然後將動態添加片段的邏輯都放在了點擊事件裡進行。結合代碼可以看出,動態添加片段主要分為5步。

  1. 建立待添加的片段執行個體。
  2. 擷取到FragmentManager,在活動中可以直接調用getFragmentManager()方法得到。
  3. 開啟一個事務,通過調用beginTransaction()方法開啟。
  4. 向容器內加入片段,一般使用replace()方法實現,需要傳入容器的id和待添加的片段執行個體。
  5. 提交事務,調用commit()方法來完成。

這樣就完成了在活動中動態添加片段的功能,運行程式,可以看到啟動介面4所示,然後點擊一下按鈕,效果5所示。

                                                                                                    圖4

 

                                                                                                  圖5

 

3、在片段中類比返回棧

 

  我們成功實現了向活動中動態添加片段的功能,不過你嘗試一下就會發現,通過點擊按鈕添加了一個片段之後,這時按下Back鍵程式就會直接退出。如果這裡我們想模仿類似於返回棧的效果,按下Back鍵可以回到上一個片段,該如何?呢?

 

其實很簡單,FragmentTransaction中提供了一個addToBackStack()方法,可以用於將一個事務添加到返回棧中,修改MainActivity中的代碼,如下所示:

public class MainActivity extends Activity implements OnClickListener {    ……    @Override    public void onClick(View v) {        switch (v.getId()) {        case R.id.button:            AnotherRightFragment fragment = new AnotherRightFragment();            FragmentManager fragmentManager = getFragmentManager();            FragmentTransaction transaction = fragmentManager. beginTransaction();            transaction.replace(R.id.right_layout, fragment);            transaction.addToBackStack(null);            transaction.commit();            break;        default:            break;        }    }}

  這裡我們在事務提交之前調用了FragmentTransaction的addToBackStack()方法,它可以接收一個名字用於描述返回棧的狀態,一般傳入null即可。現在重新運行程式,並點擊按鈕將AnotherRightFragment添加到活動中,然後按下Back鍵,你會發現程式並沒有退出,而是回到了RightFragment介面,再次按下Back鍵程式才會退出。

4、片段和活動之間進行通訊

  雖然片段都是嵌入在活動中顯示的,可是實際上它們的關係並沒有那麼親密。你可以看出,片段和活動都是各自存在於一個獨立的類當中的,它們之間並沒有那麼明顯的方式來直接進行通訊。如果想要在活動中調用片段裡的方法,或者在片段中調用活動裡的方法,應該如何?呢?

  為了方便片段和活動之間進行通訊,FragmentManager提供了一個類似於findViewById()的方法,專門用於從布局檔案中擷取片段的執行個體,代碼如下所示:

        RightFragment rightFragment = (RightFragment) getFragmentManager().findFragmentById(R.id.right_fragment);

  調用FragmentManager的findFragmentById()方法,可以在活動中得到相應片段的執行個體,然後就能輕鬆地調用片段裡的方法了。

  掌握了如何在活動中調用片段裡的方法,那在片段中又該怎樣調用活動裡的方法呢?其實這就更簡單了,在每個片段中都可以通過調用getActivity()方法來得到和當前片段相關聯的活動執行個體,代碼如下所示:

    MainActivity activity = (MainActivity) getActivity();

  有了活動執行個體之後,在片段中調用活動裡的方法就變得輕而易舉了。另外當片段中需要使用Context對象時,也可以使用getActivity()方法,因為擷取到的活動本身就是一個Context對象了。

  這時不知道你心中會不會產生一個疑問,既然片段和活動之間的通訊問題已經解決了,那麼片段和片段之間可不可以進行通訊呢?

  說實在的,這個問題並沒有看上去的複雜,它的基本思路非常簡單,首先在一個片段中可以得到與它相關聯的活動,然後再通過這個活動去擷取另外一個片段的執行個體,這樣也就實現了不同片段之間的通訊功能,因此這裡我們的答案是肯定的。

 

Android Fragment(片段)的簡單用法

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.