如何在Android中實現此選項卡式布局？

Question

我目前正在“注冊”頁面上，該頁面包含4個不同的視圖。 我們稱它們為View1 ， View2 ， View3和View4 。

當用戶按下“注冊”時，應該將他/她帶到View1，然后用戶只有在按下“下一步”按鈕后才能進入View2。 如果用戶單擊View2，View3或View4，則不會發生任何事情-但應顯示它們，以便用戶知道他在注冊過程中取得了多少進展。

目前，我已完成View1布局，並成功加載。 如何獲得所需的選項卡式布局？ 我是否應該對視圖使用單獨的類來處理選項卡，還是需要將選項卡添加到每個單獨的視圖？ 我是Android和Stackoverflow方面的新秀，因此，如果這是一個奇怪的要求，我會提前道歉，並很高興為您解釋不清楚的任何內容。

任何幫助深表感謝！

Answer 1

您可以使用：

ViewPager
TabLayout
BaseFragmentStatePagerAdapter (pageAdapter)

ViewPager.setAdapter(pageAdapter);
TabLayout.setupWithViewPager(ViewPager)

適配器的示例實現：

/** fragment state page adapter
* is different from pageAdapter
* in way that is not loading all fragments on same time
* The first PageAdapter might destroy View hierarchy and re load it when  needed,
* the StatePageAdapter only saves the state of the Fragment and completely destroys it,
* if the user then comes back to that page, the state is retrieved.*/
public class SectionPagerAdapter extends BaseFragmentStatePagerAdapter {

     private List<CustomFragment> _fragments;

     public SectionPagerAdapter(FragmentManager fm, List<CustomFragment> fragments) {
        super(fm);
        _fragments = fragments;
    }

    /**
     *
     * @param object
     * @return POSITION_NONE;
     *
     * This way, when you call notifyDataSetChanged(),
     * the view pager will remove all views and reload them all.
     * s so the reload effect is obtained.
     */
     @Override
     public int getItemPosition(Object object) {
        /** check if object is custom fragment class */
        if (object.getClass().isAssignableFrom(CustomFragment.class)) {
           /** cast object to fragment */
           CustomFragment customFragment = (CustomFragment)object;
           return _fragments.indexOf(customFragment);
        } else {
            /** else recreate */
            return POSITION_NONE;
        }
     }

     @Override
     public CustomFragment getItem(int position) {
        return _fragments.get(position);
     }

     @Override
     public CharSequence getPageTitle(int position) {
         return getItem(position).getTittle();
     }

     @Override
     public int getCount() {
         return _fragments.size();
     }

     @Override
     public Parcelable saveState() {
         return super.saveState();
     }

     /** to prevent crash on restore state 
      * - due to GOOGLE BUG (i use my own imlementation of adapter 
      * don't call super ! */
     @Override
     public void restoreState(Parcelable state, ClassLoader loader) {
         super.restoreState(state, loader);
      }
  }

* CustomFragment是Fragment類的抽象類擴展，帶有額外的方法update（）和getTitle（）

 /** to handle extended property in fragment*/
 public abstract class CustomFragment extends Fragment implements IGetDetails{

    public CustomFragment() {
    }

     /** method to perform fragment update */
     public abstract void update();
}

public interface IGetDetails {
    String getTittle();
}

然后在主要活動中創建一個容器：

    /** create fragment container */
    if (_fragments == null) {
        _fragments = new ArrayList<>();
        _fragments.add(new Fragment1());
        _fragments.add(new Fragment2());
        _fragments.add(new Fragment3());
    }

要填充片段，您可以使用此方法：

/**
 * populate view pager
 */
private ViewPager populateViewPager(ViewPager pager, List<CustomFragment> list) {
    /** get child fragment manager of this fragment  */
    FragmentManager childFragmentManager = getChildFragmentManager();
    /** we need pass to adapter child fragment manager because of nested fragments  */
    SectionPagerAdapter sectionPagerAdapter = new SectionPagerAdapter(childFragmentManager, list);
    /** set adapter to view pager */
    pager.setAdapter(sectionPagerAdapter);
    /** testify data set changed */
    sectionPagerAdapter.notifyDataSetChanged();
    return pager;
}

**如果您將Activity用作視圖傳呼器的主機，則應通過FragmentManager，但如果主機位於片段（您有嵌套的碎片），則應將其傳遞給adpter 子片段管理器

和示例布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">

<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabMode="scrollable" />

<android.support.v4.view.ViewPager
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />