文章目錄

• 二級頁面首頁的ViewPager頁面切換
• • 效果展示
  • 代碼實現
  • • 創建幾個三級頁面Fragment視圖
    • ViewPager的Fragment數據丟失問題
    • 創建fragment_home視圖文件
    • HomeFragment.java

二級頁面首頁的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@Overridepublic View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {//判斷view是否為空if(view==null) {view = getMyView();}else {//清除當前重用的view的parentViewGroup 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的parentViewGroup 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.TabLayoutandroid: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.ViewPagerandroid: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@Overridepublic CharSequence getPageTitle(int position) {//返回指定位置標題內容return titles.get(position);}@Overridepublic Fragment getItem(int i) {//返回頁面內容return pages.get(i);}@Overridepublic int getCount() {//返回頁面數量return pages.size();}}@Nullable@Overridepublic 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->getPageTitlereturn view;} }

總結

以上是生活随笔為你收集整理的（仿头条APP项目）3.二级页面首页的ViewPager页面切换的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。