- 我们看到手机中的各种APP的花样繁多的下拉刷新是不是有点心动呢,想着自己定制自己的专门的下拉刷新,市场上比如,58同城,京东,天猫,美团等下拉刷新都是在下拉头部执行帧动画,我最近看到一个APP,就是慕课网的Android客户端,平时有时候看这个网站的学习视频,就下了一个,发现它的头部是一个圆形的水波纹效果:
看起来很Cool,正好公司有需求做官网的APP,正好可以用上公司的Logo做一个水波纹的下拉刷新,首先要实现水波纹的效果,通过解压慕课网的客户端,发现它的实现其实也是用帧动画,就是假的水波纹,但是我们不想这么早,要做一个完整的水波纹下拉刷新,那么就要实现水波纹的效果,在github上很多水波纹的实现,实现原理是用正弦与余弦曲线,这里放一个链接,有兴趣的可以看看https://github.com/john990/WaveView
然后用美工切的图往上一盖,基本雏形就出来了
ok,下面就是往下拉刷新上集成了。这里介绍一个比较牛逼的下拉刷新框架android-Ultra-Pull-to-Refresh,这个框架可以方便的定制下拉刷新的头部,接口强大,值得研究,下面我们就进行移植实现:
首先使用这个框架定制头部,需要我们把头部的View先实现出来,只要实现PtrUIHandler接口即可:
12
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
package
cn.zmit.ow.widget;
import
in.srain.cube.views.ptr.PtrFrameLayout;
import
in.srain.cube.views.ptr.PtrUIHandler;
import
android.annotation.SuppressLint;
import
android.content.Context;
import
android.util.AttributeSet;
import
android.view.LayoutInflater;
import
android.view.View;
import
android.widget.FrameLayout;
import
cn.zmit.ow.R;
import
cn.zmit.ow.widget.waveview.WaveView;
/**
* 自定义下拉刷新头部
*
* @author Robin time 2015-02-11 14:06:33
*
*/
public
class
CustomPtrHeader
extends
FrameLayout
implements
PtrUIHandler {
WaveView wave_view;
int
i;
public
CustomPtrHeader(Context context) {
super
(context);
init();
}
public
CustomPtrHeader(Context context, AttributeSet attrs) {
super
(context, attrs);
init();
}
public
CustomPtrHeader(Context context, AttributeSet attrs,
int
defStyleAttr) {
super
(context, attrs, defStyleAttr);
init();
}
@SuppressLint
(
"NewApi"
)
public
CustomPtrHeader(Context context, AttributeSet attrs,
int
defStyleAttr,
int
defStyleRes) {
super
(context, attrs, defStyleAttr, defStyleRes);
init();
}
/**
* 初始化
*/
private
void
init() {
View view = LayoutInflater.from(getContext()).inflate(
R.layout.custom_ptr_header,
this
);
wave_view = (WaveView) view.findViewById(R.id.wave_view);
}
@Override
public
void
onUIReset(PtrFrameLayout frame) {
}
@Override
public
void
onUIRefreshPrepare(PtrFrameLayout frame) {
}
@Override
public
void
onUIRefreshBegin(PtrFrameLayout frame) {
/* if (wave_view.getProgress()==0) {
for (i = 0; i < 100; i++) {
new Thread(){
public void run() {
UIKit.runOnMainThreadAsync(new Runnable() {
@Override
public void run() {
wave_view.setProgress(i);
if (wave_view.getProgress()==100) {
wave_view.setProgress(0);
}
}
});
try {
Thread.sleep(200);
} catch (InterruptedException e) {
e.printStackTrace();
}
};
}.start();
}
}*/
}
@Override
public
void
onUIRefreshComplete(PtrFrameLayout frame) {
}
@Override
public
void
onUIPositionChange(PtrFrameLayout frame,
boolean
isUnderTouch,
byte
status,
int
oldPosition,
int
currentPosition,
float
oldPercent,
float
currentPercent) {
float
percent = Math.min(1f, currentPercent);
// if (status == PtrFrameLayout.PTR_STATUS_PREPARE) {
wave_view.setProgress((
int
) (percent *
100
*
1.0
));
invalidate();
// }
}
/**
* 设置波纹进度
* @param progress 进度
*/
public
void
setWaveProgress(
int
progress){
wave_view.setProgress(progress);
}
}
头部定义好之后,就可以调用下拉刷新的代码
12
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
/* 创建自定义刷新头部view */
header =
new
CustomPtrHeader(
this
);
/* 设置刷新头部view */
ptr_view.setHeaderView(header);
/* 设置回调 */
ptr_view.addPtrUIHandler(header);
/* 设置下拉刷新监听 */
ptr_view.setPtrHandler(
new
PtrHandler() {
@Override
public
void
onRefreshBegin(PtrFrameLayout frame) {
refresh();
}
@Override
public
boolean
checkCanDoRefresh(PtrFrameLayout frame,
View content, View header) {
if
(!StringUtils.isEmpty(mCurrentUrl)) {
return
mCurrentUrl.equals(
"http://m.zmit.cn/"
)
|| mCurrentUrl.equals(
"http://m.zmit.cn/index.php"
) ?
false
: mWebView.getScrollY() ==
0
;
}
else
{
return
mWebView.getScrollY() ==
0
;
}
}
});
/* 延时100秒 */
ptr_view.postDelayed(
new
Runnable() {
@Override
public
void
run() {
ptr_view.autoRefresh();
}
},
100
);
/* 下拉时阻止事件分发 */
ptr_view.setInterceptEventWhileWorking(
true
);
这样就完成了,看下最终实现效果
本文永久地址:http://blog.it985.com/7787.html
本文出自 IT985博客 ,转载时请注明出处及相应链接。
Android 定制下拉刷新头部 Ultra Pull To Refresh
时间: 2024-10-24 16:59:47
Android 定制下拉刷新头部 Ultra Pull To Refresh的相关文章
Android PullToRefresh 下拉刷新,上拉更多,支持ScrollView,ListView,可方便拓展GridView,WebView等
在写着东西之前,从网上找到很多这方面的源码,但是基本没有找到满意的,包括在GitHub上的比较有名的Android-PullToRefresh-master,思来想去还是自己写吧,当然其中借鉴了一些别的开源代码! 废话不多说,直接上代码,注释很全乎,应该不难理解,Demo下载地址在最后: package com.zs.pulltorefreshtest; import android.content.Context; import android.util.AttributeSet; impor
Android实现下拉刷新和上拉加载更多的RecyclerView和ScrollView
PullRefreshRecyclerView.java /** * 类说明:下拉刷新上拉加载更多的RecyclerView * Author: gaobaiq * Date: 2016/5/9 18:09 */ public class PullRefreshRecyclerView extends PullRefreshView { /** * 内置的RecyclerView: */ private RecyclerView mRecyclerView; /** * 可见的最后一个item
Android做下拉刷新的时候,在做些什么
1. 简介 好长时间没有写博客了,一来是工作忙,抽不出空,二来是迷上了王者荣耀.现在正好赶上项目空闲期,写一篇关于下拉刷新的文章,个人觉得上来加载更多功能使用场景非常少,而且没有必要做的那么麻烦,文章最后会提一下加载更多的实现. 最近项目中遇见了下拉刷新的需求,正好研究了一下,分享一下自己的心得. 主要参考文章或工程: 郭霖大神-Android下拉刷新完全解析,教你如何一分钟实现下拉刷新功能 自个儿写Android的下拉刷新/上拉加载控件 XListView 这三篇文章各自提供了实现下拉刷新的思
Xamarin. Android实现下拉刷新功能
下拉刷新功能在安卓和iOS中非常常见,一般实现这样的功能都是直接使用第三方的库,网上能找到很多这样的开源库.然而在Xamarin. Android中要实现一个好用的下拉刷新功能却不是很容易,在网上找了几个Xamarin.Android的下拉刷新控件,都不是很满意,所以想重新绑定一个java写的下拉刷新控件.在网上找了几个这样的开源库,通过对比发现android-pull-to-refresh实现的功能比较多,实现的效果也比较满意. Android-Pull-To-Refresh项目地址:http
android学习---下拉刷新组建
Google官方的下拉刷新组建 activity代码实现: /** * The SwipeRefreshLayout should be used whenever the user * can refresh the contents of a view via a vertical swipe gesture. * */public class MainActivity extends Activity implements SwipeRefreshLayout.OnRefreshListe
Android智能下拉刷新加载框架—看这些就够了
一些值得学习的几个下拉刷新上拉加载开源库 Android智能下拉刷新框架-SmartRefreshLayout 支持所有的 View(AbsListView.RecyclerView.WebView....View) 和多层嵌套的视图结构 支持自定义并且已经集成了很多炫酷的 Header 和 Footer (图). 支持和ListView的同步滚动 和 RecyclerView.AppBarLayout.CoordinatorLayout 的嵌套滚动 NestedScrolling. 支持在An
Android -- 官方下拉刷新SwipeRefreshLayout
V4的兼容包 API 大概就这4个常用的方法. code 布局 <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="matc
自个儿写Android的下拉刷新/上拉加载控件 (续)
本文算是对之前的一篇博文<自个儿写Android的下拉刷新/上拉加载控件>的续章,如果有兴趣了解更多的朋友可以先看一看之前的这篇博客. 事实上之所以会有之前的那篇博文的出现,是起因于前段时间自己在写一个练手的App时很快就遇到这种需求.其实我们可以发现类似这样下拉刷新.上拉加载的功能正在变得越来越普遍,可以说如今基本上绝大多数的应用里面都会使用到.当然,随着Android的发展,已经有不少现成的可以实现这种需求的"轮子"供我们使用了. 但转过头想一下想,既然本来就是自己练手
Android自定义控件--下拉刷新的实现
我们在使用ListView的时候,很多情况下需要用到下拉刷新的功能.为了了解下拉刷新的底层实现原理,我采用自定义ListView控件的方式来实现效果. 实现的基本原理是:自定义ListView,给ListView加载头布局,然后动态的控制头布局的现实与隐藏.ListView初始化的时候,头布局是隐藏的,当手指往下拉的时候,根据手指移动的距离与头布局的高度的关系来控制头布局的显示.具体的控制思路详见后边的代码,代码中的注释很详细.先来看一下效果图: 头布局的