欢迎页导航页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);
//               }}}}

Android技术生活交流

微信 ----- qq群


这篇关于欢迎页导航页SplashActivity-条形进度条指示器-页面布局系列的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/238939

相关文章

Android WebView无法加载H5页面的常见问题和解决方法

《AndroidWebView无法加载H5页面的常见问题和解决方法》AndroidWebView是一种视图组件,使得Android应用能够显示网页内容,它基于Chromium,具备现代浏览器的许多功... 目录1. WebView 简介2. 常见问题3. 网络权限设置4. 启用 JavaScript5. D

Flutter监听当前页面可见与隐藏状态的代码详解

《Flutter监听当前页面可见与隐藏状态的代码详解》文章介绍了如何在Flutter中使用路由观察者来监听应用进入前台或后台状态以及页面的显示和隐藏,并通过代码示例讲解的非常详细,需要的朋友可以参考下... flutter 可以监听 app 进入前台还是后台状态,也可以监听当http://www.cppcn

MySQL表锁、页面锁和行锁的作用及其优缺点对比分析

《MySQL表锁、页面锁和行锁的作用及其优缺点对比分析》MySQL中的表锁、页面锁和行锁各有特点,适用于不同的场景,表锁锁定整个表,适用于批量操作和MyISAM存储引擎,页面锁锁定数据页,适用于旧版本... 目录1. 表锁(Table Lock)2. 页面锁(Page Lock)3. 行锁(Row Lock

CSS3 最强二维布局系统之Grid 网格布局

《CSS3最强二维布局系统之Grid网格布局》CS3的Grid网格布局是目前最强的二维布局系统,可以同时对列和行进行处理,将网页划分成一个个网格,可以任意组合不同的网格,做出各种各样的布局,本文介... 深入学习 css3 目前最强大的布局系统 Grid 网格布局Grid 网格布局的基本认识Grid 网

禁止HTML页面滚动的操作方法

《禁止HTML页面滚动的操作方法》:本文主要介绍了三种禁止HTML页面滚动的方法:通过CSS的overflow属性、使用JavaScript的滚动事件监听器以及使用CSS的position:fixed属性,每种方法都有其适用场景和优缺点,详细内容请阅读本文,希望能对你有所帮助... 在前端开发中,禁止htm

CSS弹性布局常用设置方式

《CSS弹性布局常用设置方式》文章总结了CSS布局与样式的常用属性和技巧,包括视口单位、弹性盒子布局、浮动元素、背景和边框样式、文本和阴影效果、溢出隐藏、定位以及背景渐变等,通过这些技巧,可以实现复杂... 一、单位元素vm 1vm 为视口的1%vh 视口高的1%vmin 参照长边vmax 参照长边re

CSS3中使用flex和grid实现等高元素布局的示例代码

《CSS3中使用flex和grid实现等高元素布局的示例代码》:本文主要介绍了使用CSS3中的Flexbox和Grid布局实现等高元素布局的方法,通过简单的两列实现、每行放置3列以及全部代码的展示,展示了这两种布局方式的实现细节和效果,详细内容请阅读本文,希望能对你有所帮助... 过往的实现方法是使用浮动加

Python中实现进度条的多种方法总结

《Python中实现进度条的多种方法总结》在Python编程中,进度条是一个非常有用的功能,它能让用户直观地了解任务的进度,提升用户体验,本文将介绍几种在Python中实现进度条的常用方法,并通过代码... 目录一、简单的打印方式二、使用tqdm库三、使用alive-progress库四、使用progres

使用JavaScript将PDF页面中的标注扁平化的操作指南

《使用JavaScript将PDF页面中的标注扁平化的操作指南》扁平化(flatten)操作可以将标注作为矢量图形包含在PDF页面的内容中,使其不可编辑,DynamsoftDocumentViewer... 目录使用Dynamsoft Document Viewer打开一个PDF文件并启用标注添加功能扁平化

SpringBoot如何访问jsp页面

《SpringBoot如何访问jsp页面》本文介绍了如何在SpringBoot项目中进行Web开发,包括创建项目、配置文件、添加依赖、控制层修改、测试效果以及在IDEA中进行配置的详细步骤... 目录SpringBoot如何访问JSP页python面简介实现步骤1. 首先创建的项目一定要是web项目2. 在