今天公司让把官方的下拉刷新动画改一下,自己仔细读pullTorefresh源码,终于发现了蛛丝马迹,现我就自己理解将修改步骤给大家讲解一下。
本篇博文要给大家分享的是如何使用修改开源项目PullToRrefresh下拉刷新的动画,来满足我们开发当中特定的需求,我们比较常见的一种下拉刷新样式可能是以下这种:
就是下拉列表的时候两个箭头上下翻转,更改日期文本和刷新状态,这种是最普遍的一种模式。
另外一种是旋转动画,就是刷新的时候一个圈不停的旋转,我们公司就是用的第二种。
仔细看看确实不怎么好看,现在不是看脸的时代吗,就不卖弄它的才华了,把实用放在第二位吧。
我这里要实现的一种效果是下拉刷新时播放一个帧动画,所以首先得创建一个动画。
<span style="font-size:14px;"><span style="font-size:14px;"><?xml version="1.0" encoding="UTF-8"?> -<animation-list android:oneshot="false" xmlns:android="http://schemas.android.com/apk/res/android"> <!-- oneshot: 是否只显示一次 --> <item android:duration="100" android:drawable="@drawable/nv1"/> <item android:duration="100" android:drawable="@drawable/nv2"/> <item android:duration="100" android:drawable="@drawable/nv3"/> <item android:duration="100" android:drawable="@drawable/nv4"/> </animation-list></span></span>
<span style="font-size:14px;">package com.handmark.pulltorefresh.library.internal; import android.content.Context; import android.content.res.TypedArray; import android.graphics.drawable.AnimationDrawable; import android.graphics.drawable.Drawable; import android.view.View; import com.handmark.pulltorefresh.library.PullToRefreshBase; import com.hjwang.netdoctor.R; /** * Created by duan on 2016/2/14. */ public class TweenAnimLoadingLayout extends LoadingLayout { private AnimationDrawable animationDrawable; public TweenAnimLoadingLayout(Context context, PullToRefreshBase.Mode mode, PullToRefreshBase.Orientation scrollDirection, TypedArray attrs) { super(context, mode, scrollDirection, attrs); // 初始化 mHeaderImage.setImageResource(R.drawable.anim_da); animationDrawable = (AnimationDrawable) mHeaderImage.getDrawable(); } // 默认图片 @Override protected int getDefaultDrawableResId() { return R.drawable.nv1; } @Override protected void onLoadingDrawableSet(Drawable imageDrawable) { // NO-OP } @Override protected void onPullImpl(float scaleOfLayout) { // NO-OP } // 下拉以刷新 @Override protected void pullToRefreshImpl() { // NO-OP animationDrawable.stop(); } // 正在刷新时回调 @Override protected void refreshingImpl() { // 播放帧动画 animationDrawable.start(); } // 释放以刷新 @Override protected void releaseToRefreshImpl() { // NO-OP } // 重新设置 @Override protected void resetImpl() { mHeaderImage.setVisibility(View.VISIBLE); mHeaderImage.clearAnimation(); } }</span>好,到了这步我们的工作就基本做了一大半了,接下来我们看源代码
<span style="font-size:14px;">LoadingLayout createLoadingLayout(Context context, Mode mode, Orientation scrollDirection, TypedArray attrs) { switch (this) { case ROTATE: default: return new RotateLoadingLayout(context, mode, scrollDirection, attrs); case FLIP: return new FlipLoadingLayout(context, mode, scrollDirection, attrs); } }</span>默认返回打圈圈的布局,也就是RotateLoadingLayout,而FliploadingLayout就是带有箭头的布局。
所以我们只需将默认的返回的布局改为我们自定义的布局就可以了。
这里只是修改了动画,如果想要做更炫的效果,把刷新的头布局更改为我们的自定义布局就行了。就不附源码了,如果有任何疑问,请留言。小子也是最近才写自己的博客,有什么不托的地方请大家多多指教。谢谢大家。