TabLayout和Viewpager無法正常使用額外的cutom標籤

Question

我有1個活動與2個自定義選項卡（選項卡A和選項卡B）。當用戶點擊該標籤中的任一個，文字顏色將改變爲白色

在標籤A，它的一個tablayout與viewpager（3個標籤 - > TAB1，TAB2，TAB3）

在選項卡B，它只是一個textview的正常內容。

當應用程序運行時，它將啓動選項卡第一，當用戶單擊選項卡B，它將導航到選項卡B. 問題是當上標籤A.用戶點擊

方案1 - 我們從Tab B導航到Tab A後，無法在viewpager中看到內容。

場景2 - 它無法恢復到原來的狀態。

請參考截圖以獲得更清晰的解釋。

MainActivity.java

public class MainActivity extends AppCompatActivity implements View.OnClickListener{ 

View get_tab_a; 
View get_tab_b; 
TextView get_text_a; 
TextView get_text_b; 

@Override 
protected void onCreate(Bundle savedInstanceState) { 

    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 

    get_tab_a=findViewById(R.id.view_a); 
    get_tab_b=findViewById(R.id.view_b); 
    get_text_a=(TextView) findViewById(R.id.tab_a); 
    get_text_b=(TextView) findViewById(R.id.tab_b); 
    get_tab_a.setOnClickListener(this); 
    get_tab_b.setOnClickListener(this); 

    FragmentManager manager=getSupportFragmentManager(); 
    tab_a Tab_A=new tab_a(); 
    get_text_a.setTextColor(Color.WHITE); 
    FragmentTransaction transaction=manager.beginTransaction(); 
    transaction.add(R.id.container,Tab_A); // when the activity started, launch Fragment_one 
    transaction.commit(); 

} 

public void onClick(View v) { 

    FragmentManager manager=getSupportFragmentManager(); 
    FragmentTransaction transaction=manager.beginTransaction(); 

    switch (v.getId()){ 

     case R.id.view_a: // when user click on the 1st tab. 
      get_text_a.setTextColor(Color.WHITE); 
      get_text_b.setTextColor(Color.BLACK); 
      tab_a Tab_A=new tab_a(); 
      transaction.replace(R.id.container,Tab_A); 
      break; 

     case R.id.view_b: // when user click on the 2nd tab. 
      get_text_a.setTextColor(Color.BLACK); 
      get_text_b.setTextColor(Color.WHITE); 
      tab_b Tab_B=new tab_b(); 
      transaction.replace(R.id.container,Tab_B); 
      break; 
    } 
    transaction.commit(); 
} 
} 

tab_a.java

public class tab_a extends Fragment { 

private SectionsPagerAdapter mSectionsPagerAdapter; 

private ViewPager mViewPager; 

@Override 
public View onCreateView(LayoutInflater inflater, ViewGroup container, 
         Bundle savedInstanceState) { 

    View rootView = inflater.inflate(R.layout.fragment_tab_a,container,false); 

    mSectionsPagerAdapter = new SectionsPagerAdapter(getActivity().getSupportFragmentManager()); 
    mViewPager = (ViewPager)rootView.findViewById(R.id.ViewPager); 
    mViewPager.setAdapter(mSectionsPagerAdapter); 
    TabLayout tabLayout = (TabLayout)rootView.findViewById(R.id.TabLayout); 
    tabLayout.setupWithViewPager(mViewPager); 

    return rootView; 
} 

public class SectionsPagerAdapter extends FragmentPagerAdapter { 

    public SectionsPagerAdapter(FragmentManager fm) { 
     super(fm); 
    } 

    @Override 
    public Fragment getItem(int position) { 

     switch (position) { 
      case 0: 
       return new fg1(); 
      case 1: 
       return new fg2(); 
      case 2: 
       return new fg3(); 
      default: 
       return null; 
     } 
    } 

    @Override 
    public int getCount() { 

     return 3; 
    } 

    @Override 
    public CharSequence getPageTitle(int position) { 
     switch (position) { 
      case 0: 
       return "Tab 1"; 
      case 1: 
       return "Tab 2"; 
      case 2: 
       return "Tab 3"; 
     } 
     return null; 
    } 
} 
} 

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:layout_width="match_parent" 
android:layout_height="match_parent" 
tools:context="com.example.misc.MainActivity" 
android:orientation="vertical"> 

<LinearLayout 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:layout_weight="1" 
    android:background="#5194ff" 
    android:id="@+id/container"></LinearLayout> 

<LinearLayout 
    android:orientation="horizontal" 
    android:layout_width="match_parent" 
    android:layout_height="200dp" 
    android:layout_weight="1" 
    android:background="#b2b2b2"> 

    <RelativeLayout 
     android:orientation="horizontal" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:id="@+id/view_a"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceLarge" 
      android:text="Tab A" 
      android:id="@+id/tab_a" 
      android:layout_centerVertical="true" 
      android:layout_centerHorizontal="true" /> 
    </RelativeLayout> 

    <RelativeLayout 
     android:orientation="horizontal" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:id="@+id/view_b"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceLarge" 
      android:text="Tab B" 
      android:id="@+id/tab_b" 
      android:layout_centerVertical="true" 
      android:layout_centerHorizontal="true" /> 
    </RelativeLayout> 
</LinearLayout> 

fragment_tab_a.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:layout_width="match_parent" 
android:layout_height="match_parent" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
tools:context="com.example.misc.MainActivity" 
android:orientation="vertical"> 

<android.support.design.widget.TabLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:id="@+id/TabLayout" 
    android:layout_centerHorizontal="true" 
    android:background="#4052b5" 
    app:tabTextColor="@color/nava_text" 
    app:tabSelectedTextColor="@color/nava_text" 
    app:tabMode="fixed" 
    app:tabGravity="fill" 
    android:focusable="true" /> 

<android.support.v4.view.ViewPager 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:id="@+id/ViewPager" 
    android:layout_below="@+id/TabLayout" 
    android:layout_centerHorizontal="true" /> 

</LinearLayout> 

Answer 1

您使用嵌套的片段！你應該使用小孩片段管理器。

嘗試使用這樣的：

mSectionsPagerAdapter = new SectionsPagerAdapter(getChildFragmentManager()); 

代替：

mSectionsPagerAdapter = new SectionsPagerAdapter(getActivity().getSupportFragmentManager());