高仿爱奇艺界面切换-Fragment

1、先完成Fragment的创建

        写一个类继承Fragment,并重写onCreateView方法

        为Fragment写布局文件

        将布局文件加载到对于的Fragment类中

2、在activity_main.xml中写好布局文件，这里利用FrameLayout为Fragment占位，之后用Fragment替换FrameLayout

3、在MainActivity.java中进行进行加载Fragment

       创建管理者FragmentManager

       创建事物FragmentTransaction

接下来贴代码：

MainActivity.java

package com.example.wxj_try.myfragment;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.os.Bundle;
import android.support.v4.app.ListFragment;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.ImageView;
public class MainActivity extends FragmentActivity implements View.OnClickListener {

    private FrameLayout mFrameLayout;
    private FragmentManager mFragmentManager;
    private FragmentTransaction mFragmentTransaction;
    private ImageView wode,tuijian,lixiang,faxiang,daohang;
    private Fragment tuijianFragment,daohangFragment,wodeFragment,lixianFragment,faxianFragment;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        init();
        wode.setOnClickListener(this);
        lixiang.setOnClickListener(this);
        tuijian.setOnClickListener(this);
        faxiang.setOnClickListener(this);
        daohang.setOnClickListener(this);
    }
    private void init() {
        wode = (ImageView) findViewById(R.id.wode);
        faxiang = (ImageView) findViewById(R.id.faxiang);
        tuijian = (ImageView) findViewById(R.id.tuijian);
        lixiang = (ImageView) findViewById(R.id.lixian);
        daohang = (ImageView) findViewById(R.id.daohang);
        mFrameLayout = (FrameLayout) findViewById(R.id.fl);
        //得到Fragement的管理器
        mFragmentManager = getSupportFragmentManager();
        //开启事务，利用mFragmentTransaction来对Feagment进行替换（replace）、添加（add）、移除(remove)
        //mFragmentTransaction = mFragmentManager.beginTransaction();

        //进入应用默认打开界面
        faxiang.setImageResource(R.drawable.faxian2);
       /* //将默认fragment加载到Activity中
        mFragmentTransaction.add(R.id.fl,faxianFragment);
        //提交事务
        mFragmentTransaction.commit();
        以上功能由SelectedFragment(2);完成
        */
        SelectedFragment(2);
    }
    @Override
    public void onClick(View v) {
        //将上一次交换的图片复原
        recoveImageView();
        switch (v.getId())
        {
            case R.id.tuijian:
                tuijian.setImageResource(R.drawable.tuijian2);
                SelectedFragment(0);
                break;
            case R.id.daohang:
                daohang.setImageResource(R.drawable.daohang2);
                SelectedFragment(1);
                break;
            case R.id.faxiang:
                faxiang.setImageResource(R.drawable.faxian2);
                SelectedFragment(2);
                break;
            case R.id.wode:
                wode.setImageResource(R.drawable.wode2);
                SelectedFragment(3);
                break;
            case R.id.lixian:
                lixiang.setImageResource(R.drawable.lixian2);
                SelectedFragment(4);
        }

    }

    public void SelectedFragment(int index)
    {
        //每调用一次需要重新生成一次
        mFragmentTransaction = mFragmentManager.beginTransaction();
        //首先判断是否为空，清除上次操作
        //if (mFragmentTransaction != null)
       // ClearFragment();
        switch (index)
        {
            case 0:
                if(tuijianFragment == null){
                    tuijianFragment = new TuijianFragment();
                }
                mFragmentTransaction.replace(R.id.fl,tuijianFragment);
                break;
            case 1:
                if(daohangFragment==null){
                    daohangFragment = new DaohangFragment();
                }
                mFragmentTransaction.replace(R.id.fl,daohangFragment);
                break;
            case 2:
                if (faxianFragment == null)
                    faxianFragment = new FaxianFragment();
                mFragmentTransaction.replace(R.id.fl,faxianFragment);
                break;
            case 3:
                if (wodeFragment == null)
                    wodeFragment = new WodeFragment();
                mFragmentTransaction.replace(R.id.fl,wodeFragment);
                break;
            case 4:
                if (lixianFragment == null)
                    lixianFragment = new LixianFragment();
                mFragmentTransaction.replace(R.id.fl,lixianFragment);
        }
        //提交事务
        mFragmentTransaction.commit();
    }

    private void ClearFragment() {
        mFragmentTransaction.remove(faxianFragment);
        mFragmentTransaction.remove(tuijianFragment);
        mFragmentTransaction.remove(daohangFragment);
        mFragmentTransaction.remove(wodeFragment);
        mFragmentTransaction.remove(lixianFragment);
    }

    private void recoveImageView() {
        tuijian.setImageResource(R.drawable.tuijian1);
        daohang.setImageResource(R.drawable.daohang1);
        faxiang.setImageResource(R.drawable.faxian1);
        wode.setImageResource(R.drawable.wode1);
        lixiang.setImageResource(R.drawable.lixian1);
    }
}

activity_main.xml代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.wxj_try.myfragment.MainActivity">
    <!--进行占位-->
    <FrameLayout
        android:id="@+id/fl"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1">
    </FrameLayout>

    <LinearLayout
        android:id="@+id/mybuttom"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="50dp">

        <ImageView
            android:id="@+id/tuijian"
        android:layout_weight="1"
        android:layout_gravity="center"
        android:layout_width="40dp"
        android:layout_height="wrap_content"
        android:src="@drawable/tuijian1"/>
        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="#f0f0f0"/>

        <ImageView
            android:id="@+id/daohang"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:layout_width="40dp"
            android:layout_height="wrap_content"
            android:src="@drawable/daohang1"/>
        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="#f0f0f0"/>

        <ImageView
            android:id="@+id/faxiang"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:layout_width="40dp"
            android:layout_height="wrap_content"
            android:src="@drawable/faxian1"/>
        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="#f0f0f0"/>

        <ImageView
            android:id="@+id/wode"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:layout_width="40dp"
            android:layout_height="wrap_content"
            android:src="@drawable/wode1"/>
        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="#f0f0f0"/>

        <ImageView
            android:id="@+id/lixian"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:layout_width="40dp"
            android:layout_height="wrap_content"
            android:src="@drawable/lixian1"/>


    </LinearLayout>
</LinearLayout>

接下来是Fragment相关代码，只贴一部分

Fragment的布局文件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#f0f0"
    tools:context="com.example.wxj_try.myfragment.MainActivity">

    <TextView
        android:gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="faxian" />
</RelativeLayout>

Fragment类代码

package com.example.wxj_try.myfragment;


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

/**
 * Created by WXJ-try on 2016/12/19.
 */

public class FaxianFragment extends Fragment {

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