1.在build.gradle(Module app)中添加包
dependencies {
compile 'com.astuetz:pagerslidingtabstrip:1.0.1'
}
2.布局文件中使用
<com.astuetz.PagerSlidingTabStrip
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="48dip" />
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
3.在activity中使用
public class Activity extends AppCompatActivity{
private PagerSlidingTabStrip pagersliding;
private ViewPager viewpager;
private Fragment1 fragment1=null;
private Fragment2 fragment2=null;//要用几个fragment就写几个
//获取当前屏幕的密度
private DisplayMetrics dm;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_campus);
init();
}
private void init() {
dm = getResources().getDisplayMetrics();//获取屏幕密度
viewpager=(ViewPager)findViewById(R.id.viewpager);
viewpager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));
pagersliding = (PagerSlidingTabStrip) findViewById(R.id.tabs);
pagersliding.setViewPager(viewpager);
imageButton=(ImageButton)findViewById(R.id.ib_return);
imageButton.setOnClickListener(this);
}
private void setpagerstyle() {
pagersliding.setShouldExpand(true); // 设置Tab是自动填充满屏幕的
pagersliding.setDividerColor(Color.TRANSPARENT); // 设置Tab的分割线是透明的
// 设置Tab底部线的高度
pagersliding.setUnderlineHeight((int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_DIP, 1, dm));
// 设置Tab Indicator的高度
pagersliding.setIndicatorHeight((int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_DIP, 4, dm));
// 设置Tab标题文字的大小
pagersliding.setTextSize((int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_SP, 16, dm));
pagersliding.setIndicatorColor(Color.parseColor("#45c01a"));// 设置Tab Indicator的颜色
// 设置选中Tab文字的颜色 (这是自定义的一个方法)
//pagersliding.setSelectedTextColor(Color.parseColor("#45c01a"));
pagersliding.setTabBackground(0); // 取消点击Tab时的背景色
}
}
//自定义ViewPagerAdapter子类
private class MyPagerAdapter extends FragmentPagerAdapter {
private String[] titles = {"fragment1","fragment2"};//显示在二级导航上的标题文字
public MyPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
switch (position) {
case 0:
if (fragment1 == null) {
fragment1 = new CampusFragment(1);
}
return fragment1;
case 1:
if (fragment2 == null) {
fragment2 = new CampusFragment(2);
}
return fragment2;
default:
return null;
}
}
@Override
public int getCount() {
return titles.length;
}
@Override
public CharSequence getPageTitle(int position) {
return titles[position];
}
}
4.创建Fragment1,Fragment2类
public class Fragment1 extends Fragment{
private View view=null;
private Context context;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
view = inflater.inflate(R.layout.fragment1, container, false);
context = getActivity();
return view;
}
}
public class Fragment2 extends Fragment{
private View view=null;
private Context context;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
view = inflater.inflate(R.layout.fragment2, container, false);
context = getActivity();
return view;
}
}
5.创建fragment1.xml,fragment2.xml布局文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
</LinearLayout>