APICloud開發者進階之路| UIPullRefreshDrop模塊示例

本文出自APICloud官方論壇,
感謝論壇版主粉紅頑皮新的分享。

UIPullRefreshDrop模塊概述

UIPullRefreshDrop模塊對引擎新推出的下拉刷新接口進行了一層封裝,App 可以通過此模塊來實現水滴效果的下拉刷新功能。使用此模塊,在用戶下拉時本模塊會隨下拉高度而相應地拉伸水滴;當下拉高度達到一定閾值後觸發加載事件:進入加載狀態時,刷新提示圖標開始動畫,同時將下拉刷新事件回發給前端。前端得到下拉刷新事件後開始加載數據;數據加載完畢,調用接口 api.refreshHeaderLoadDone 以停止加載狀態;

模塊文檔鏈接:
https://docs.apicloud.com/Client-API/UI-Layout/UIPullRefreshDrop

注意:對於 APICloud 平臺上的普通模塊,在相應接口調用前需要先 require 該模塊,但由於本模塊是基於引擎下拉刷新功能擴展的模塊,所以本模塊使用方法比較特殊。可以不必 require 模塊,改爲在 config.xml 文件內配置模塊。
config.xml 文件配置示例如下:

<preference name="customRefreshHeader" value="UIPullRefreshDrop"/>
複製代碼
在 config.xml 配置後,則本模塊爲全局對象,可以在任意可彈動的窗體(frame、window)中調用 api.setCustomRefreshHeaderInfo 接口設置該下拉刷新樣式,以及開始、停止刷新加載狀態(api.refreshHeaderLoading、api.refreshHeaderLoadDone)。
UIPullRefreshDrop模塊有三個接口:

setCustomRefreshHeaderInfo
配置下拉刷新樣式
refreshHeaderLoading
手動開始下拉刷新的加載狀態,下拉刷新狀態亦可通過用戶手勢下拉到閾值自動觸發
refreshHeaderLoadDone
手動停止下拉刷新的加載狀態

下面是模塊運行效果圖:

APICloud開發者進階之路| UIPullRefreshDrop模塊示例

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章