HarmonyOS 如何自定义上拉加载功能
期望页面支持下拉放大背景图和上滑加载更多数据。
部分代码如下:
Refresh({ refreshing: $$this.isRefresh, offset: 0, builder: EmptyRefreshLoadingBuilder() }) {
List({ scroller: this.listScroller }) {
// 封面图,用于跟随页面向上滚动消失
if (this.myModel!.userInfoData.cover_img_url) {
ListItem() {
Image(this.myModel!.userInfoData.cover_img_url)
.size({ height: this.topRectHeight + 100, width: '100%' })
.objectFit(ImageFit.Cover)// .margin(this.showScrollBgImage ? { top: -80 - 20 } : {})
.margin({ top: -20 })
.visibility(this.showScrollBgImage ? Visibility.Visible : Visibility.Hidden)
}
}
ListItem() {
UserInfoView({
userInfo: this.myModel!.userInfoData,
userSummary: this.myModel!.userSummaryData
})
.margin({ top: -45 })
// .margin(this.showScrollBgImage ? { top: -20 } : {})
}
ListItem() {
TabsView({
model: this.myModel!,
})
}
}
.nestedScroll(this.myModel?.nestedScroll)
.edgeEffect(EdgeEffect.None)
.onScrollFrameBegin((offset) => {
const yOffset: number = this.listScroller.currentOffset().yOffset;
this.scrollYOffset = yOffset;
return {
offsetRemain: offset
}
})
.onScrollStop(() => {
const yOffset: number = this.listScroller.currentOffset().yOffset;
this.scrollYOffset = yOffset;
})
}
.height('100%')
.width('100%')
.onRefreshing(async () => {
// 下拉不需要执行操作,直接关闭下拉状态
this.isRefresh = false
})
.onOffsetChange((value: number) => {
this.refreshYOffset = value;
})
.visibility(this.myModel!.loadingStatus === LoadingStatus.SUCCESS ? Visibility.Visible : Visibility.Hidden)
下拉放大背景图功能,通过Refresh的onOffsetChange事件实现了。但是上滑加载更多数据不知道怎么实现。尝试过使用@ohos/pulltorefresh和@abner/refresh,都无法满足需求。
HarmonyOS
赞
收藏 0
回答 1
待解决
相关问题
HarmonyOS 下拉刷新,上拉加载功能
241浏览 • 1回复 待解决
HarmonyOS 上拉加载更多
225浏览 • 1回复 待解决
列表组件如何实现上拉加载更多数据的功能?
705浏览 • 1回复 待解决
HarmonyOS swiper实现上拉加载更多
207浏览 • 1回复 待解决
HarmonyOS 下拉刷新,上拉加载示例
322浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何在HarmonyOS中实现上拉刷新和下拉加载功能?
662浏览 • 1回复 待解决
上拉加载,下拉刷新组件
794浏览 • 1回复 待解决
HarmonyOS 自定义相机功能
539浏览 • 1回复 待解决
HarmonyOS 自定义拍照功能
363浏览 • 1回复 待解决
HarmonyOS 如何制作自定义加载弹窗
795浏览 • 1回复 待解决
HarmonyOS 关于自定义相机功能
597浏览 • 1回复 待解决
HarmonyOS List组件如何实现上拉加载更多的能力?
673浏览 • 1回复 待解决
HarmonyOS 自定义扫码界面功能自定义高度后报错
455浏览 • 1回复 待解决
HarmonyOS ArkUI加载自定义组件
718浏览 • 1回复 待解决
如何使用和加载自定义字体
2619浏览 • 1回复 待解决
自定义扫码功能,API11提供的自定义扫码功能,如何自定义扫码识别框的宽高?
2271浏览 • 1回复 待解决
HarmonyOS 如何实现自定义按钮的粘贴功能?
754浏览 • 1回复 待解决
HarmonyOS 地图自定义气泡功能
307浏览 • 1回复 待解决
ArkTS如何自定义加载,设置字体fontFamily
1229浏览 • 2回复 待解决
HarmonyOS 如何监听List组件的上拉加载更多事件
152浏览 • 1回复 待解决
加载页面的时候如何自定义header
1165浏览 • 1回复 待解决
HarmonyOS 支持LazyForEach的上拉加载更多组件
282浏览 • 1回复 待解决
HarmonyOS WaterFlow 有没有上拉加载更多的示例
226浏览 • 1回复 待解决
PullToRefresh三方库上拉加载更多,加载完所有的页数之后,如何去显示 “暂无更多”并不可进行上拉?
351浏览 • 1回复 待解决
HarmonyOS 有没有上拉加载更多控件,或者是Refresh组件是否支持自动触底加载更多功能
373浏览 • 1回复 待解决
可以监听手指按下事件,记录其初始位置的值。 监听手指按压移动事件,记录并计算当前移动的位置与初始值的差值,大于0表示向下移动,同时设置一个允许移动的最大值。监听手指抬起事件,若此时移动达到最大值,则触发数据加载并显示刷新视图,加载完成后将此视图隐藏。可参考官方示例demo:https://developer.huawei.com/consumer/cn/codelabsPortal/carddetails/tutorials_NEXT-NewsDataArkTS