安卓笔记之PagerSlidingTabStrip

今天学习了一下开源框架PagerSlidingTabStrip

github网址https://github.com/astuetz/PagerSlidingTabStrip



这个框架很实用，用的也很广。就是有点小缺陷，如果你直接用它的jar包的话，他的源码中默认的标签字体和颜色不能够修改，而且还没有提供设置的方法。

private int tabTextSize = 12;//默认的tab字体大小
private int tabTextColor = 0xFF666666;//默认的颜色

库文件导入

如果你在项目中需要修改它的标签属性的话最好还是别用jar包，直接依赖它的库文件。

首先把github中的源码下载下来，然后找到library文件夹，把它导入的当前的项目所处的project中，然后将library改为PagerSlidingTabStrip，修改一下这个库文件的gradle：

android {

    compileSdkVersion 你自己的
    buildToolsVersion 你自己的
    defaultConfig {

        minSdkVersion 15
        targetSdkVersion 你自己的
    }

在你的项目的gradle中添加

compile project(':PagerSlidingTabStrip')

再同步一下，这样就可以用了。

PagerSlidingTabStrip的使用

用法很简单，把它当作一个普通的控件就可以了

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.admin.myapplication.MainActivity">
<com.astuetz.PagerSlidingTabStrip
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:id="@+id/pagerSliding"
app:pstsIndicatorColor="@color/colorPrimaryDark"
android:layout_height="40dp">
</com.astuetz.PagerSlidingTabStrip>

<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:id="@+id/viewPager"
android:layout_height="match_parent">

</android.support.v4.view.ViewPager>

</RelativeLayout>

在使用的时候一定要注意viewPager的setAdapter方法一定要在mPagerSlidingTabStrip.setViewPager(mViewPager);的前面执行，不然会出现空指针。

public class MainActivity extends Activity {
private PagerSlidingTabStrip mPagerSlidingTabStrip;
private ViewPager mViewPager;
private HomeAdapter mHomeAdapter;
private
b212
String[] mMainTitles={"主页","娱乐","科技","美食","新闻"};

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
}

private void initData() {
mHomeAdapter=new HomeAdapter();
mViewPager.setAdapter(mHomeAdapter);
mPagerSlidingTabStrip.setViewPager(mViewPager);//要在setAdapter的后面执行
}

private void initView() {
mPagerSlidingTabStrip = (PagerSlidingTabStrip) findViewById(R.id.pagerSliding);
mViewPager = (ViewPager) findViewById(R.id.viewPager);
}

private class HomeAdapter extends PagerAdapter{
@Override
public int getCount() {
if(mMainTitles!=null)
return mMainTitles.length;
return 0;
}

@Override
public boolean isViewFromObject(View view, Object object) {
return view==object;
}

@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
TextView textView=new TextView(UIUtils.getContext());
textView.setText(mMainTitles[position]);
return textView;
}

/**
* 必须要重写此方法
* @param position
* @return
*/
@Override
public CharSequence getPageTitle(int position) {
return mMainTitles[position];
}
}

如何改成你想要的PagerSlidingTabStrip？

如果你想要为在滑动的同时改变标签的字体和颜色，可以通过以下方式：

在源码中添加以下属性
private int tabSelectedSize=18;//选择时的字体大小
private int tabSelectedColor=0x1F00ff00;//选择时的字体颜色
private int mSelectedPosition;//被选择的下标

在源码的attr.xml文件中添加

<?xml version="1.0" encoding="utf-8"?>
<resources>

<declare-styleable name="PagerSlidingTabStrip">
<attr name="pstsIndicatorColor" format="color" />
<attr name="pstsUnderlineColor" format="color" />
<attr name="pstsDividerColor" format="color" />
<attr name="pstsIndicatorHeight" format="dimension" />
<attr name="pstsUnderlineHeight" format="dimension" />
<attr name="pstsDividerPadding" format="dimension" />
<attr name="pstsTabPaddingLeftRight" format="dimension" />
<attr name="pstsScrollOffset" format="dimension" />
<attr name="pstsTabBackground" format="reference" />
<attr name="pstsShouldExpand" format="boolean" />
<attr name="pstsTextAllCaps" format="boolean" />
<!--添加字体的属性-->
<attr name="tabSelectedColor" format="color"/>
<attr name="tabSelectedSize" format="dimension"/>
<attr name="tabTextSize" format="dimension"/>
<attr name="tabTextColor" format="color"/>

</declare-styleable>

</resources>

在源码中的添加这写代码到其他属性相同位置

tabTextColor=a.getColor(R.styleable.PagerSlidingTabStrip_tabTextColor,tabTextColor);
tabSelectedColor=a.getColor(R.styleable.PagerSlidingTabStrip_tabSelectedColor,tabSelectedColor);
tabTextSize=a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_tabTextSize,tabTextSize);
tabSelectedSize=a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_tabSelectedSize,tabSelectedSize);

在PageListener类中

@Override
public void onPageSelected(int position) {
if (delegatePageListener != null) {
delegatePageListener.onPageSelected(position);
}
mSelectedPosition = position;//将mselectedPosition的值改为当前的position
updateTabStyles();//更新标签样式
}

在updateTabStyles()中

private void updateTabStyles() {

for (int i = 0; i < tabCount; i++) {

View v = tabsContainer.getChildAt(i);

v.setBackgroundResource(tabBackgroundResId);

if (v instanceof TextView) {

TextView tab = (TextView) v;
tab.setTextSize(TypedValue.COMPLEX_UNIT_PX, tabTextSize);
tab.setTypeface(tabTypeface, tabTypefaceStyle);
tab.setTextColor(tabTextColor);

// setAllCaps() is only available from API 14, so the upper case is made manually if we are on a
// pre-ICS-build
if (textAllCaps) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
tab.setAllCaps(true);
} else {
tab.setText(tab.getText().toString().toUpperCase(locale));
}
}
/**
* 如果当前选中，更改字体样式
*/
if(i==mSelectedPosition){
tab.setTextSize(TypedValue.COMPLEX_UNIT_PX, tabSelectedSize);
tab.setTextColor(tabSelectedColor);
}
}

}

}

之后就可以用了

<com.astuetz.PagerSlidingTabStrip
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:id="@+id/pagerSliding"
app:tabTextColor="@color/colorAccent"
app:tabSelectedColor="#00ff00"
app:tabTextSize="14sp"
app:tabSelectedSize="16sp"
app:pstsIndicatorColor="@color/colorPrimaryDark"
app:pstsIndicatorHeight="2dp"
android:layout_height="40dp">
</com.astuetz.PagerSlidingTabStrip>