Android Tablayout+ViewPager+Fragment

最新推荐文章于 2026-04-18 06:35:56 发布

原创最新推荐文章于 2026-04-18 06:35:56 发布 · 1.2k 阅读

6 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#android #viewpager #android studio #app #移动开发

Android开发专栏收录该内容

1 篇文章

订阅专栏

本文详细介绍了如何在Android应用中结合Tablayout、ViewPager和Fragment进行开发。首先，通过XML布局文件创建界面，然后获取Tablayout和ViewPager实例。接着初始化Fragment，创建自定义的FragmentPagerAdapter，并设置适配器。最后，将Tablayout与ViewPager绑定，完成分页功能。文章适合Android开发者参考学习。

正文

我们在进行开发的时候可能需要使用Fragment，更多时候是结合Tablayout和ViewPager来使用，我们的使用步骤一般是

获取Tablayout和ViewPager控件的实例
初始化各个Fragment
初始化自定义的FragmentPagerAdapter
给ViewPager设置适配器，即设置FragmentPagerAdapter
让Tablayout和ViewPager绑定

下面就让我们来看看具体怎么做

XML布局文件

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/main_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top">

        <android.support.v7.widget.Toolbar
            android:id="@+id/main_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:layout_scrollFlags="scroll|enterAlways|snap"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/main_view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <android.support.design.widget.TabLayout
        android:id="@+id/main_tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary"
        android:layout_gravity="bottom"
        app:tabIndicatorHeight="0dp"
        app:tabSelectedTextColor="@color/colorAccent"
        app:tabTextColor="@color/colorWhite" />

</android.support.design.widget.CoordinatorLayout>

获取实例

mTabLayout = findViewById(R.id.main_tab_layout);
mViewPager = findViewById(R.id.main_view_pager);

初始化Fragment

这个Fragment可以是你自定义的Fragment，也可以是原生的Fragment，不过一般都是用自定义的Fragment，所以在这里就不写具体的代码

自定义适配器FragmentPagerAdapter

package com.yk.mchat.utils;

import android.content.Context;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import java.util.List;

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {

    private Context mContext;

    private List<Fragment> fragmentList;

    private List<String> titles;

    public MyFragmentPagerAdapter(FragmentManager fm, Context mContext, List<Fragment> fragmentList, List<String> titles){
        super(fm);
        this.mContext=mContext;
        this.fragmentList=fragmentList;
        this.titles=titles;
    }

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

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

    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return titles.get(position);
    }
}

这个是我们自定义的适配器
接着我们就可以初始化适配器了

mAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), MainActivity.this, mFragmentList, mTabTitles);

设置适配器

mViewPager.setAdapter(mAdapter);

Tablayout绑定ViewPager

mTabLayout.setupWithViewPager(mViewPager);

这样，我们的分页就做好了，这个就是Tablayout+ViewPager+Fragment，希望大家能够喜欢，如果有写错的或者不太规范的，望大家能评论指正。