自我介绍
GitHub源码链接
主要实现功能是,Tab标签和ViewPager实现联动,并且实现Fragment填充内容,实现切换标签展示不同内容的效果。
1、依赖
dependencies {
compile 'cc.tracyzhang:PagerSlidingTabStrip:1.1.1'
}
2、布局中加入PagerSlidingTabStrip控件
它通常要在ViewPager控件之上,app:是姓名空间,自动填充就行,根据自己的业务逻辑的需要设置不同的属性
<com.astuetz.PagerSlidingTabStrip
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="40dp"
app:pstsIndicatorColor="#0f0" //滑动条颜色
app:pstsIndicatorHeight="2dp" //滑动条高度
app:pstsIndicatorMarginLeftRight="10dp"//滑动条距离左右距离
app:pstsUnderlineColor="#f00" //滑动条所在父线的颜色
app:pstsUnderlineHeight="1dp" //滑动条所在父线的高度
//如果设置为true,每个标签是相同的控件,均匀平分整个屏幕,默认是false
app:pstsShouldExpand="true"
app:pstsDividerColor="#00f" //分割线的颜色
app:pstsDividerWidth="1dp" //分割线的宽度
app:pstsDividerPadding="5dp"//分割线底部和顶部的填充宽度
app:pstsTabTextStyle="bold|italic" //
app:pstsTabBackground="@drawable/tab_bg" //标签文本背景颜色
app:pstsTabTextSize="30sp" //标签文本大小
app:pstsTextAllCaps //如果为true,所有标签都是大写字母,默认为true
/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</android.support.v4.view.ViewPager>
3、这是一个测试Fragment
public class TestFragment extends Fragment {
//定义TestFragment的获取对象方法,从外界获取文本内容
public static TestFragment newInstance(String content){
Bundle arg = getBundle(content);
TestFragment fragment = new TestFragment();
fragment.setArguments(arg);
return fragment;
}
//定义一个Bundle方法传输文本
@NonNull
public static Bundle getBundle(String content) {
Bundle arg = new Bundle();
arg.putString("content",content);
return arg;
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
Bundle arg = getArguments();//获取一个Bundle
String content = arg.getString("content");//通过定义好的tag获取数据
TextView textView = new TextView(getActivity());//代码实现布局,只是一个text的文本
textView.setText(content);//给文本设置获取到的内容
return textView;
}
}
4、绑定PagerSlidingTabStrip控件到ViewPager上
NewsFragment为例:
public class NewsFragment extends Fragment {
@butterknife.InjectView(R.id.tablayout)
PagerSlidingTabStrip tablayout;
@butterknife.InjectView(R.id.viewpager)
ViewPager viewpager;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_news, null);
butterknife.ButterKnife.inject(this, view);
//创建一个集合,放入创建Fragment
List<Fragment> fragmentlist = new ArrayList<>();
fragmentlist.add(TestFragment.newInstance("这是 资讯 界面"));
fragmentlist.add(TestFragment.newInstance("这是 热点 界面"));
fragmentlist.add(TestFragment.newInstance("这是 博客 界面"));
fragmentlist.add(TestFragment.newInstance("这是 推荐 界面"));
viewpager.setAdapter(newMyViewPagerAdapter(getFragmentManager(),fragmentlist));
// 关联标题栏和Viewpager
tablayout.setViewPager(viewpager);
@Override
public void onDestroyView() {
super.onDestroyView();
butterknife.ButterKnife.reset(this);
}
}
5、创建MyViewPagerAdapter
public class MyViewPagerAdapter extends FragmentPagerAdapter {
private List<Fragment> fragmentList;
//获取传入的集合
public MyViewPagerAdapter(FragmentManager fm, List<Fragment> fragmentList) {
super(fm);
this.fragmentList = fragmentList;
}
//索引下对应的Fragment
@Override
public Fragment getItem(int position) {
return fragmentList.get(position);
}
//获取有多少个Fragment
@Override
public int getCount() {
return fragmentList.size();
}
//tab标签设置文本
@Override
public CharSequence getPageTitle(int position) {
return "界面 "+position;
}
}
/**
* 初始化指针控件
* 特殊要求:必须重写adapter中的getpagetitle
*/
private void initPagerSlidingTabStrip() {
// 写在ViewPager初始化后面
PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) findViewById(R.id.main_content_viewpager_tabs);
//设置标签的高
tabs.setIndicatorHeight(5);
//设置颜色
//颜色
int color= Color.parseColor("#38ACFF");
tabs.setIndicatorColor(color);
//设置分割线
tabs.setUnderlineHeight(2);
tabs.setUnderlineColor(color);
//设置标签字体大小
tabs.setTextSize(25);
//设置字体颜色,选择器StateList表示选择器内的item>=2
tabs.setTextColorStateListResource(R.drawable.tab_text_color_selector);
//设置标签背景透明
tabs.setTabBackground(android.R.color.transparent);
//设置初始化后的ViewPager
tabs.setViewPager(mViewPager);
}