【问题标题】：How to use tablayout with bottom navigation and viewpager?如何使用带有底部导航和 viewpager 的 tablayout？
【发布时间】：2018-08-06 04:28:27
【问题描述】：

我使用bottom navigation bar 创建了一个活动。当我想切换到另一个片段时，我想要tablayout。而tablayout可以控制viewpager。我可以把viewpager放到指定的fragment吗？

我想要这样：

这是当前结果。我想把viewpager放在红框里。

【问题讨论】：

您是否要将您的bottom navigation bar 和tablayout 与viewpager 同步

标签： android kotlin android-viewpager android-tablayout bottomnavigationview

【解决方案1】：

尝试使用此方法将您的 BottomNavigationView 和 TabLayout 与 ViewPager 同步

    myBottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
        @Override
        public boolean onNavigationItemSelected(@NonNull MenuItem item) {

            int id = item.getItemId();

            if (id == R.id.action_one) {
                myViewPager.setCurrentItem(0);
            }else if (id == R.id.action_two) {
                myViewPager.setCurrentItem(1);
            }else if (id == R.id.action_three) {
                myViewPager.setCurrentItem(2);
            }else if (id == R.id.action_four) {
                myViewPager.setCurrentItem(3);
            }
            return false;
        }
    });


    myViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            if (position == 0) {
                myBottomNavigationView.setSelectedItemId(R.id.action_one);
            }else if (position == 1) {
                myBottomNavigationView.setSelectedItemId(R.id.action_two);
            }else if (position == 2) {
                myBottomNavigationView.setSelectedItemId(R.id.action_three);
            }else if (position == 3) {
                myBottomNavigationView.setSelectedItemId(R.id.action_four);
            }
        }

        @Override
        public void onPageSelected(int position) {

        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    });

【讨论】：

【解决方案2】：

您需要将视图寻呼机放在 Activity 上。制作一个视图寻呼机适配器。在您的适配器中连接您的不同片段。之后，您可以在下面给出 Activity 示例上设置您的适配器。抱歉，我们需要将您的标签布局放在 vewPager 之前。在 View Pager Adapter 上连接选项卡布局。

activity_main.xml

<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:id="@+id/assignment_activitly"
>
<android.support.design.widget.TabLayout
       android:id="@+id/tablayout"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       app:tabMode="fixed"
       android:background="@color/colorPrimary"
       app:tabTextColor="@color/textPrimary"
       app:tabSelectedTextColor="@color/colorAccent"
       app:tabTextAppearance="@style/Tab"
       />
   <android.support.v4.view.ViewPager
       android:id="@+id/viewpager"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:background="@android:color/white"
       />
</LinearLayout>

MainActivity.java

public class MainActivity extends Activity {
   ViewPager viewpager;
   TabLayout tabLayout;
   public void onCreate(Bundle savedInstanceState) {
   viewpager = findViewById(R.id.viewpager);
   tabLayout = findViewById(R.id.tablayout);
   super.onCreate(saveedInstanceState);
   .........
   ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
   viewpager.setViewPager(adapter);
   tabLayout.setupWithViewPager(viewPager);     
   }
}

ViewPagerAdapter

public class ViewPagerAdapter extends FragmentPagerAdapter {
 private String tabTitles [] = new String[] {"title first", "title Second"};
  public ViewPagerAdapter(FragmentManager fm) {
    super(fm);

}

@Override
public Fragment getItem(int position) {
    if (position == 0) {
        return new YourFragmentFirst();
    } else if (....){
        return new YourFragmentSeconde();
    }
    ........  
}

@Override
public int getCount() {
    return  //return your number of Fragment;
}

@Override
public CharSequence getPageTitle(int position) {
    return tabTitles[position];
}
}

【讨论】：