使用support.design.widget.TabLayout和ViewPager组合成滑动标签组件
引入
compile 'com.android.support:design:23.1.1'
布局文件
<android.support.design.widget.TabLayout android:id="@+id/tabLayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabGravity="center" app:tabIndicatorColor="#FFFF0000" app:tabMode="scrollable" app:tabSelectedTextColor="#FF0000FF" app:tabTextColor="#FF987898"> </android.support.design.widget.TabLayout> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent" />
找到该控件
private void initView() { TabLayout tabLayout = (TabLayout) findViewById(R.id.tabLayout); ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager); }
准备要填充的Fragment和Titles
private void initData() { for (int i = 0; i < 7; i++) { mTitle[i] = "title" + i; } MyFragment f1 = new MyFragment(getApplicationContext(), "A"); MyFragment f2 = new MyFragment(getApplicationContext(), "B"); MyFragment f3 = new MyFragment(getApplicationContext(), "C"); MyFragment f4 = new MyFragment(getApplicationContext(), "D"); MyFragment f5 = new MyFragment(getApplicationContext(), "E"); MyFragment f6 = new MyFragment(getApplicationContext(), "F"); MyFragment f7 = new MyFragment(getApplicationContext(), "G"); list.add(f1); list.add(f2); list.add(f3); list.add(f4); list.add(f5); list.add(f6); list.add(f7); }
补充: MyFragment继承自Fragment(一定要使用V4包)
@SuppressLint("ValidFragment")//提示保措时,添加这句话即可 public class MyFragment extends Fragment { private Context context; private String str; public MyFragment(Context context,String str) { this.context = context; this.str=str; } @Nullable @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { TextView tv = new TextView(context); tv.setText(str); tv.setTextSize(90); return tv; } }
new FragmentPagerAdapter
重写默认的两个方法,绑定Fragment个数和Fragment(注意这里的Fragment使用V4包的)
手动引入重写getPageTitle方法,绑定tabLayout的标题组
FragmentPagerAdapter adapter = new FragmentPagerAdapter(getSupportFragmentManager()) { @Override public int getCount() { return list.size(); } @Override public Fragment getItem(int position) { return list.get(position); } @Override public CharSequence getPageTitle(int position) { return mTitle[position]; } };
后续设置:
- ★从adapte的getPageTitle方法中得到tabLayout的标题,
- 给viewPager设置适配器
互相绑定tablayout和viewpager,使其联动。
tabLayout.setTabsFromPagerAdapter(adapter);//从adapte的getPageTitle方法中得到tabLayout的标题 viewPager.setAdapter(adapter);//略 /* (互相绑定tablayout和viewpager)这个方法是addOnPageChangeListener和setOnTabSelectedListener的封装。 ★但是需要注意一下,setupWithViePager必须在ViewPager.setAdapter()之后调用! */ tabLayout.setupWithViewPager(viewPager);