PagerSlidingTabStrip + ViewPager

public class PagerSlidingTabStrip extends HorizontalScrollView {

public interface IconTabProvider {
public int getPageIconResId(int position);
}

// @formatter:off
private static final int[] ATTRS = new int[]{
android.R.attr.textSize,
android.R.attr.textColor
};
// @formatter:on

private LinearLayout.LayoutParams defaultTabLayoutParams;
private LinearLayout.LayoutParams expandedTabLayoutParams;

private final PageListener pageListener = new PageListener();
public OnPageChangeListener delegatePageListener;

private LinearLayout tabsContainer;
private ViewPager pager;

private int tabCount;

private int currentPosition = 0;
private int selectedPosition = 0;
private float currentPositionOffset = 0f;

private Paint rectPaint;
private Paint dividerPaint;

private int indicatorColor = 0xFF666666;
private int underlineColor = 0x1A000000;
private int dividerColor = 0x1A000000;

private boolean shouldExpand = false;
private boolean textAllCaps = true;

private int scrollOffset = 52;
private int indicatorHeight = 8;
private int underlineHeight = 2;
private int dividerPadding = 12;
private int tabPadding = 24;
private int dividerWidth = 1;
private int underlineMarginTop = 0;

private int maxLineWidth;
private int tabTextSize = 12;
private int tabTextColor = 0xFF666666;
private int selectedTabTextColor = 0xFF666666;
private Typeface tabTypeface = null;
private int tabTypefaceStyle = Typeface.NORMAL;

private int lastScrollX = 0;

private int tabBackgroundResId = R.drawable.background_tab;

private Locale locale;

public PagerSlidingTabStrip(Context context) {
this(context, null);
}

public PagerSlidingTabStrip(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}

public PagerSlidingTabStrip(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);

setFillViewport(true);
setWillNotDraw(false);

tabsContainer = new LinearLayout(context);
tabsContainer.setOrientation(LinearLayout.HORIZONTAL);
tabsContainer.setLayoutParams(new LayoutParams(android.view.ViewGroup.LayoutParams.MATCH_PARENT, android.view.ViewGroup.LayoutParams.MATCH_PARENT));
addView(tabsContainer);

DisplayMetrics dm = getResources().getDisplayMetrics();

scrollOffset = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, scrollOffset, dm);
indicatorHeight = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, indicatorHeight, dm);
underlineHeight = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, underlineHeight, dm);
dividerPadding = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dividerPadding, dm);
tabPadding = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, tabPadding, dm);
dividerWidth = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dividerWidth, dm);
tabTextSize = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, tabTextSize, dm);

// get system attrs (android:textSize and android:textColor)

TypedArray a = context.obtainStyledAttributes(attrs, ATTRS);

tabTextSize = a.getDimensionPixelSize(0, tabTextSize);
tabTextColor = a.getColor(1, tabTextColor);

a.recycle();

// get custom attrs

a = context.obtainStyledAttributes(attrs, R.styleable.PagerSlidingTabStrip);

indicatorColor = a.getColor(R.styleable.PagerSlidingTabStrip_pstsIndicatorColor, indicatorColor);
underlineColor = a.getColor(R.styleable.PagerSlidingTabStrip_pstsUnderlineColor, underlineColor);
dividerColor = a.getColor(R.styleable.PagerSlidingTabStrip_pstsDividerColor, dividerColor);
indicatorHeight = a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_pstsIndicatorHeight, indicatorHeight);
underlineHeight = a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_pstsUnderlineHeight, underlineHeight);
dividerPadding = a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_pstsDividerPadding, dividerPadding);
tabPadding = a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_pstsTabPaddingLeftRight, tabPadding);
tabBackgroundResId = a.getResourceId(R.styleable.PagerSlidingTabStrip_pstsTabBackground, tabBackgroundResId);
shouldExpand = a.getBoolean(R.styleable.PagerSlidingTabStrip_pstsShouldExpand, shouldExpand);
scrollOffset = a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_pstsScrollOffset, scrollOffset);
textAllCaps = a.getBoolean(R.styleable.PagerSlidingTabStrip_pstsTextAllCaps, textAllCaps);
selectedTabTextColor = a.getColor(R.styleable.PagerSlidingTabStrip_selectedTabTextColor, selectedTabTextColor);
maxLineWidth = a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_pstsMaxLineWidth, 0);
tabTextSize = a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_tabTextSize, dp2px(context, 16));
underlineMarginTop = a.getDimensionPixelSize(R.styleable.PagerSlidingTabStrip_underlineMarginTop, underlineMarginTop);
a.recycle();

rectPaint = new Paint();
rectPaint.setAntiAlias(true);
rectPaint.setStyle(Style.FILL);

dividerPaint = new Paint();
dividerPaint.setAntiAlias(true);
dividerPaint.setStrokeWidth(dividerWidth);

defaultTabLayoutParams = new LinearLayout.LayoutParams(android.view.ViewGroup.LayoutParams.WRAP_CONTENT, android.view.ViewGroup.LayoutParams.MATCH_PARENT);
expandedTabLayoutParams = new LinearLayout.LayoutParams(0, android.view.ViewGroup.LayoutParams.MATCH_PARENT, 1.0f);

if (locale == null) {
locale = getResources().getConfiguration().locale;
}
}

public static int dp2px(Context context, float value) {
final float scale = context.getResources().getDisplayMetrics().densityDpi;
return (int) (value * (scale / 160) + 0.5f);
}

public void setViewPager(ViewPager pager) {
this.pager = pager;

if (pager.getAdapter() == null) {
throw new IllegalStateException("ViewPager does not have adapter instance.");
}

pager.setOnPageChangeListener(pageListener);

notifyDataSetChanged();
}

public void setOnPageChangeListener(OnPageChangeListener listener) {
this.delegatePageListener = listener;
}

public void notifyDataSetChanged() {

tabsContainer.removeAllViews();

tabCount = pager.getAdapter().getCount();

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

if (pager.getAdapter() instanceof IconTabProvider) {
addIconTab(i, ((IconTabProvider) pager.getAdapter()).getPageIconResId(i));
} else {
addTextTab(i, pager.getAdapter().getPageTitle(i).toString());
}

}

updateTabStyles();

getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {

@Override
public void onGlobalLayout() {
getViewTreeObserver().removeGlobalOnLayoutListener(this);
currentPosition = pager.getCurrentItem();
scrollToChild(currentPosition, 0);
}
});

}

private void addTextTab(final int position, String title) {

TextView tab = new TextView(getContext());
tab.setText(title);
tab.setGravity(Gravity.CENTER);
tab.setSingleLine();
addTab(position, tab);
}

private void addIconTab(final int position, int resId) {

ImageButton tab = new ImageButton(getContext());
tab.setImageResource(resId);

addTab(position, tab);

}

private void addTab(final int position, View tab) {
tab.setFocusable(true);
tab.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
pager.setCurrentItem(position);
}
});

tab.setPadding(tabPadding, 0, tabPadding, 0);
tabsContainer.addView(tab, position, shouldExpand ? expandedTabLayoutParams : defaultTabLayoutParams);
}

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, tabT
4000
ypefaceStyle);
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 == selectedPosition) {
tab.setTextColor(selectedTabTextColor);
}
}
}

}

private void scrollToChild(int position, int offset) {

if (tabCount == 0) {
return;
}

int newScrollX = tabsContainer.getChildAt(position).getLeft() + offset;

if (position > 0 || offset > 0) {
newScrollX -= scrollOffset;
}

if (newScrollX != lastScrollX) {
lastScrollX = newScrollX;
scrollTo(newScrollX, 0);
}

}

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);

if (isInEditMode() || tabCount == 0) {
return;
}

final int height = getHeight();

// draw underline
rectPaint.setColor(underlineColor);
canvas.drawRect(0, height - underlineHeight, tabsContainer.getWidth(), height, rectPaint);

// draw indicator line
rectPaint.setColor(indicatorColor);

// default: line below current tab
View currentTab = tabsContainer.getChildAt(currentPosition);
float lineLeft = currentTab.getLeft();
float lineRight = currentTab.getRight();

// if there is an offset, start interpolating left and right coordinates between current and next tab
if (currentPositionOffset > 0f && currentPosition < tabCount - 1) {

View nextTab = tabsContainer.getChildAt(currentPosition + 1);
final float nextTabLeft = nextTab.getLeft();
final float nextTabRight = nextTab.getRight();

lineLeft = (currentPositionOffset * nextTabLeft + (1f - currentPositionOffset) * lineLeft);
lineRight = (currentPositionOffset * nextTabRight + (1f - currentPositionOffset) * lineRight);
}

if (maxLineWidth != 0 && lineRight - lineLeft > maxLineWidth) {

canvas.drawRect(lineLeft + (lineRight - lineLeft - maxLineWidth) / 2, height - indicatorHeight, lineRight - (lineRight - lineLeft - maxLineWidth) / 2, height - underlineMarginTop, rectPaint);

} else {

canvas.drawRect(lineLeft, height - indicatorHeight, lineRight - underlineMarginTop, height, rectPaint);
}

// draw divider

dividerPaint.setColor(dividerColor);
for (int i = 0; i < tabCount - 1; i++) {
View tab = tabsContainer.getChildAt(i);
canvas.drawLine(tab.getRight(), dividerPadding, tab.getRight(), height - dividerPadding, dividerPaint);
}
}

private class PageListener implements OnPageChangeListener {

@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
currentPosition = position;
currentPositionOffset = positionOffset;

scrollToChild(position, (int) (positionOffset * tabsContainer.getChildAt(position).getWidth()));

invalidate();

if (delegatePageListener != null) {
delegatePageListener.onPageScrolled(position, positionOffset, positionOffsetPixels);
}
}

@Override
public void onPageScrollStateChanged(int state) {
if (state == ViewPager.SCROLL_STATE_IDLE) {
scrollToChild(pager.getCurrentItem(), 0);
}

if (delegatePageListener != null) {
delegatePageListener.onPageScrollStateChanged(state);
}
}

@Override
public void onPageSelected(int position) {
selectedPosition = position;
updateTabStyles();
if (delegatePageListener != null) {
delegatePageListener.onPageSelected(position);
}
}

}

public void setIndicatorColor(int indicatorColor) {
this.indicatorColor = indicatorColor;
invalidate();
}

public void setIndicatorColorResource(int resId) {
this.indicatorColor = getResources().getColor(resId);
invalidate();
}

public int getIndicatorColor() {
return this.indicatorColor;
}

public void setIndicatorHeight(int indicatorLineHeightPx) {
this.indicatorHeight = indicatorLineHeightPx;
invalidate();
}

public int getIndicatorHeight() {
return indicatorHeight;
}

public void setUnderlineColor(int underlineColor) {
this.underlineColor = underlineColor;
invalidate();
}

public void setUnderlineColorResource(int resId) {
this.underlineColor = getResources().getColor(resId);
invalidate();
}

public int getUnderlineColor() {
return underlineColor;
}

public void setDividerColor(int dividerColor) {
this.dividerColor = dividerColor;
invalidate();
}

public void setDividerColorResource(int resId) {
this.dividerColor = getResources().getColor(resId);
invalidate();
}

public int getDividerColor() {
return dividerColor;
}

public void setUnderlineHeight(int underlineHeightPx) {
this.underlineHeight = underlineHeightPx;
invalidate();
}

public int getUnderlineHeight() {
return underlineHeight;
}

public void setDividerPadding(int dividerPaddingPx) {
this.dividerPadding = dividerPaddingPx;
invalidate();
}

public int getDividerPadding() {
return dividerPadding;
}

public void setScrollOffset(int scrollOffsetPx) {
this.scrollOffset = scrollOffsetPx;
invalidate();
}

public int getScrollOffset() {
return scrollOffset;
}

public void setShouldExpand(boolean shouldExpand) {
this.shouldExpand = shouldExpand;
notifyDataSetChanged();
}

public boolean getShouldExpand() {
return shouldExpand;
}

public boolean isTextAllCaps() {
return textAllCaps;
}

public void setAllCaps(boolean textAllCaps) {
this.textAllCaps = textAllCaps;
}

public void setTextSize(int textSizePx) {
this.tabTextSize = textSizePx;
updateTabStyles();
}

public int getTextSize() {
return tabTextSize;
}

public void setTextColor(int textColor) {
this.tabTextColor = textColor;
updateTabStyles();
}

public void setTextColorResource(int resId) {
this.tabTextColor = getResources().getColor(resId);
updateTabStyles();
}

public int getTextColor() {
return tabTextColor;
}

public void setSelectedTextColor(int textColor) {
this.selectedTabTextColor = textColor;
updateTabStyles();
}

public void setSelectedTextColorResource(int resId) {
this.selectedTabTextColor = getResources().getColor(resId);
updateTabStyles();
}

public int getSelectedTextColor() {
return selectedTabTextColor;
}

public void setTypeface(Typeface typeface, int style) {
this.tabTypeface = typeface;
this.tabTypefaceStyle = style;
updateTabStyles();
}

public void setTabBackground(int resId) {
this.tabBackgroundResId = resId;
updateTabStyles();
}

public int getTabBackground() {
return tabBackgroundResId;
}

public void setTabPaddingLeftRight(int paddingPx) {
this.tabPadding = paddingPx;
updateTabStyles();
}

public int getTabPaddingLeftRight() {
return tabPadding;
}

@Override
public void onRestoreInstanceState(Parcelable state) {
SavedState savedState = (SavedState) state;
super.onRestoreInstanceState(savedState.getSuperState());
currentPosition = savedState.currentPosition;
requestLayout();
}

@Override
public Parcelable onSaveInstanceState() {
Parcelable superState = super.onSaveInstanceState();
SavedState savedState = new SavedState(superState);
savedState.currentPosition = currentPosition;
return savedState;
}

static class SavedState extends BaseSavedState {
int currentPosition;

public SavedState(Parcelable superState) {
super(superState);
}

private SavedState(Parcel in) {
super(in);
currentPosition = in.readInt();
}

@Override
public void writeToParcel(Parcel dest, int flags) {
super.writeToParcel(dest, flags);
dest.writeInt(currentPosition);
}

public static final Creator<SavedState> CREATOR = new Creator<SavedState>() {
@Override
public SavedState createFromParcel(Parcel in) {
return new SavedState(in);
}

@Override
public SavedState[] newArray(int size) {
return new SavedState[size];
}
};
}

}

Drawable

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" android:exitFadeDuration="@android:integer/config_shortAnimTime"><item android:state_pressed="true" android:drawable="@color/background_tab_pressed" /><item android:state_focused="true" android:drawable="@color/background_tab_pressed"/><item android:drawable="@android:color/transparent"/></selector>

</pre><pre name="code" class="java">

Values属性

<?xml version="1.0" encoding="utf-8"?><resources><!-- From: file:/C:/Users/Andreas/workspace/PagerSlidingTabStrip/library/res/values/colors.xml --><eat-comment /><color name="background_tab_pressed">#6633B5E5</color><!-- From: file:/C:/Users/Andreas/workspace/PagerSlidingTabStrip/library/res/values/attrs.xml --><eat-comment /><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="selectedTabTextColor" format="color" /><attr name="pstsMaxLineWidth" format="dimension" /><attr name="tabTextSize" format="dimension" /><attr name="underlineMarginTop" format="dimension" /></declare-styleable></resources>

</pre><pre name="code" class="java">

布局

<test.wf.myrxjavaandretrofit.View.PagerSlidingTabStripandroid:id="@+id/indicator"android:layout_width="match_parent"android:layout_height="48dp"android:textColor="#646464"app:pstsDividerColor="@android:color/transparent"app:pstsIndicatorColor="@color/colorAppBasic"app:pstsIndicatorHeight="3dp"app:pstsShouldExpand="true"app:pstsTabBackground="@android:color/transparent"app:pstsUnderlineColor="@color/colorDivider"app:pstsUnderlineHeight="0.5dp"app:selectedTabTextColor="@color/colorAppBasic"/><android.support.v4.view.ViewPagerandroid:id="@+id/viewPager"android:layout_width="match_parent"android:layout_height="match_parent" />

MainActivity

public class MainActivity extends BaseActivity {@Bind(R.id.indicator)protected PagerSlidingTabStrip mSlidingTabStrip;@Bind(R.id.viewPager)protected ViewPager mViewPager;private String[] indicators = {"Fragment0" , "Fragment1" , "Fragment2" , "Fragment3"};private List<Fragment> mFragmentList = new ArrayList<>();private MyAdapter mAdapter;@Overrideprotected int setLayoutId() {return R.layout.activity_main;}@Overrideprotected void initView() {mViewPager.setOffscreenPageLimit(2);}@Overrideprotected void initData() {mFragmentList.add(new Fragment0());mFragmentList.add(new Fragment1());mFragmentList.add(new Fragment2());mFragmentList.add(new Fragment3());mAdapter = new MyAdapter(getSupportFragmentManager(), mFragmentList , indicators);mViewPager.setAdapter(mAdapter);mSlidingTabStrip.setViewPager(mViewPager);}}

BaseActivity

public abstract class BaseActivity extends FragmentActivity {public static String TAG = "BaseActivity";protected Context mContext;protected MyApplication mApplication;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);mContext = this;mApplication = MyApplication.getApplication();TAG = this.getClass().getSimpleName();this.setContentView(this.setLayoutId());ButterKnife.bind(this);initView();initData();}protected abstract int setLayoutId();protected abstract void initView();protected abstract void initData();@Overrideprotected void onDestroy() {super.onDestroy();ButterKnife.unbind(this);}}

Adapter

public class MyAdapter extends FragmentPagerAdapter {private String[] indicators;private List<Fragment> fragments;public MyAdapter(FragmentManager fm , List<Fragment> fragments , String[] indicators) {super(fm);this.fragments = fragments;this.indicators = indicators;}@Overridepublic Fragment getItem(int position) {return fragments.get(position);}@Overridepublic int getCount() {return fragments.size();}@Overridepublic CharSequence getPageTitle(int position) {return indicators[position];}}