Android中Activity動態使用Fragment

**

Android中動態使用Fragment

**
動態使用Fragment就是向Fragment佈局容器中動態添加、替換、移除、隱藏、顯示Fragment。
注意：佈局容器一定要選擇合適，如果選擇的佈局容器不能包含Fragment，這樣子一般編輯器不會報錯，但是虛擬機或者測試設備上是無法顯示出我們想要的界面。

Activity中顯示Fragment（比如實現微信界面）

在Activity中顯示Fragment，實現微信這樣的界面時，我們需要一個Activity，多個Fragment，在本例中，我們使用4個Fragment。
首先創建一個Activity和4個Fragment（first、second、third、forth），並在layout文件夾中創建4個XML文件（first、second、third、forth），將這4個Fragment與4個XML文件一一鏈接，代碼如下：

package com.example.電腦用戶名.項目名.main;

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

import com.example.電腦用戶名.項目名.R;

public class first extends Fragment {
    public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState){
        View v=inflater.inflate(R.layout.first,container,false);
        return v;
    }
}

我們可以在創建的XML中根據項目需求設計自己需要的界面，此處不再贅述。

Fragment在Activity中的切換、移除、隱藏

首先我們需要在Activity對應的XML文件中寫好界面文件，用來顯示Fragment的爲RelativeLayout（id=“FragmentContainer”）。接下來寫好用以點擊顯示不同Fragment的欄目。供參考代碼如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <RelativeLayout
        android:id="@+id/FragmentContainer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/buttoncontainer">
    </RelativeLayout>
    <LinearLayout
        android:id="@+id/buttoncontainer"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        android:background="@color/white"
        android:gravity="bottom">
        <LinearLayout
            android:id="@+id/first1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical"
            style="@style/image">
            <ImageView
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:paddingTop="10dp"
                android:src="@drawable/shouye" />
            <TextView
                style="@style/text"
                android:layout_weight="1"
                android:text="@string/shouye"
                />
        </LinearLayout>
        <LinearLayout
            android:id="@+id/second2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical"
            style="@style/image">
            <ImageView
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:paddingTop="10dp"
                android:src="@drawable/chaxun" />
            <TextView
                style="@style/text"
                android:layout_weight="1"
                android:text="@string/chaxun"
                />
        </LinearLayout>
        <LinearLayout
            android:id="@+id/third3"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical"
            style="@style/image">
            <ImageView
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:paddingTop="10dp"
                android:src="@drawable/shangchan" />
            <TextView
                style="@style/text"
                android:layout_weight="1"
                android:text="@string/shangchuan"
                />
        </LinearLayout>
        <LinearLayout
            android:id="@+id/forth4"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical"
            style="@style/image">
            <ImageView
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:paddingTop="10dp"
                android:src="@drawable/wode" />
            <TextView
                style="@style/text"
                android:layout_weight="1"
                android:text="@string/wode"
                />
        </LinearLayout>

    </LinearLayout>
</RelativeLayout>

寫好的導航欄顯示如下圖所示：

接下來寫好Activity中的邏輯代碼即可：
Activity.java

package com.example.a80496.newproject;

import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.LinearLayout;

import com.example.電腦用戶名.項目名.main.first;
import com.example.電腦用戶名.項目名.main.second;
import com.example.電腦用戶名.項目名.main.third;
import com.example.電腦用戶名.項目名.main.forth;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private LinearLayout d1,d2,d3,d4;
    private FragmentTransaction fragmentTransaction;
    private first f1;
    private second f2;
    private third f3;
    private forth f4;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        d1=findViewById(R.id.first1);
        d2=findViewById(R.id.second2);
        d3=findViewById(R.id.third3);
        d4=findViewById(R.id.forth4);
        d1	.setOnClickListener(this);
        d2.setOnClickListener(this);
        d3.setOnClickListener(this);
        d4.setOnClickListener(this);
        setTab(4);
    }

    private void hidefragment(FragmentTransaction fragment){
        if(f1!=null)
        {
            fragment.hide(f1);
        }
        if(f2!=null)
        {
            fragment.hide(f2);
        }
        if(f3!=null)
        {
            fragment.hide(f3);
        }
        if(f4!=null)
        {
            fragment.hide(f4);
        }
    }

    private void setTab(int i){
        fragmentTransaction=getSupportFragmentManager().beginTransaction();
        hidefragment(fragmentTransaction);
        d1.setSelected(false);
        d2.setSelected(false);
        d3.setSelected(false);
        d4.setSelected(false);
        switch (i){
            case 1:
                d1.setSelected(true);
                if (f1==null){
                    f1=new first();
                    fragmentTransaction.add( R.id.FragmentContainer,f1);
                }else {
                    fragmentTransaction.show(f1);
                }
                break;
            case 2:
                second.setSelected(true);
                if (f2==null){
                    f2=new second();
                    fragmentTransaction.add( R.id.FragmentContainer,f2);
                }else {
                    fragmentTransaction.show(f2);
                }
                break;
            case 3:
                third.setSelected(true);
                if (f3==null){
                    f3=new third();
                    fragmentTransaction.add( R.id.FragmentContainer,f3);
                }else {
                    fragmentTransaction.show(f3);
                }
                break;
            case 4:
                fourth.setSelected(true);
                if (f4==null){
                    f4=new forth();
                    fragmentTransaction.add( R.id.FragmentContainer,f4);
                }else {
                    fragmentTransaction.show(f4);
                }
                break;
        }
        fragmentTransaction.commitAllowingStateLoss();

    }

    @Override
    public void onClick(View view) {
        switch(view.getId()){
            case R.id.first1:
                setTab(1);
                break;
            case R.id.second2:
                setTab(2);
                break;
            case R.id.third3:
                setTab(3);
                break;
            case R.id.forth4:
                setTab(4);
                break;
            default:
                break;
        }
    }
}

至此，我們想要的微信類型界面已經完成，實現效果如下所示：