`
iaiai
  • 浏览: 2195920 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

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/waterseason/8678681
分享到:
评论

相关推荐

    PullToRrefresh 自定义下拉刷新动画

    本篇文章将深入探讨如何实现一个自定义的下拉刷新动画,特别是在动画设计上,我们将以“小人跑”的动画效果为例。 首先,我们需要理解`PullToRefresh`的基本原理。它主要通过监听ScrollView、ListView或...

    ios-自定义下拉刷新动画.zip

    本项目“ios-自定义下拉刷新动画.zip”聚焦于如何使用Swift语言实现一个自定义的下拉刷新动画效果。在iOS中,我们通常会使用UIRefreshControl作为标准的下拉刷新组件,但为了提供更丰富的用户体验和个性化的设计,...

    ios自定义下拉刷新控件

    自定义下拉刷新控件可以让你根据项目需求定制刷新动画和视觉效果,提升用户体验。下面我们将深入探讨如何在iOS中实现自定义下拉刷新控件。 一、下拉刷新基础 1. UIRefreshControl:苹果提供的系统下拉刷新控件,...

    安卓自定义下拉刷新 带动画效果

    本篇主要介绍如何在Android中实现一个自定义的下拉刷新功能,并结合帧动画效果,提升用户体验。 一、下拉刷新原理 下拉刷新的基本原理是监听ListView的滚动事件,当用户上滑到列表顶部并继续下拉时,如果满足一定的...

    android自定义下拉刷新上拉加载

    本教程将详细讲解如何在Android中实现自定义的下拉刷新和上拉加载功能。 首先,我们要了解这两个概念的核心思想。下拉刷新(Pull-to-Refresh)是指用户在滚动列表到顶部时,继续向下拖动以触发数据的更新。上拉加载...

    自定义下拉刷新 下滑底部无限加载 RecyclerView

    虽然SwipeRefreshLayout提供了默认的刷新动画,但有时我们可能需要自定义更符合产品风格的动画效果。为此,你可以创建一个自定义的刷新视图,继承SwipeRefreshLayout的子类并覆盖onRefresh()方法。在这个方法中,...

    自定义下拉刷新viewgroup

    自定义Viewgroup允许开发者根据需求定制刷新动画和交互逻辑,以达到更个性化的效果。 1. **自定义Viewgroup基础** - 创建一个新的Java类,继承自`FrameLayout`。`FrameLayout`是一个简单的布局容器,它可以包含多...

    表视图下拉刷新动画仿京东

    为了提升用户体验,许多App在用户执行下拉操作时会触发一种特殊的效果,即下拉刷新动画。这种动画通常显示一些动态元素,如加载指示器或者趣味性的图形变化,以告知用户数据正在更新。本示例“表视图下拉刷新动画...

    swift-自定义下拉刷新控件

    一旦检测到足够的下拉距离,就可以启动自定义的刷新动画。 3. **刷新状态的控制** 当刷新动画开始时,应更新刷新视图的状态,比如改变图片、文字或者进度条的显示。同时,需要设置一个标志位来跟踪当前是否处于...

    轻松实现各种自定义动画上啦刷新和下拉刷新

    在移动应用开发中,用户体验是至关重要的,而上拉刷新和下拉刷新功能则是现代App交互设计中的常见元素。...通过研究和实践,开发者可以灵活地定制适合自己应用的刷新动画,增强用户在使用过程中的乐趣。

    Android仿百度外卖自定义下拉刷新效果

    总的来说,实现百度外卖式的自定义下拉刷新动画涉及到对Android动画系统的深入理解,包括Tween动画、帧动画和属性动画的使用。通过巧妙地组合和配置这些动画,可以创造出丰富多样的下拉刷新效果,提升应用的视觉吸引...

    iOS-自定义下拉刷新上拉加载(可根据自己的需求改)

    本教程将详细介绍如何在iOS项目中实现自定义的下拉刷新和上拉加载,使得开发者可以根据具体需求进行定制。 首先,下拉刷新(Pull-to-Refresh)是指当用户在列表顶部向下拉动时,会显示一个刷新指示器,松手后自动...

    Android 自定义下拉刷新控件

    该工具类封装了一个自定义的带下拉刷新的listview,可直接导入Module工程,然后依赖到当前项目即可使用, https://blog.csdn.net/weixin_41771564/article/details/81082512这里有详细的使用

    Android 自定义下拉刷新

    虽然SwipeRefreshLayout提供了一种简单的方法来实现下拉刷新,但有时我们需要自定义刷新动画或行为,这就需要我们自己实现。自定义下拉刷新通常涉及以下几个步骤: - 创建一个包含刷新动画的布局。 - 实现手势检测,...

    Android自定义控件下拉刷新实例代码

    在Android开发中,自定义控件常常用于提供更丰富的...这个实例代码提供了一个基础的下拉刷新实现,但实际应用中可能需要根据具体需求进行调整,例如集成网络请求库、处理数据加载失败的情况,或者适配不同的刷新动画。

    ios-自定义下拉刷新.zip

    使用UIScrollViewDelegate协议的`scrollViewDidScroll:`方法可以获取到滚动位置的变化,当用户下拉到特定位置时,启动刷新动画。 3. **动画实现**:自定义下拉刷新的关键在于动画设计。你可以使用Core Animation、...

    自定义RecyclerView下拉刷新

    在startRefreshing()方法中,你需要模拟下拉刷新动画,并执行数据刷新的逻辑。同时,别忘了在刷新完成后调用stopRefreshing()来恢复原状。 3. 自定义头部布局 为了实现自定义的刷新头部,你可能需要创建一个自定义...

    微信小程序自定义导航栏的自定义下拉刷新

    1. 在`wxml`文件中,创建一个用于显示下拉刷新动画的容器,如`&lt;view class="refresh-container"&gt;&lt;/view&gt;`。 2. 在`wxss`中,为这个容器编写动画,例如旋转、缩放等效果。 3. 在`js`文件中,监听`onPullDownRefresh`...

    自定义下拉刷新ListView

    Android自定义下拉刷新,上拉加载更多,支持侧滑删除功能,

    安卓下拉上拉刷新相关-自定义下拉刷新下滑底部无限加载RecyclerView.zip

    1. 自定义的下拉刷新视图:用于处理刷新手势和显示刷新动画。 2. 上拉加载更多视图:用于在用户滚动到底部时加载更多数据,并显示加载状态。 3. RecyclerView适配器:处理数据绑定和视图复用。 4. 数据加载逻辑:...

Global site tag (gtag.js) - Google Analytics