Android实现长按圆环动画View效果的思路代码
一、需求来源
最近想到一个需求，类似悦跑圈或者Keep的结束按钮动画
二、思路代码
该动画按钮的主要作用就是防止用户误操作，具体实现思路如下：
1、监听用户的触摸事件OnTouchListener，在ACTION_DOWN的时候，记录下xy坐标和触摸时间，同时start自定义View动画；在ACTION_MOVE的过程中，判断坐标差值的偏移量是否在一个可接受的范围内，是的话就保留当前动画，不是的话就清除按钮上绘制的path；在ACTION_UP的时候，再次记录下触摸时间，比较两个时间是否达到了长按规定的时间，是的话就执行下一个事件，不是的话就停止动画重置Path。
valtouchMax=50
varlastX=0
varlastY=0
circleView.setOnTouchListener(object:View.OnTouchListener{
overridefunonTouch(p0:View?,motionEvent:MotionEvent):Boolean{
valendTime:Long
valx=motionEvent.x
valy=motionEvent.y
when(motionEvent.action){
MotionEvent.ACTION_DOWN->{
startTime=System.currentTimeMillis()
lastX=x.toInt()
lastY=y.toInt()
circleView.startAnim()
}
MotionEvent.ACTION_UP->{
endTime=System.currentTimeMillis()
valduring=endTime-startTime
if(during{
if(abs(lastX-x)>touchMax||abs(lastY-y)>touchMax){
circleView.clearAll()
}
}
}
returnfalse
}
})
2、就是在自定义View里arcTo画一个圆，再使用属性动画来监听动画的播放即可
funstartAnim(){
isClear=false
valueAnimator=ValueAnimator.ofFloat(0F,359.9999F)
valueAnimator!!.duration=App.LONG_CLICK_TIME
valueAnimator!!.addUpdateListener{animation->
mProgress=animation.animatedValueasFloat
invalidate()
}
valueAnimator!!.start()
}
三、效果展示
最终实现效果图虽然没有上面那么好看，但基本效果还是达到了
四、全部代码
packagecn.xmliu.melongo.view
importandroid.animation.ValueAnimator
importandroid.content.Context
importandroid.graphics.*
importandroid.util.AttributeSet
importandroid.view.View
importandroidx.core.content.ContextCompat
importcn.xmliu.melongo.App
importcn.xmliu.melongo.R
/**
*Date:2020/8/1213:21
*Email:diyangxia@163.com
*Description:长按动画View
*/
classLongCircleView(context:Context?,attrs:AttributeSet?):View(context,attrs){
/**
*画笔
*/
privatevalpaint=Paint()
privatevararcPath:Path?=null
privatevarrectF:RectF?=null
privatevarlineColor=0
/**
*中心点坐标、半径
*/
privatevarcenterX:Float?=null
privatevarcenterY:Float?=null
privatevarradius:Float?=null
privatevarleft=-1F
privatevartop=-1F
privatevarright=-1F
privatevarbottom=-1F
privatevaloffset=10
privatevarmProgress=-1F
privatevarvalueAnimator:ValueAnimator?=null
privatevarisClear=true
init{
lineColor=ContextCompat.getColor(context!!,R.color.red)
}
overridefunonSizeChanged(w:Int,h:Int,oldw:Int,oldh:Int){
super.onSizeChanged(w,h,oldw,oldh)
centerX=width/2.toFloat()
centerY=height/2.toFloat()
radius=height/2.toFloat()
left=centerX!!-radius!!+offset
top=centerY!!-radius!!+offset
right=centerX!!+radius!!-offset
bottom=centerY!!+radius!!-offset
rectF=RectF(left,top,right,bottom)
arcPath=Path()
}
overridefunonDraw(canvas:Canvas?){
super.onDraw(canvas)
paint.isAntiAlias=true
paint.color=lineColor
paint.style=Paint.Style.STROKE
paint.strokeWidth=10F
arcPath!!.rewind()//清除直线数据，保留数据结构，方便快速重用
if(isClear)return
arcPath!!.arcTo(rectF!!,270F,mProgress)
canvas?.drawPath(arcPath!!,paint)
}
funstartAnim(){
isClear=false
valueAnimator=ValueAnimator.ofFloat(0F,359.9999F)
valueAnimator!!.duration=App.LONG_CLICK_TIME
valueAnimator!!.addUpdateListener{animation->
mProgress=animation.animatedValueasFloat
invalidate()
}
valueAnimator!!.start()
}
funcancelAnim(){
valueAnimator!!.cancel()
}
funclearAll(){
isClear=true
invalidate()
}
}
valtouchMax=50
varlastX=0
varlastY=0
circleView.setOnTouchListener(object:View.OnTouchListener{
overridefunonTouch(p0:View?,motionEvent:MotionEvent):Boolean{
valendTime:Long
valx=motionEvent.x
valy=motionEvent.y
when(motionEvent.action){
MotionEvent.ACTION_DOWN->{
startTime=System.currentTimeMillis()
lastX=x.toInt()
lastY=y.toInt()
circleView.startAnim()
}
MotionEvent.ACTION_UP->{
endTime=System.currentTimeMillis()
valduring=endTime-startTime
if(during{
if(abs(lastX-x)>touchMax||abs(lastY-y)>touchMax){
circleView.clearAll()
}
}
}
returnfalse
}
})
总结
到此这篇关于Android实现长按圆环动画View效果的文章就介绍到这了,更多相关android长按圆环动画内容请搜索毛票票以前的文章或继续浏览下面的相关文章希望大家以后多多支持毛票票！
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。