网站栏目类型,适合大型网站的流量套餐,南充市房地产备案查询,手机测评做视频网站一般的刷新动画是一个圈圈在转#xff0c;而头条的比较特殊#xff0c;直接上写好的效果图(一直不知道怎么把图片尺寸调小o(╯□╰)o)吧~刷新动画_.gif首先整个效果是通过SVG和vector来实现的#xff0c;如果不是很了解#xff0c;请看大佬的文章#xff1a;SVG学习--Anim…一般的刷新动画是一个圈圈在转而头条的比较特殊直接上写好的效果图(一直不知道怎么把图片尺寸调小o(╯□╰)o)吧~刷新动画_.gif首先整个效果是通过SVG和vector来实现的如果不是很了解请看大佬的文章SVG学习--AnimatedVectorDrawable的使用动画思路整个view可以分为五个部分1、最外面的壳(不需要动画)2、中间矩形框3、矩形框中的灰色矩形块4、三根短线5、三根长线第一步在drawable文件夹下新建名为refresh的vector文件android:width200dpandroid:height200dpandroid:viewportHeight200android:viewportWidth200android:nameout_rectandroid:pathDataM70,60L130,60Q140,60 140,70L140,130Q140,140 130,140L70,140Q60,140 60,130L60,70Q60,60 70,60android:strokeColorcolor/colorCustomHeaderLineandroid:strokeWidth2 /android:namemiddle_rectandroid:pathDataM71,75L100,75L100,95L72,95L72,75android:strokeColorcolor/colorCustomHeaderLineandroid:strokeWidth2 /android:nameinner_rectandroid:fillColorcolor/colorCustomHeaderInnerandroid:pathDataM73,76L99,76L99,94L73,94 /android:nameshort_linesandroid:pathDataM108,75L128,75M108,85L128,85M108,95L128,95android:strokeColorcolor/colorCustomHeaderLineandroid:strokeWidth2 /android:namelong_linesandroid:pathDataM72,105L128,105M72,115L128,115M72,125L128,125android:strokeColorcolor/colorCustomHeaderLineandroid:strokeWidth2 /打开xml右边的预览我们可以看到效果效果图.png第二步在drawable文件夹下新建名为refresh_vector的animated-vectorandroid:drawabledrawable/refreshandroid:namemiddle_rectandroid:animationanimator/anim_middle_rect /android:nameshort_linesandroid:animationanimator/anim_short_lines /android:namelong_linesandroid:animationanimator/anim_long_lines /android:nameinner_rectandroid:animationanimator/anim_inner_rect /这里需要注意几点1、android:drawabledrawable/refresh这里一定要引用上面的refresh文件2、target标签下的name一定要和refresh中的path标签下的名字一致第三步新建animator文件夹(不是anim)并在下面新建短线、长线、中间矩形框和里面矩形对应的objectAnimator集合anim_middle_rect.xml:android:orderingsequentiallyandroid:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM71,75L100,75L100,95L72,95L72,75android:valueToM99,75L128,75L128,95L100,95L100,75android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM99,75L128,75L128,95L100,95L100,75android:valueToM99,105L128,105L128,125L100,125L100,105android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM99,105L128,105L128,125L100,125L100,105android:valueToM71,105L100,105L100,125L72,125L72,105android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM71,105L100,105L100,125L72,125L72,105android:valueToM71,75L100,75L100,95L72,95L72,75android:valueTypepathType /anim_short_lines.xml:android:orderingsequentiallyandroid:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM108,75L128,75M108,85L128,85M108,95L128,95android:valueToM72,105L128,105M72,115L128,115M72,125L128,125android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM72,105L128,105M72,115L128,115M72,125L128,125android:valueToM72,105L92,105M72,115L92,115M72,125L92,125android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM72,105L92,105M72,115L92,115M72,125L92,125android:valueToM72,75L128,75M72,85L128,85M72,95L128,95android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM72,75L128,75M72,85L128,85M72,95L128,95android:valueToM108,75L128,75M108,85L128,85M108,95L128,95android:valueTypepathType /anim_long_lines.xml:android:orderingsequentiallyandroid:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM72,105L128,105M72,115L128,115M72,125L128,125android:valueToM72,75L92,75M72,85L92,85M72,95L92,95android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM72,75L92,75M72,85L92,85M72,95L92,95android:valueToM72,75L128,75M72,85L128,85M72,95L128,95android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM72,75L128,75M72,85L128,85M72,95L128,95android:valueToM108,105L128,105M108,115L128,115M108,125L128,125android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM108,105L128,105M108,115L128,115M108,125L128,125android:valueToM72,105L128,105M72,115L128,115M72,125L128,125android:valueTypepathType /anim_inner_rect.xmlandroid:orderingsequentiallyandroid:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM73,76L99,76L99,94L73,94android:valueToM101,76L127,76L127,94L101,94android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM101,76L127,76L127,94L101,94android:valueToM101,106L127,106L127,124L101,124android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM101,106L127,106L127,124L101,124android:valueToM73,106L99,106L99,124L73,124android:valueTypepathType /android:duration500android:interpolatorandroid:interpolator/decelerate_cubicandroid:propertyNamepathDataandroid:valueFromM73,106L99,106L99,124L73,124android:valueToM73,76L99,76L99,94L73,94android:valueTypepathType /最后一步在activity中android:idid/imageViewandroid:layout_widthwrap_contentandroid:layout_heightwrap_content/final AnimatedVectorDrawable animatedVectorDrawable (AnimatedVectorDrawable) ContextCompat.getDrawable(this, R.drawable.refresh_vector);findViewById(R.id.imageView).setImageDrawable(animatedVectorDrawable);animatedVectorDrawable.start();//循环动画貌似只能这样。。。final Handler mainHandler new Handler(Looper.getMainLooper());animatedVectorDrawable.registerAnimationCallback(new Animatable2.AnimationCallback() {Overridepublic void onAnimationEnd(Drawable drawable) {mainHandler.post(new Runnable() {Overridepublic void run() {animatedVectorDrawable.start();}});}});
