android PullToRrefresh自定义下拉刷新动画

参考自 http://blog.csdn.net/wwj_748/article/details/42523611

首先，下载著名的刷新框架https://github.com/chrisbanes/Android-PullToRefresh，其中simple为demo，library和extras作为项目包导入到simple中

一，定义刷新动画的layout

在library下的com.handmark.pulltorefresh.library.internal包中的FlipLoadingLayout和RotateLoadingLayout

FlipLoadingLayout为ios风格的箭头颠倒的刷新动画

RotateLoadingLayout为android风格的图片旋转动画

共同的设置方法是

1，getDefaultDrawableResId()

动画默认图片，可以替换为自己的图片

2，refreshingImpl()

正在刷新时的回调方法，可以设置开始动画

3，resetImpl()

重置

二，正在刷新时为图片居中旋转的效果

1，首先修改library中的pull_to_refresh_header_vertical.xml，去除文字的layout，图片layout水平居中

 <?xml version="1.0" encoding="utf-8"?>
 <merge xmlns:android="http://schemas.android.com/apk/res/android" >

     <FrameLayout
         android:id="@+id/fl_inner"
         android:layout_width="fill_parent"
         android:layout_height="wrap_content"
         android:paddingBottom="@dimen/header_footer_top_bottom_padding"
         android:paddingLeft="@dimen/header_footer_left_right_padding"
         android:paddingRight="@dimen/header_footer_left_right_padding"
         android:paddingTop="@dimen/header_footer_top_bottom_padding" >

         <FrameLayout
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_gravity="center_horizontal" >

             <ImageView
                 android:id="@+id/pull_to_refresh_image"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center" />

             <ProgressBar
                 android:id="@+id/pull_to_refresh_progress"
                 style="?android:attr/progressBarStyleSmall"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center"
                 android:indeterminate="true"
                 android:visibility="gone" />
         </FrameLayout>

      <!--    <LinearLayout
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_gravity="center"
             android:gravity="center_horizontal"
             android:orientation="vertical" >

             <TextView
                 android:id="@+id/pull_to_refresh_text"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:singleLine="true"
                 android:textAppearance="?android:attr/textAppearance"
                 android:textStyle="bold" />

             <TextView
                 android:id="@+id/pull_to_refresh_sub_text"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:singleLine="true"
                 android:textAppearance="?android:attr/textAppearanceSmall"
                 android:visibility="gone" />
         </LinearLayout> -->
     </FrameLayout>

 </merge>

2，去除LoadingLayout中的关于textview的代码

3，可以在RotateLoadingLayout中的getDefaultDrawableResId()方法替换成自己的图片

三，设置自定义动画效果

1，首先设置一个简单的小人走的动画效果，在anim文件夹下新建一个xml，需要加载两张图片，控制图片的停留时间

 <?xml version="1.0" encoding="utf-8"?>
 <animation-list xmlns:android="http://schemas.android.com/apk/res/android"
     android:oneshot="false" >

     <item
         android:drawable="@drawable/app_loading0"
         android:duration="150"/>
     <item
         android:drawable="@drawable/app_loading1"
         android:duration="150"/>

 </animation-list>

2，新建刷新动画的layout，TweenAnimLoadingLayout，类似于之前的源码中的FlipLoadingLayout和RotateLoadingLayout

主要设置初始化，和那几个关键方法就行

 package com.handmark.pulltorefresh.library.internal;


 import com.handmark.pulltorefresh.library.R;
 import com.handmark.pulltorefresh.library.PullToRefreshBase.Mode;
 import com.handmark.pulltorefresh.library.PullToRefreshBase.Orientation;

 import android.content.Context;
 import android.content.res.TypedArray;
 import android.graphics.drawable.AnimationDrawable;
 import android.graphics.drawable.Drawable;
 import android.view.View;

 /**
  * @date 2015/1/8
  * @author wuwenjie
  * @desc 帧动画加载布局
  */
 public class TweenAnimLoadingLayout extends LoadingLayout {

     private AnimationDrawable animationDrawable;

     public TweenAnimLoadingLayout(Context context, Mode mode,
             Orientation scrollDirection, TypedArray attrs) {
         super(context, mode, scrollDirection, attrs);
         // 初始化
         mHeaderImage.setImageResource(R.anim.loading);
         animationDrawable = (AnimationDrawable) mHeaderImage.getDrawable();
     }
     // 默认图片
     @Override
     protected int getDefaultDrawableResId() {
         return R.drawable.app_loading0;
     }

     @Override
     protected void onLoadingDrawableSet(Drawable imageDrawable) {
         // NO-OP
     }

     @Override
     protected void onPullImpl(float scaleOfLayout) {
         // NO-OP
     }
     // 下拉以刷新
     @Override
     protected void pullToRefreshImpl() {
         // NO-OP
     }
     // 正在刷新时回调
     @Override
     protected void refreshingImpl() {
         // 播放帧动画
         animationDrawable.start();
     }
     // 释放以刷新
     @Override
     protected void releaseToRefreshImpl() {
         // NO-OP
     }
     // 重新设置
     @Override
     protected void resetImpl() {
         mHeaderImage.setVisibility(View.VISIBLE);
         mHeaderImage.clearAnimation();
     }

 }

3，替换之前的刷新layout为TweenAnimLoadingLayout

找到library项目com.handmark.pulltorefresh.library包下的PullToRefreshListView，发现头脚的layout用的都是LoadingLayout，找到头脚layout的创建方法createLoadingLayout进入，在createLoadingLayout方法中再进入createLoadingLayout，找到最原始的新建动画layout的地方，把默认的RotateLoadingLayout改成TweenAnimLoadingLayout就行了

在PullToRefreshBase类下，变为

 //在最原始的地方把新建动画layout换成TweenAnimLoadingLayout
         LoadingLayout createLoadingLayout(Context context, Mode mode, Orientation scrollDirection, TypedArray attrs) {
             switch (this) {
                 case ROTATE:
                 default:
 //                  return new RotateLoadingLayout(context, mode, scrollDirection, attrs);
                     return new TweenAnimLoadingLayout(context, mode, scrollDirection, attrs);
                 case FLIP:
                     return new FlipLoadingLayout(context, mode, scrollDirection, attrs);
             }
         }

4，去除LoadingLayout中的关于textview的代码

代码下载 http://download.csdn.net/detail/superjunjin/8589827