Android开发之Fragment的使用

主要内容:
Fragment的简单使用
Fragment中动态添加

转载请标明出处：http://blog.csdn.net/junzaivip/article/details/56668164，本文出自【junzaivip博客】

案例最终效果:

Fragment的简单使用.

新建项目FragmentDemo, 将一个屏幕分成两部分. 左边是按钮, 右边显示文本.

页面部分:

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_left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="@string/button"/>
</LinearLayout>

right_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<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>

Java代码:

LeftFragment.java

public class LeftFragment extends Fragment {

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

RightFragment.java

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

两份代码基本相似, LayoutInflater 的inflate方法将定义好的布局动态加载进来.

接下来在activity_main.xml中将刚才写好的fragment.xml加载进来.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
>

    <fragment
        android:id="@+id/left_fragment"
        android:name="com.junzaivip.fragmentdemo.LeftFragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"/>

    <fragment
        android:id="@+id/right_fragment"
        android:name="com.junzaivip.fragmentdemo.RightFragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"/>
</LinearLayout>

android:name 属性来显示指明要添加的Fragment类名, 注意这里一定是包的全名.

运行效果图:

动态添加Fragment

真正开发中, 很多的Fragment是需要被动态添加进去的. 我们现在就实现一个简单的加载, 点击左侧按钮, 替换右边的Fragment

现在我们新建另外一套右边的Fragment.

right2_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>

Right2Fragment.java

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

好了, 接下来我们又需要修改我们的activity_main.xml中的代码了. 如下:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
>

    <fragment
        android:id="@+id/left_fragment"
        android:name="com.junzaivip.fragmentdemo.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">

    </FrameLayout>
</LinearLayout>

简单说明: 看到改变是将之间的fragment替换成现在的FrameLayout,为什么呢? 由于这里仅需要在布局中放入一个Fragment, 所以适合最简单的FramLayout布局.

下面我们来给FrameLayout里添加内容, 实现动态效果.

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button button = (Button) findViewById(R.id.button_left);
        button.setOnClickListener(this);
        replaceFragment(new RightFragment());
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.button_left:
                replaceFragment(new Right2Fragment());
                break;
            default:
                break;

        }
    }
    private void replaceFragment(Fragment fragment){
        FragmentManager fragmentManager = getSupportFragmentManager();
        FragmentTransaction transaction = fragmentManager.beginTransaction();
        transaction.replace(R.id.right_layout, fragment);
        transaction.commit();
    }
}

解读: 首先给左侧按钮添加点击事件, 默认启动onCreate()之后, 首先replaceFragment()方法动态添加RightFragment. 当点击按钮之后, 再次调用replaceFragment()方法动态添加Right2Fragment.

完成动态添加总结:

创建待添加的fragment实例
获取FragmentManager, 在活动中调用getSupportFragmentManager()方法;
开启一个事务, 通过beginTransaction()方法开启;
向容器内添加或者替换fragment, 一般使用replace()方法实现, 需要传入容器的id和待添加的fragment实例.
提交事务, 调用commit()方法来完成.

运行效果:

做到这里, 当我们替换掉之前的fragment, 但是我们还希望通过返回按钮返回, 但是目前我们点击返回按钮, 发现是直接退出程序, 那么怎么优化呢?

修改代码:

解读:FragmentTransaction提供的addToBackStack()方法, 可以用于将一个事务添加到返回栈中, 可以接受一个名字用于描述返回栈的状态, 一般传入null即可. 所以只需要添加这句代码.
transaction.addToBackStack(null);

源码: https://github.com/junzaivip/FragmentDemo