博客

使用ViewPager实现三个fragment切换

  • Post category:other

当然，我可以为您提供“使用ViewPager实现三个fragment切换的完整攻略”，包括过程中的两个示例。以下是详细步骤：

使用ViewPager实现三个fragment切换

  1. 添加ViewPager和TabLayout

首先，在布局文件中添加ViewPager和TabLayout：

<androidx.viewpager.widget.ViewPager
    android:id="@+id/viewPager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabMode="fixed"
    app:tabGravity="fill" />
  1. 创建Fragment

接下来，创建三个Fragment，分别为Fragment1、Fragment2和Fragment3。

public class Fragment1 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment1, container, false);
        return view;
    }
}

public class Fragment2 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment2, container, false);
        return view;
    }
}

public class Fragment3 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment3, container, false);
        return view;
    }
}
  1. 创建PagerAdapter

接下来，创建PagerAdapter，用于管理Fragment的切换：

public class MyPagerAdapter extends FragmentPagerAdapter {
    private List<Fragment> fragmentList;

    public MyPagerAdapter(FragmentManager fm, List<Fragment> fragmentList) {
        super(fm);
        this.fragmentList = fragmentList;
    }

    @Override
    public Fragment getItem(int position) {
        return fragmentList.get(position);
    }

    @Override
    public int getCount() {
        return fragmentList.size();
    }
}
  1. 设置ViewPager和TabLayout

最后，在Activity中设置ViewPager和TabLayout：

public class MainActivity extends AppCompatActivity {
    private ViewPager viewPager;
    private TabLayout tabLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        viewPager = findViewById(R.id.viewPager);
        tabLayout = findViewById(R.id.tabLayout);

        List<Fragment> fragmentList = new ArrayList<>();
        fragmentList.add(new Fragment1());
        fragmentList.add(new Fragment2());
        fragmentList.add(new Fragment3());

        MyPagerAdapter adapter = new MyPagerAdapter(getSupportFragmentManager(), fragmentList);
        viewPager.setAdapter(adapter);
        tabLayout.setupWithViewPager(viewPager);
    }
}

在上面的示例中，我们首先在布局文件中添加了ViewPager和TabLayout。然后，我们创建了三个Fragment，分别为Fragment1、Fragment2和Fragment3。接下来，我们创建了PagerAdapter，用于管理Fragment的切换。最后，在Activity中设置ViewPager和TabLayout，并将PagerAdapter与ViewPager关联起来。

示例1：添加Fragment

以下是添加Fragment的示例：

public class Fragment4 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment4, container, false);
        return view;
    }
}

public class MainActivity extends AppCompatActivity {
    private ViewPager viewPager;
    private TabLayout tabLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        viewPager = findViewById(R.id.viewPager);
        tabLayout = findViewById(R.id.tabLayout);

        List<Fragment> fragmentList = new ArrayList<>();
        fragmentList.add(new Fragment1());
        fragmentList.add(new Fragment2());
        fragmentList.add(new Fragment3());
        fragmentList.add(new Fragment4());

        MyPagerAdapter adapter = new MyPagerAdapter(getSupportFragmentManager(), fragmentList);
        viewPager.setAdapter(adapter);
        tabLayout.setupWithViewPager(viewPager);
    }
}

在上面的示例中，我们首先创建了一个新的FragmentFragment4，然后将其添加到了Fragment列表中。最后，我们将PagerAdapterViewPager关联起来，并将TabLayout与ViewPager关联起来。

示例2：自定义TabLayout

以下是自定义TabLayout的示例：

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabLayout    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabMode="fixed"
    app:tabGravity="fill"
    app:tabIndicatorHeight="4dp"
    app:tabSelectedTextColor="@color/colorAccent"
    app:tabTextColor="@color/colorPrimary" />

在上面的示例中，我们使用了一些属性来自定义TabLayout的样式，例如tabIndicatorHeight用于设置选中标签的高度，tabSelectedTextColor用于设置选中标签的文本颜色，tabTextColor用于设置未选中标签的文本颜色。

Tags: