TabLayout使用
基本使用
1.基本布局
<!--选项卡-->
<android.support.design.widget.TabLayout
android:id="@+id/tab_detail_video"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:tabGravity="center"
app:tabIndicatorColor="@color/primary"
app:tabMode="scrollable"
app:tabSelectedTextColor="@color/primary"
app:tabTextColor="@color/fontlight"/>
<!--viewpager-->
<android.support.v4.view.ViewPager
android:id="@+id/vp_detail_video"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
属性说明
app:tabIndicatorColor="@color/primary"
设置指示器的颜色app:tabSelectedTextColor="@color/primary"
设置被选中Tab的文字颜色app:tabTextColor="@color/fontlight"
设置Tab文字颜色app:tabGravity="center"
设置Tab的Gravity.有center(居中)和fill(填满)两种效果.app:tabMode="scrollable"
布局中Tab的行为模式有两种值:fixed和scrollable
fixed:固定tabs,并同时显示所有的tabs
scrollable:可滚动tabs,显示一部分tabs,在这个模式下能包含长标签和大量的tabs,最好用于用户不需要直接比较tabs
- 注意,GRAVITY_FILL需要和MODE_FIXED一起使用才有效果
动态设置
//1.MODE_SCROLLABLE模式
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
//2.MODE_FIXED模式
tabLayout.setTabMode(TabLayout.MODE_FIXED);
2.适配器
public class VideoFrgAdapter extends FragmentPagerAdapter {
private List<Fragment> list_fragment;//fragment列表
private List<String> list_Title;//tab名的列表
public VideoFrgAdapter(FragmentManager fm, List<Fragment> list_fragment, List<String> list_Title) {
super(fm);
this.list_fragment = list_fragment;
this.list_Title = list_Title;
}
@Override
public Fragment getItem(int position) {
return list_fragment.get(position);
}
@Override
public int getCount() {
return list_Title.size();
}
//此方法用来显示tab上的名字
@Override
public CharSequence getPageTitle(int position) {
return list_Title.get(position % list_Title.size());
}
}
3.Activity或Fragment中调用
第一步:声明
private TabLayout tab_FindFragment_title;//定义TabLayout
private ViewPager vp_FindFragment_pager;//定义viewPager
private FragmentPagerAdapter fAdapter;//定义adapter
private List<Fragment> list_fragment;//定义要装fragment的列表
private List<String> list_title;//tab名称列表
private VideoInfoFragment videoInfoFragment;//视频信息fragment
private VideoCommentFragment videoCommentFragment;//视频评论fragment
第二步:在onCreate里调用initFragment()
/**
* 初始化碎片
*/
private void initFragment() {
tab_FindFragment_title = (TabLayout) findViewById(R.id.tab_detail_video);
vp_FindFragment_pager = (ViewPager) findViewById(R.id.vp_detail_video);
//初始化各fragment
videoInfoFragment = new VideoInfoFragment();
videoCommentFragment = new VideoCommentFragment();
//将fragment装进列表中
list_fragment = new ArrayList<>();
list_fragment.add(videoInfoFragment);
list_fragment.add(videoCommentFragment);
//将名称加载tab名字列表,正常情况下,我们应该在values/arrays.xml中进行定义然后调用
list_title = new ArrayList<>();
list_title.add("简介");
list_title.add("其他");
//设置TabLayout的模式
//tab_FindFragment_title.setTabMode(TabLayout.MODE_FIXED);
//为TabLayout添加tab名称
tab_FindFragment_title.addTab(tab_FindFragment_title.newTab().setText(list_title.get(0)));
tab_FindFragment_title.addTab(tab_FindFragment_title.newTab().setText(list_title.get(1)));
fAdapter = new VideoFrgAdapter(getSupportFragmentManager(), list_fragment, list_title);
//viewpager加载adapter
vp_FindFragment_pager.setAdapter(fAdapter);
//TabLayout加载viewpager
tab_FindFragment_title.setupWithViewPager(vp_FindFragment_pager);
}
4.其他
让Tab在屏幕左侧的方法
1. 给TabLayout外部添加一个布局,宽度撑满屏幕吗match_parent
2. TabLayout的宽度包括内容wrap_content
3. TabLayout的tabGravity属性设置为center
<!--添加了一个TabLayout的外侧布局,实现选项卡在屏幕左边,并且背景白色的样式-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/white">
<!--选项卡-->
<android.support.design.widget.TabLayout
android:id="@+id/tab_detail_video"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:tabGravity="center"
app:tabIndicatorColor="@color/primary"
app:tabMode="scrollable"
app:tabSelectedTextColor="@color/primary"
app:tabTextColor="@color/fontlight"/>
</RelativeLayout>