（仿頭條APP項目）3.二級頁面首頁的ViewPager頁面切換

二級頁面首頁的ViewPager頁面切換

效果展示

代碼實現

創建幾個三級頁面Fragment視圖

import android.graphics.Color;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

public class Page1Fragment extends Fragment {
    View view = null;
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        //判斷view是否爲空
        if(view==null) {
            view = getMyView();
        }else {
            //清除當前重用的view的parent
            ViewGroup viewGroup = (ViewGroup) view.getParent();
            if (viewGroup!=null){
                viewGroup.removeView(view)  ;
            }
        }
        return view;
    }
    private View getMyView() {
        TextView textView= new TextView(getActivity());
        textView.setBackgroundColor(Color.GRAY);
        textView.setText("頁面1");
        textView.setTextSize(30);
        textView.setGravity(Gravity.CENTER);
        return textView;
    }
}

ViewPager的Fragment數據丟失問題

一般用ViewPager滑動頁面時會出現數據丟失的問題

• 當Fragment滑出屏幕的時候，系統調onDestoryView方法
  銷燬視圖
• 當Fragment重新滑入屏幕的時候，系統調onCreateView方法
  創建新的視圖

//清除當前重用的view的parent
            ViewGroup viewGroup = (ViewGroup) view.getParent();
            if (viewGroup!=null){
                viewGroup.removeView(view)  ;
            }

上述代碼可以解決數據丟失問題

創建fragment_home視圖文件

TabLayout需要引入依賴
implementation ‘com.android.support:design:28.0.0’

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <!--app:tabMode="scrollable" 如果標題過多，滑動 -->
    <android.support.design.widget.TabLayout
         android:id="@+id/tl_home"
        app:tabMode="scrollable"
        app:tabTextColor="#242424"
        app:tabIndicatorHeight="6dp"
        app:tabIndicatorFullWidth="false"
        app:tabSelectedTextColor="#F04445"
        android:layout_width="match_parent"
        android:layout_height="40dp">
    </android.support.design.widget.TabLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/vp_home"
        android:layout_width="match_parent"
        android:layout_height="match_parent"></android.support.v4.view.ViewPager>

</LinearLayout>

HomeFragment.java

import android.graphics.Color;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.TextView;

import com.example.administrator.zhjrtt.R;
import com.xzit.fragment.sub.Page1Fragment;
import com.xzit.fragment.sub.Page2Fragment;
import com.xzit.fragment.sub.Page3Fragment;
import com.xzit.fragment.sub.Page4Fragment;

import java.util.ArrayList;
import java.util.List;

public class HomeFragment extends Fragment {
    class MyPagerAdapter extends FragmentPagerAdapter{
        //創建集合存放頁面
        private List<Fragment> pages = new ArrayList<>();
        //創建集合存放指示器標題
        private List<String> titles = new ArrayList<>();
        public MyPagerAdapter(FragmentManager fm) {
            super(fm);
            //將初始化Fragment頁面放入頁面集合
            pages.add(new Page1Fragment());
            pages.add(new Page2Fragment());
            pages.add(new Page3Fragment());
            pages.add(new Page4Fragment());
            //將標題內容放入集合
            titles.add("Page1Fragment");
            titles.add("Page2Fragment");
            titles.add("Page3Fragment");
            titles.add("Page4Fragment");
        }

        @Nullable
        @Override
        public CharSequence getPageTitle(int position) {
            //返回指定位置標題內容
            return titles.get(position);
        }

        @Override
        public Fragment getItem(int i) {
            //返回頁面內容
            return pages.get(i);
        }

        @Override
        public int getCount() {
            //返回頁面數量
            return pages.size();
        }
    }
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = getMyView();
        return view;
    }

    private View getMyView() {
        //1.佈局viewpager
        //2.加載
        View view = View.inflate(getActivity(),R.layout.fragment_home,null);
        ViewPager viewPager = view.findViewById(R.id.vp_home);
        //3.定義適配器
        //4.初始化設置適配器
        MyPagerAdapter myPagerAdapter = new MyPagerAdapter(getFragmentManager());
        viewPager.setAdapter(myPagerAdapter);
        //5.初始化指示器
        TabLayout tabLayout = view.findViewById(R.id.tl_home);
        tabLayout.setupWithViewPager(viewPager);//->viewpager-->adapter->getPageTitle
        return view;
    }
}