如何在片段中使用 viewpager 和 tablayout？答案

【问题标题】：How to use viewpager and tablayout inside a fragment?如何在片段中使用 viewpager 和 tablayout？
【发布时间】：2023-03-24 16:13:01
【问题描述】：

我需要我的应用具有底栏导航和可滑动标签。所以我需要viewpager在嵌套在底部导航使用的每个片段内的片段之间进行交换。我该怎么做？

【问题讨论】：

它与您在活动中所做的相同（如果您已经这样做了）只是不同之处在于您在片段中将getChildFragmentManager()而不是getSupportFragmentManager()传递给您的fragmentPagerAdapter's`构造函数

标签： android android-viewpager fragment

【解决方案1】：

首先，您像这样创建一个包含 ViewPager 和 TabLayout 的 Fragment

<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"
    android:orientation="vertical"
    tools:context=".FragmentThatHasViewPagerAndTabLayout">

    <android.support.design.widget.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

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

</LinearLayout>

然后创建一个包含 FrameLayout（将用作片段容器）和 BottomNavigation 的 Activity

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

    <FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/colorPrimary"
        app:itemIconTint="#FFF"
        app:itemTextColor="#FFF"
        app:menu="@menu/menu_bottom_navigation"/>

</LinearLayout>

Activity 的代码片段

public class MainActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        BottomNavigationView bottomNavigationView = findViewById(R.id.bottom_navigation_view);
        bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
                  //Change fragment when select another item in BottomNavigation
            }
        }
        getFragmentManager().beginTransaction().replace(R.id.fragment_container, new FragmentThatHasViewPagerAndTabLayout(), "TAG_TO_REUSE_FRAGMENT_AFTER_CONFIG_CHANGES").commit();
}

Fragment 中包含 ViewPager 和 TabLayout 的代码，你只需像往常一样编写它（比如有一个 FragmentPagerAdapter 等）

【讨论】：