UIPullRefreshDrop (下拉刷新) 模块体验分享

uoaccw

UIPullRefreshDrop：
可以通过此模块来实现水滴效果的下拉刷新功能
模块文档地址

使用步骤：
1. 在模块库搜索UIPullRefreshDrop 并添加到项目。然后编译自定义loader安装到手机。
在index.html页面打开一个要下拉刷新的页面：
api.openFrame({
            name: 'refresh',
            url: 'html/refresh.html',
            bounces: true,
            bgColor: 'rgba(0, 0, 0, 1)',
            customRefreshHeader: 'UIPullRefreshDrop',   // 这个参数指定下拉刷新模块名
            rect: {
                x: 0,
                y: 50,
                w: 'auto',
                h: 'auto'

            }
        });

2.  在refresh.html页面写以下代码：

    apiready = function() {
        api.setCustomRefreshHeaderInfo({
            bgColor: '#fff',
            dropColor: '#9BA2AC',
        }, function() {
            //从服务端请求数据成功后结束刷新状态
            setTimeout(function() {
                api.refreshHeaderLoadDone()
            }, 3000);
        });
    };

效果图：

gigie

感谢分享。

关于IT

可以的分享