一种水滴下拉刷新实现方法与流程

本发明涉及下拉刷新交互设计技术领域，具体说是一种水滴下拉刷新实现方法。

背景技术：

在android系统中提供了下拉刷新的控件swiperefreshlayout，当下拉到了一定的高度就会进行刷新，下拉高度不够就会回收上去，在刷新过程中，下拉操作没有反应，即刷新时需要屏蔽掉下拉事件。

控件swiperefreshlayout主要应用在竖直滑动时想要刷新页面，它通过设置onrefreshlistener来监听界面的滑动从而实现刷新。当然，也可以通过一些方法来设置swiperefreshlayout是否可以刷新。例如：

设置setrefreshing(true)，则展开刷新动画。

设置setrefreshing(false)，则取消刷新动画。

设置setenable(true)下拉刷新将不可用。

控件swiperefreshlayout在使用时，需要注意：使用这个布局要想达到刷新的目的，需要在这个布局里包裹可以滑动的子控件，如listview等，并且只能有一个子控件。

综上，使用swiperefreshlayout可以实现下拉刷新，前提是布局里需要包裹一个可以滑动的子控件，然后在代码里设置onrefreshlistener设置监听，最后在监听里设置刷新时的数据获取就可以了。

控件swiperefreshlayout目前的不足在于：

第一，动画单一，可定制性不高；

第二，不能实现下拉波浪水滴刷新效果。

根据研发需求，拟实现下拉波浪水滴刷新效果，丰富下拉刷新的交互效果，提升用户体验。

在酷我音乐盒的推荐功能中，其首页目前采用线条刷新动画，这一交互动画非常常见，缺乏个性化，现考虑对其进行优化，实现下拉波浪水滴刷新效果。

技术实现要素：

针对现有技术中存在的缺陷，本发明的目的在于提供一种水滴下拉刷新实现方法，实现下拉波浪水滴刷新效果，算法可扩展性好，支持设置波纹和水滴的颜色、动画时间等特效，增加用户体验效果。

为达到以上目的，本发明采取的技术方案是：

一种水滴下拉刷新实现方法，其特征在于，包括如下步骤：

定义并实现类waveview，继承android系统提供的view控件，用来绘制波浪及水滴相关特效，

定义并实现类materialprogressdrawable，继承android系统提供的drawable类，用来设置一个material风格的圆形滚动条样式，用于设置刷新过程中的圆形滚动动画效果，

定义并实现类animationimageview，继承android系统提供的图片展示控件imageview，用来设置动画的监听操作，

定义并实现类progressanimationimageview，继承自定义类animationimageview，用来提供旋转动画的自定义控件，

定义并实现类waveswiperefreshlayout，继承android系统提供的视图容器viewgroup，用来放置可滑动的列表视图、带箭头的圆圈刷新视图和水滴波浪视图，用来处理相关触摸事件，对事件进行拦截和分发，用来刷新动画状态的设置、刷新接口的回调。

在上述技术方案的基础上，在类waveview中，具体包括：

绘制波浪相关属性，包括：

变量mwavepath，是android系统提供的path类型的变量，用来保存上部波浪特效的路径，

绘制水滴相关属性，包括：

变量mdropcircleradius，是android系统提供的浮点数据类型的变量，用来定义水滴圆的半径，

变量mdroptangentpath，是android系统提供的path类型的变量，用来保存水滴上面的三角形的路径，

变量mdropcirclepath，是android系统提供的path类型的变量，用来保存水滴下面的圆的路径，

变量mdroprect，是android系统提供的rect类型的变量，用来保存水滴底部长方形的坐标信息，用来绘制椭圆，

绘制操作相关属性，包括：

变量mpaint，是android系统提供的画笔paint类型的变量，用来绘制波浪及水滴图像，

常量drop_circle_animator_duration，是android系统提供的长整形long类型的常量，用来设置动画执行的时间，默认值为500毫秒，

重写波浪视图中的ondraw方法，用来绘制波浪图像，水滴状图像，

定义beginphase方法用来计算下拉时的波浪曲线，appearphase方法用来计算制波浪下拉到一定距离形成水滴的状态曲线，expandphase方法用来计算继续下拉水滴下落时的曲线，

定义方法startdropanimation，用来控制水滴下落时的动画效果。

在上述技术方案的基础上，在类materialprogressdrawable中，具体包括：

内部类ring是android系统提供的object类型的对象，用来绘制带箭头的圆形样式，

常量arrow_width是android系统提供的整型类型的常量，用来设置箭头的宽度，

常量arrow_height是android系统提供的整型类型的常量，用来设置箭头的高度，

常量arrow_offset_angle是android系统提供的整型类型的常量，用来设置箭头的角度，

变量mresources是android系统提供的resources资源类型的变量，用来获取显示器的逻辑密度，

变量manimation是android系统提供的animation动画类型的变量，用来执行圆形的旋转动画，

变量mrotationcount是android系统提供的浮点数据类型的变量，用来设置旋转动画执行的次数，

变量mwidth和mheight，都是android系统提供的双精度double类型的变量，用来设置圆的大小，

变量mrotation，是android系统提供的浮点数据类型的变量，用来记录带箭头圆旋转的角度信息，

定义方法draw，用来绘制旋转圆的动画效果。

在上述技术方案的基础上，在类progressanimationimageview中，具体包括：

变量mprogress，是自定义materialprogressdrawable类型的变量，用来提供imageview设置的drawable，给控件添加带箭头圆的旋转动画效果。

在上述技术方案的基础上，在类waveswiperefreshlayout中，具体包括：

接口onrefreshlistener和其中的抽象方法onrefresh，用来对刷新中的状态回调，

枚举类型state，里面有两个状态分别是refreshing和pending，用来表示正在刷新中和准备刷新，

枚举类型event_phase，里面有5中状态分别是waiting等待中、beginning出现波浪、appearing形成水滴、expanding水滴下沉、dropping水滴下落，

变量mstate是state枚举类型的变量，初始状态设置为state.pending，用来标记刷新的状态，

变量meventphase是event_phase枚举类型的变量，初始值设置为event_phase.waiting，用来标记下拉波浪水滴不同位置的状态，

变量mtarget是android系统提供的view类型的变量，用来获取可以滑动的列表控件，

变量mcircleview是自定义圆形旋转progressanimationimageview类型的控件，

变量mwaveview是自定义波浪水滴waveview类型的控件，用来提供波浪水滴等动画特效，

定义方法createprogressview和createwaveview，用来初始化圆圈和水滴波浪视图并添加到容器中，

变量misbeingdropped，是android系统提供的布尔数据类型的变量，用来标记是否开始下落，

定义方法onmovetouchevent，用来进行滑动事件监听和相关计算状态的变化动画的展示。

本发明所述的水滴下拉刷新实现方法，实现下拉波浪水滴刷新效果，算法可扩展性好，支持设置波纹和水滴的颜色、动画时间等特效，增加用户体验效果。

本发明所述的水滴下拉刷新实现方法，如图2所示，下拉顶部出现波浪形成水滴并下落刷新效果。采用自己实现的组件，只需自定义波浪水滴控件提供波浪图形和水滴的绘制，自定义图片视图imageview提供下拉刷新的旋转圆效果，再自定义容器控件把水滴、旋转圆和数据列表控件添加到里面，对其中的事件进行监听分发处理，就实现水滴下拉刷新效果。

本发明所述的水滴下拉刷新实现方法，可应用于音乐盒推荐首页，使用波纹下拉效果后，用户下拉水滴下落，等待服务器返回数据，数据刷新后水滴效果，用户体验良好，完全可以代替现在的线条刷新动画。

附图说明

本发明有如下附图：

图1本发明的流程图。

图2水滴下拉刷新效果示意图。

具体实施方式

以下结合附图对本发明作进一步详细说明。

如图1、2所示，本发明所述的水滴下拉刷新实现方法，包括如下步骤：

定义并实现类waveview，继承android系统提供的view控件，用来绘制波浪及水滴相关特效，

定义并实现类materialprogressdrawable，继承android系统提供的drawable类，用来设置一个material风格的圆形滚动条样式，用于设置刷新过程中的圆形滚动动画效果，

定义并实现类animationimageview，继承android系统提供的图片展示控件imageview，用来设置动画的监听操作，

定义并实现类progressanimationimageview，继承自定义类animationimageview，用来提供旋转动画的自定义控件，

定义并实现类waveswiperefreshlayout，继承android系统提供的视图容器viewgroup，用来放置可滑动的列表视图、带箭头的圆圈刷新视图和水滴波浪视图，用来处理相关触摸事件，对事件进行拦截和分发，用来刷新动画状态的设置、刷新接口的回调。

在上述技术方案的基础上，在类waveview中，具体包括：

绘制波浪相关属性，包括：

变量mwavepath，是android系统提供的path类型的变量，用来保存上部波浪特效的路径，

绘制水滴相关属性，包括：

变量mdropcircleradius，是android系统提供的浮点数据类型的变量，用来定义水滴圆的半径，

变量mdroptangentpath，是android系统提供的path类型的变量，用来保存水滴上面的三角形的路径，

变量mdropcirclepath，是android系统提供的path类型的变量，用来保存水滴下面的圆的路径，

变量mdroprect，是android系统提供的rect类型的变量，用来保存水滴底部长方形的坐标信息，用来绘制椭圆，

绘制操作相关属性，包括：

变量mpaint，是android系统提供的画笔paint类型的变量，用来绘制波浪及水滴图像，

常量drop_circle_animator_duration，是android系统提供的长整形long类型的常量，用来设置动画执行的时间，默认值为500毫秒，

重写波浪视图中的ondraw方法，用来绘制波浪图像，水滴状图像，

定义beginphase方法用来计算下拉时的波浪曲线，appearphase方法用来计算制波浪下拉到一定距离形成水滴的状态曲线，expandphase方法用来计算继续下拉水滴下落时的曲线，

定义方法startdropanimation，用来控制水滴下落时的动画效果。

例如：波浪视图中的ondraw方法可采用如下代码：

privatevoidondraw(canvascanvas){

canvas.drawpath(mwavepath，mpaint);

mdroptangentpath.moveto(circlecenterx，vertex);

mdroptangentpath.lineto((float)p1，(float)q);

mdroptangentpath.lineto((float)p2，(float)q);

mdroptangentpath.close();

mdropcirclepath.addoval(mdroprect，path.direction.ccw);

绘制圆圈落在的部

canvas.drawpath(mdroptangentpath，mpaint);

canvas.drawpath(mdropcirclepath，mpaint);//绘制椭圆

}。

其中：

canvas是android系统提供的画布用来进行图像的绘制，drawpath是其中的方法用来对path路径进行绘制，这里用来根据mwavepath绘制下拉波浪状图形。

mdroptangentpath是android系统体用的path类型的变量这里用来保存水滴上面三角形，moveto是其中的方法，用来定位路径的起始坐标点，lineto也是其中的方法用与从当前轮廓点绘制一条线段到指定坐标点，close也是path类中的方法，用于回到初始轮廓点形成封闭的曲线。

例如：beginphase方法、appearphase方法、expandphase方法可采用如下代码：

publicvoidbeginphase(floatmove1){

mwavepath.moveto(0，0);

mwavepath.cubicto();

viewcompat.postinvalidateonanimation(this);}

publicvoidappearphase(floatmove1，floatmove2){

mwavepath.moveto(0，0);

mwavepath.cubicto()｝

publicvoidexpandphase(floatmove1，floatmove2，floatmove3){

mwavepath.moveto(0，0);

mwavepath.cubicto()}。

其中：

beginphase方法中的move1是android系统提供的浮点类型的数据，保存用户下拉的距离和控件的高度的比例，来确定波浪线下拉的幅度。

appearphase方法中的move1和move2变量用来控制波浪型下拉的角度幅度和水滴形成的状态位置信息。

mwavepath用来存储波浪线曲线，moveto是其中的方法用来指定初始轮廓点，cubicto是用来绘制贝塞尔曲线，viewcompat是android系统提供的视图相关操作的工具类，postinvalidateonanimation是其中的方法用来通知view控件进行视图刷新重绘。

例如：方法startdropanimation可采用如下代码：

publicvoidstartdropanimation(){

mdropcircleanimator=valueanimator.offloat(500*(mwidth/1440.f)，mmaxdropheight);

mdropcircleanimator.setduration(drop_circle_animator_duration);

mdropcircleanimator.addupdatelistener(newvalueanimator.animatorupdatelistener(){

publicvoidonanimationupdate(valueanimatoranimation){

mcurrentcirclecentery=(float)animation.getanimatedvalue();

viewcompat.postinvalidateonanimation(waveview.this);}});

mdropcircleanimator.setinterpolator(newacceleratedecelerateinterpolator());

mdropcircleanimator.start();}。

其中：

变量mdropcircleanimator是android系统提供的valueanimator属性动画类型的变量，offloat是其中的方法用来进行数值的发生变化，用来控制水滴下落过程的高度位置信息，setduration是valueanimator属性动画中的方法，用来设置动画执行的实现信息，drop_circle_animator_duration是android系统提供的长整形类型的常量，addupdatelistener是valueanimator中的方法，用来设置数值变化过程监听。

getanimatedvalue是valueanimator中的方法用来获取变化后的高度数据用来计算当前位置水滴的状态信息，viewcompat是android系统提供的用来针对不同系统版本对view进行操作的工具类，postinvalidateonanimation是其中的方法用来通知视图进行重新绘制刷新工作。

setinterpolator是valueanimator中的方法用来设置插值器，acceleatedecelerateinterpolator是android系统提供的开始和结束慢中间快的动画效果插值器。

start是valueanimator类中的方法用来启动动画。

在上述技术方案的基础上，在类materialprogressdrawable中，具体包括：

内部类ring是android系统提供的object类型的对象，用来绘制带箭头的圆形样式，

常量arrow_width是android系统提供的整型类型的常量，用来设置箭头的宽度，

常量arrow_height是android系统提供的整型类型的常量，用来设置箭头的高度，

常量arrow_offset_angle是android系统提供的整型类型的常量，用来设置箭头的角度，

变量mresources是android系统提供的resources资源类型的变量，用来获取显示器的逻辑密度，

变量manimation是android系统提供的animation动画类型的变量，用来执行圆形的旋转动画，

变量mrotationcount是android系统提供的浮点数据类型的变量，用来设置旋转动画执行的次数，

变量mwidth和mheight，都是android系统提供的双精度double类型的变量，用来设置圆的大小，

变量mrotation，是android系统提供的浮点数据类型的变量，用来记录带箭头圆旋转的角度信息，

定义方法draw，用来绘制旋转圆的动画效果。

例如：方法draw可采用如下代码：

publicvoiddraw(canvasc){

rectbounds=getbounds();

intsavecount=c.save();

c.rotate(mrotation，bounds.exactcenterx()，bounds.exactcentery());

mring.draw(c，bounds);

c.restoretocount(savecount);

}。

其中：

变量c是android系统提供的画布，getbounds方法是android系统提供的drawable类中的方法用来获取边界位置信息，save是canvas类中的方法用来画布的状态，rotate是canvas类中的方法用来对画布进行旋转，mrotation是旋转的角度bounds.exactcenterx()和bounds.exactcentery()用来获取旋转的中心位置坐标。

mring是定义的绘制带箭头圆形的实例draw是其中的方法用来在指定画布和位置绘制圆形，restoretocount是canvas类中的方法用来恢复画布之前保存的状态。

在上述技术方案的基础上，在类progressanimationimageview中，具体包括：

变量mprogress，是自定义materialprogressdrawable类型的变量，用来提供imageview设置的drawable，给控件添加带箭头圆的旋转动画效果。

在上述技术方案的基础上，在类waveswiperefreshlayout中，具体包括：

接口onrefreshlistener和其中的抽象方法onrefresh，用来对刷新中的状态回调，

枚举类型state，里面有两个状态分别是refreshing和pending，用来表示正在刷新中和准备刷新，

枚举类型event_phase，里面有5中状态分别是waiting等待中、beginning出现波浪、appearing形成水滴、expanding水滴下沉、dropping水滴下落，

变量mstate是state枚举类型的变量，初始状态设置为state.pending，用来标记刷新的状态，

变量meventphase是event_phase枚举类型的变量，初始值设置为event_phase.waiting，用来标记下拉波浪水滴不同位置的状态，

变量mtarget是android系统提供的view类型的变量，用来获取可以滑动的列表控件，

变量mcircleview是自定义圆形旋转progressanimationimageview类型的控件，

变量mwaveview是自定义波浪水滴waveview类型的控件，用来提供波浪水滴等动画特效，

定义方法createprogressview和createwaveview，用来初始化圆圈和水滴波浪视图并添加到容器中，

变量misbeingdropped，是android系统提供的布尔数据类型的变量，用来标记是否开始下落，

定义方法onmovetouchevent，用来进行滑动事件监听和相关计算状态的变化动画的展示。

例如：方法createprogressview和createwaveview可采用如下代码：

privatevoidcreateprogressview(){

addview(mcircleview=newprogressanimationimageview(getcontext()));

}

privatevoidcreatewaveview(){

addview(mwaveview=newwaveview(getcontext())，0);

}。

其中：

addview是android系统提供的viewgroup容器中的方法用来向容器中添加子视图，getcontext是其中的方法用来获取上下文来创建视图控件，参数0是传入的索引告诉父控件添加子控制的索引位置。

例如：方法onmovetouchevent可采用如下代码：

privatebooleanonmovetouchevent(@nonnullmotioneventevent，intpointerindex){

if(misbeingdropped){returnfalse;}

mcircleview.showarrow(true);

mcircleview.setprogressrotation(rotation);

mcircleview.settranslationy(mwaveview.getcurrentcirclecentery());

if(firstbounds<vertical_drag_threshold.first.val){

onbeginphase(firstbounds);

}elseif(firstbounds<vertical_drag_threshold.second.val){

onappearphase(firstbounds，secondbounds);

}elseif(firstbounds<vertical_drag_threshold.third.val){

onexpandphase(firstbounds，secondbounds，finalbounds);

}else{ondropphase();}

return!misbeingdropped;

}。

其中：

参数event是android系统提供motionevent类型传递滑动事件，pointerindex是触摸点的索引，misbeingdropped是布尔类型用来判断是否开始下落。

showarrow方法是progressanimationimageview类中的方法用来显示带箭头的圆，setprogressrotation也是progressanimationimageview类中的方法用来设置旋转的角度，settranslationy也是progressanimationimageview中的方法用来设置下落的位置坐标信息，firstbounds用来判断下拉的程度。

onbeginphase方法用来绘制刚开始下拉时的波浪线图形，

onappearphase方法用来绘制形成水滴的过程，

onexpandphase方法用来绘制水滴下沉时的状态，

ondropphase方法用来绘制水滴下落时的动画场景。

本说明书中未作详细描述的内容属于本领域专业技术人员公知的现有技术。