本文实例为大家分享了Android ViewPager指示器的制作方法，供大家参考，具体内容如下

1.概述

ViewPageIndicator这个开源框架大家都接触过，个人感觉还不错就是用起来比较麻烦，需要这里配置那里配置效果定制起来也不方便。我第一次使用的时候就一直出不来效果，后来找了很久发现是activity的主题没有配置好。今天我们自己来造个轮子实现一把，其中用到了Adapter模式，如果不清楚这个模式的请看我的Android源码设计模式分析：//www.jb51.net/article/96291.htm，下面看一下效果：

2．实现

1)．实现基本效果自定义HorizontalScrollView extends HorizontalScrollView，设置ViewPager根据个数不断遍历添加子View。

public class ViewPagerIndicator extends HorizontalScrollView{

public ViewPagerIndicator(Context context) {

this(context, null);

}

public ViewPagerIndicator(Context context, AttributeSet attrs) {

this(context, attrs, 0);

}

public ViewPagerIndicator(Context context, AttributeSet attrs,

int defStyleAttr) {

super(context, attrs, defStyleAttr);

this.mContext = context;

}

@Override

public void setViewPager(ViewPager viewPager) {

if (viewPager == null) {

throw new NullPointerException("viewPager is null...");

}

this.mViewPager = viewPager;

int count = mViewPager.getAdapter().getCount();

mContanierGroup.removeAllViews();

// 循环添加tabView(TextView)

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

final TextView itemTv = new TextView(mContext);

itemTv.setText(this.mViewPager.getAdapter().getPageTitle(i));

setItemClickEvent(itemTv, i);

mContanierGroup.addTabView(itemTv);

setItemClickEvent(itemTv, i);

mContanierGroup.addTabView(itemTv);

}

setItemParams();

mAdapter.highLightTabView(mContanierGroup.getTabView(mCureentItem));

this.mViewPager.setOnPageChangeListener(this);

}

private void setItemParams() {

if (mVisibleTabCount != 0) {

final int childCount = mViewPager.getAdapter().getCount();

mRunnable = new Runnable() {

@Override

public void run() {

int tabWidth = getWidth() / mVisibleTabCount;

// 循环遍历设置Tab宽度

for (int index = 0; index < childCount; index++) {

LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) mContanierGroup

.getTabView(index).getLayoutParams();

params.width = tabWidth;

}

// 设置宽度，高度，和角标指示器

mContanierGroup.setTabWidth(tabWidth);

mContanierGroup.getContainer().getLayoutParams().height = getHeight();

mContanierGroup.setIndicatorView(mAdapter.getIndexView());

mRunnable = null;

}

};

post(mRunnable);

}

}

}

2).设置ViewPager的滚动监听，使ViewPager和TabView一起联动

@Override

public void onPageScrollStateChanged(int position) {

if (position == 0) {

// 设置为不是点击

mIsClick = false;

}

if (mPageChangeListener != null)

mPageChangeListener.onPageScrollStateChanged(position);

}

@Override

public void onPageScrolled(int position, float offset, int arg2) {

scroll(position, offset);

if (mPageChangeListener != null)

mPageChangeListener.onPageScrolled(position, offset, arg2);

}

@Override

public void onPageSelected(int position) {

mCureentItem = position;

if (mPageChangeListener != null)

mPageChangeListener.onPageSelected(position);

}

/**

* 指示器跟随手指进行滚动

*/

public void scroll(int position, float offset) {

int tabWidth = mContanierGroup.getTabView(0).getWidth();

// 让选中Tab的一直在最中间

int total = (int) ((position + offset) * tabWidth);

int green = (getWidth() - tabWidth) / 2;

// 滚动的距离

int scroll = total - green;

if (!mIsClick) {

this.scrollTo(scroll, 0);

mContanierGroup.scrollIndicator(position, offset);

}

}

3).最后我们采用适配器Adapter模式，完成高亮和下标指示器。

public abstract class IndicatorAdapter {

/**

* 获取Tab View

*/

public abstract T getTabView(int position);

/**

* 获取角标View

*/

public View getIndexView() {

return null;

}

/**

* 高亮当前Tab

*/

public void highLightTabView(T tabView) {

}

/**

* 恢复当前Tab

*/

public void restoreTabView(T tabView) {

}

}

4).最后我们来看在activity中怎么使用，在IndicatorAdapter有四个方法，我们只需要实现一个方法，其余三个方法如果不使用可以不复写。以Adapter的形式暴露出来，那么用户可以自己去实现而不必受局限。

mIndicator.setAdapter(mViewpager, new IndicatorAdapter() {

@Override

public TextView getTabView(int position) {

TextView tabView = new TextView(getBaseContext());

tabView.setTextColor(Color.WHITE);

tabView.setText(mTitles.get(position));

tabView.setPadding(20, 20, 20, 20);

tabView.setGravity(Gravity.CENTER);

return tabView;

}

@Override

public View getIndexView() {

ImageView view = new ImageView(getBaseContext());

view.setImageResource(R.drawable.corners_login_nomral);

view.setPadding(25, 0, 25, 0);

RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(

LayoutParams.WRAP_CONTENT, 6);

view.setLayoutParams(params);

return view;

}

@Override

public void highLightTabView(TextView tabView) {

final TextView itemView = (TextView) tabView;

itemView.setTextColor(Color.RED);

}

@Override

public void restoreTabView(TextView tabView) {

final TextView itemView = (TextView) tabView;

itemView.setTextColor(Color.WHITE);

}

});

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。