欢迎页导航页SplashActivity-条形进度条指示器-页面布局系列

本文主要是介绍欢迎页导航页SplashActivity-条形进度条指示器-页面布局系列，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

Splash Activity 欢迎页，带条形进度条指示器

完整代码ZIP：下载
更多其他页面-自定义View-实用功能合集：点击查看

带圆点指示器可以浏览这篇文章点击跳转
仿ClassIn的欢迎页可以浏览这篇文章点击跳转

实现步骤：
1.使用ViewPager实现左右翻页layout
2.自定义绘制组件RectanglePointerView，通过监听ViewPager.OnPageChangeListener刷新绘制条形指示器

1.ViewPager.OnPageChangeListener的onPageScrolled可以告诉我们当前的页面滑动状态。position->当前页面位置下坐标，positionOffset->相对于两个页面之间滑动的偏移量 0 ~ 0.99，positionOffsetPixels->滑动相对于屏幕像素偏移量

//监听页面状态class  ViewPagerChangeListener implements ViewPager.OnPageChangeListener {@Overridepublic void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {Log.d("TAG", "onPageScrolled: "+position+" "+positionOffset+" "+positionOffsetPixels);mRectanglePointerView.refreshPointer(position,positionOffset); //刷新条形指示器}@Overridepublic void onPageSelected(int position) {  //翻到最后一页才显示按钮if(position==mArrayList.size()-1){mButton.setVisibility(View.VISIBLE);}else {mButton.setVisibility(View.GONE);}}@Overridepublic void onPageScrollStateChanged(int state) {}}

2.自绘制RectanglePointerView必须传入以下参数

//页面数量，条形width,条形height,选中时drawable,未选中时drawable
public void setPointerStyle(int pageNumber, int dotHeight, int dotWidth, Drawable dotDrawableSelected, Drawable dotDrawableUnSelected)

条形指示器view的总长度 = 设置的条形width x 页面数量(条形数量)
条形指示器view的总高度 = 设置的条形height


/*** 作者：YFZ* Android技术生活-QQ交流群:723592501* 简介：自定义绘制条形指示器，用于翻页* setDotInfor设置圆点信息,页数，长宽，*/
public class RectanglePointerView extends LinearLayout {private Context mContext;private Paint mPaintDotSelected;private Paint mPaintDotUnSelected;private Rect mRect;private int mPageNumber=0;private int mDotWidth=0;private int mDotHeight =0;private int mSelectedPosition=0;private float mSelectedProcess=0;private Drawable mDotDrawableSelected;private Drawable mDotDrawableUnSelected;public RectanglePointerView(Context context) {super(context);initial(context);}public RectanglePointerView(Context context, @Nullable AttributeSet attrs) {super(context, attrs);initial(context);}public RectanglePointerView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initial(context);}//初始化private void initial(Context context){this.mContext=context;this.mRect=new Rect();initial_paint_dot_selected();initial_paint_dot_unSelected();this.setBackgroundColor(Color.TRANSPARENT);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);}//初始化-画笔-圆点-被选中的private void initial_paint_dot_selected(){this.mPaintDotSelected=new Paint(Paint.ANTI_ALIAS_FLAG);this.mPaintDotSelected.setStyle(Paint.Style.FILL);this.mPaintDotSelected.setColor(Color.BLACK);}//初始化-画笔-圆点-未被选中的private void initial_paint_dot_unSelected(){this.mPaintDotUnSelected=new Paint(Paint.ANTI_ALIAS_FLAG);this.mPaintDotUnSelected.setStyle(Paint.Style.STROKE);this.mPaintDotUnSelected.setColor(Color.GRAY);this.mPaintDotUnSelected.setStrokeWidth(3f);}//刷新绘制public void refreshUI(){this.invalidate();}//传入页面数量public void setPageNumber(int pageNumber){}//设置圆点信息-数量-高-宽public void setPointerStyle(int pageNumber, int dotHeight, int dotWidth, Drawable dotDrawableSelected, Drawable dotDrawableUnSelected){mPageNumber = pageNumber; //数量mDotHeight  = dotHeight; //高mDotWidth   = dotWidth; //宽mDotDrawableSelected=dotDrawableSelected;mDotDrawableUnSelected=dotDrawableUnSelected;this.getLayoutParams().height= (int)(mDotHeight);this.getLayoutParams().width = (int)(mDotWidth * pageNumber);}//设置当前选中的页面public void refreshPointer(int position, float process){mSelectedPosition=position+1;mSelectedProcess=process+position+1;refreshUI();}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);if(mPageNumber>0 && mDotWidth>0 && mDotHeight>0) { //必须传入数量,Dot长宽,才开始绘制//先绘制条形总长度，未选中drawable）mRect.left=0;mRect.top=0;mRect.right=getWidth();mRect.bottom=getHeight();mDotDrawableUnSelected.setBounds(mRect);mDotDrawableUnSelected.draw(canvas);//再绘制当前进度长度，选中drawable。进度比例% * 组件总长//进度百分比为：onPageScolled / 总页数 *100//组件总长：getwidth();mRect.left=0;mRect.top=0;mRect.right=(int)((mSelectedProcess/mPageNumber)*(getWidth()));mRect.bottom=getHeight();
//               if(mSelectedPosition==i) {mDotDrawableSelected.setBounds(mRect);mDotDrawableSelected.draw(canvas);
//               }else {
//                   mDotDrawableUnSelected.setBounds(mRect);
//                   mDotDrawableUnSelected.draw(canvas);
//               }}}}