PullToRefreshListView下拉小球碰撞效果

效果实现原理:PullToRefresh+Frame(帧动画)动画

步骤:

  1. 准备动画

   2.将动画效果,假如到PullToRefresh 中。


实现过程简介:

1.新建drawble 目录下的animation.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/spinner_01" android:duration="70" />
	<item android:drawable="@drawable/spinner_02" android:duration="70" />
	<item android:drawable="@drawable/spinner_03" android:duration="70" />
	<item android:drawable="@drawable/spinner_04" android:duration="70" />
	<item android:drawable="@drawable/spinner_05" android:duration="70" />
	<item android:drawable="@drawable/spinner_06" android:duration="70" />
	<item android:drawable="@drawable/spinner_07" android:duration="70" />
	<item android:drawable="@drawable/spinner_08" android:duration="70" />
	<item android:drawable="@drawable/spinner_09" android:duration="70" />
	<item android:drawable="@drawable/spinner_10" android:duration="70" />
	<item android:drawable="@drawable/spinner_11" android:duration="70" />
	<item android:drawable="@drawable/spinner_12" android:duration="70" />
	<item android:drawable="@drawable/spinner_13" android:duration="70" />
	<item android:drawable="@drawable/spinner_14" android:duration="70" />
	<item android:drawable="@drawable/spinner_15" android:duration="70" />
	<item android:drawable="@drawable/spinner_16" android:duration="70" />
	<item android:drawable="@drawable/spinner_17" android:duration="70" />
	<item android:drawable="@drawable/spinner_18" android:duration="70" />
	<item android:drawable="@drawable/spinner_19" android:duration="70" />
</animation-list>

接下来在我们的布局文件layout.xml 中使用PullToRefreshView,这里以ListView为例:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    
    <com.example.refreshball.pull.PullToRefreshListView
           android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true"
        ></com.example.refreshball.pull.PullToRefreshListView>
    
</RelativeLayout>


将我们前面的animation 作为图片的背景 设置到pulltorefreshlistview 的头布局中。

header.xml:

<?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" >

            <com.example.refreshball.KImageView
                android:id="@+id/pull_to_refresh_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center" />
    </FrameLayout>

</merge>

在我们的loadinglayout这个view中,通过资源 id 设置给 imageview。

	// If we don't have a user defined drawable, load the default
	if (null == imageDrawable) {
	 imageDrawable = context.getResources().getDrawable(getDefaultDrawableResId());
	 }

	// Set Drawable, and save width/height
	setLoadingDrawable(imageDrawable);

	reset();

接下来就可以在项目中使用该效果了。

ps:由于使用的是PullToRefresh 这个框架,这里对此不作介绍。


下载Demo:http://download.csdn.net/detail/conan9715/9474645 

查看效果:+Q群 编程之美      230274309 




你可能感兴趣的:(PullToRefreshListView下拉小球碰撞效果)