Showing
2 changed files
with
44 additions
and
12 deletions
| @@ -74,12 +74,17 @@ export struct VideoChannelDetail { | @@ -74,12 +74,17 @@ export struct VideoChannelDetail { | ||
| 74 | @StorageLink('GestureLoadStrategy') GestureLoadStrategy: number = 0 | 74 | @StorageLink('GestureLoadStrategy') GestureLoadStrategy: number = 0 |
| 75 | @State timer: number = -1 | 75 | @State timer: number = -1 |
| 76 | 76 | ||
| 77 | + ///视频下拉刷新 | ||
| 78 | + @State currentOffset: number = 0 | ||
| 79 | + @State endIndex: number = 0 | ||
| 80 | + @Link isRefreshList: boolean | ||
| 77 | autoRefreshChange() { | 81 | autoRefreshChange() { |
| 78 | if (this.topNavIndex === 0 && !this.isRequesting) { | 82 | if (this.topNavIndex === 0 && !this.isRequesting) { |
| 79 | this.data = [] | 83 | this.data = [] |
| 80 | this.interactDataList = [] | 84 | this.interactDataList = [] |
| 81 | this.totalCount = 0 | 85 | this.totalCount = 0 |
| 82 | this.isMouted = false | 86 | this.isMouted = false |
| 87 | + this.isRefreshList = true | ||
| 83 | this.getRecCompInfo() | 88 | this.getRecCompInfo() |
| 84 | } | 89 | } |
| 85 | 90 | ||
| @@ -267,6 +272,7 @@ export struct VideoChannelDetail { | @@ -267,6 +272,7 @@ export struct VideoChannelDetail { | ||
| 267 | }).catch(() => { | 272 | }).catch(() => { |
| 268 | // 获取内容失败请重试 | 273 | // 获取内容失败请重试 |
| 269 | this.isRequesting = false | 274 | this.isRequesting = false |
| 275 | + this.isRefreshList = false | ||
| 270 | }) | 276 | }) |
| 271 | } | 277 | } |
| 272 | 278 | ||
| @@ -276,6 +282,7 @@ export struct VideoChannelDetail { | @@ -276,6 +282,7 @@ export struct VideoChannelDetail { | ||
| 276 | async batchContentDetail(list: batchContentDetailParams, list2: contentListParams) { | 282 | async batchContentDetail(list: batchContentDetailParams, list2: contentListParams) { |
| 277 | if (list.contents.length > 0) { | 283 | if (list.contents.length > 0) { |
| 278 | await ContentDetailRequest.batchContentDetail(list).then(async res => { | 284 | await ContentDetailRequest.batchContentDetail(list).then(async res => { |
| 285 | + this.isRefreshList = false | ||
| 279 | if (res.data) { | 286 | if (res.data) { |
| 280 | await this.getContentInteract(list2) | 287 | await this.getContentInteract(list2) |
| 281 | this.data = this.data.concat(res.data) | 288 | this.data = this.data.concat(res.data) |
| @@ -289,6 +296,7 @@ export struct VideoChannelDetail { | @@ -289,6 +296,7 @@ export struct VideoChannelDetail { | ||
| 289 | 296 | ||
| 290 | }) | 297 | }) |
| 291 | } else { | 298 | } else { |
| 299 | + this.isRefreshList = false | ||
| 292 | this.isRequesting = false | 300 | this.isRequesting = false |
| 293 | } | 301 | } |
| 294 | } | 302 | } |
| @@ -362,6 +370,16 @@ export struct VideoChannelDetail { | @@ -362,6 +370,16 @@ export struct VideoChannelDetail { | ||
| 362 | this.getRecCompInfo() | 370 | this.getRecCompInfo() |
| 363 | } | 371 | } |
| 364 | }) | 372 | }) |
| 373 | + .onGestureSwipe((index: number, extraInfo: SwiperAnimationEvent) =>{ | ||
| 374 | + console.log('视频tab下拉', index.toString() + extraInfo.currentOffset) | ||
| 375 | + this.currentOffset = extraInfo.currentOffset | ||
| 376 | + }) | ||
| 377 | + .onAnimationEnd((index: number)=>{ | ||
| 378 | + if (this.currentOffset > 0 && this.endIndex === 0) { | ||
| 379 | + this.autoRefreshChange() | ||
| 380 | + } | ||
| 381 | + this.endIndex = index | ||
| 382 | + }) | ||
| 365 | // 作为手势动画的背景 | 383 | // 作为手势动画的背景 |
| 366 | Row() {} | 384 | Row() {} |
| 367 | .justifyContent(FlexAlign.Center) | 385 | .justifyContent(FlexAlign.Center) |
| @@ -6,7 +6,7 @@ import { BottomNavDTO, TopNavDTO } from 'wdBean/Index'; | @@ -6,7 +6,7 @@ import { BottomNavDTO, TopNavDTO } from 'wdBean/Index'; | ||
| 6 | import { VideoChannelDetail } from 'wdDetailPlayShortVideo/Index'; | 6 | import { VideoChannelDetail } from 'wdDetailPlayShortVideo/Index'; |
| 7 | import { WDRouterPage, WDRouterRule } from 'wdRouter'; | 7 | import { WDRouterPage, WDRouterRule } from 'wdRouter'; |
| 8 | import { DisplayDirection ,BottomNavi} from 'wdConstant/Index'; | 8 | import { DisplayDirection ,BottomNavi} from 'wdConstant/Index'; |
| 9 | -import { CompUtils, GrayManageModel, PageComponent } from 'wdComponent/Index'; | 9 | +import { CompUtils, GrayManageModel, LottieView, PageComponent } from 'wdComponent/Index'; |
| 10 | import { TrackingButton, TrackConstants } from 'wdTracking/Index'; | 10 | import { TrackingButton, TrackConstants } from 'wdTracking/Index'; |
| 11 | import { ParamType, Tracking } from 'wdTracking/Index'; | 11 | import { ParamType, Tracking } from 'wdTracking/Index'; |
| 12 | import { ColorUtils } from 'wdComponent/src/main/ets/utils/ColorUtils'; | 12 | import { ColorUtils } from 'wdComponent/src/main/ets/utils/ColorUtils'; |
| @@ -52,6 +52,7 @@ export struct VideoChannelPage { | @@ -52,6 +52,7 @@ export struct VideoChannelPage { | ||
| 52 | GrayManage: SubscribedAbstractProperty<GrayManageModel> = AppStorage.link<GrayManageModel>('GrayManage') | 52 | GrayManage: SubscribedAbstractProperty<GrayManageModel> = AppStorage.link<GrayManageModel>('GrayManage') |
| 53 | @StorageLink('GestureLoadStrategy') GestureLoadStrategy: number = 0 | 53 | @StorageLink('GestureLoadStrategy') GestureLoadStrategy: number = 0 |
| 54 | 54 | ||
| 55 | + @State isRefreshList: boolean = false | ||
| 55 | async aboutToAppear() { | 56 | async aboutToAppear() { |
| 56 | // 背景图高度 | 57 | // 背景图高度 |
| 57 | this.backgroundImageH = px2vp(this.topSafeHeight) + 44 | 58 | this.backgroundImageH = px2vp(this.topSafeHeight) + 44 |
| @@ -242,12 +243,29 @@ export struct VideoChannelPage { | @@ -242,12 +243,29 @@ export struct VideoChannelPage { | ||
| 242 | 243 | ||
| 243 | // 搜索按钮 | 244 | // 搜索按钮 |
| 244 | Row() { | 245 | Row() { |
| 245 | - Image($r(this.isImmerseChannel() ? 'app.media.icon_search_gray_svg' : | ||
| 246 | - 'app.media.icon_search')) | ||
| 247 | - .colorFilter(this.isImmerseChannel() ? undefined : | ||
| 248 | - ColorUtils.getDrawingColorFilter(this.getBothColor(""))) | ||
| 249 | - .width('24vp') | ||
| 250 | - .height('24vp') | 246 | + if (this.isRefreshList){ |
| 247 | + LottieView({ | ||
| 248 | + name: 'VideoChannelPageLottie', | ||
| 249 | + path: "lottie/refresh_step2.json", | ||
| 250 | + lottieWidth: 40, | ||
| 251 | + lottieHeight: 40, | ||
| 252 | + autoplay: true, | ||
| 253 | + loop: true, | ||
| 254 | + }) | ||
| 255 | + }else { | ||
| 256 | + Image($r(this.isImmerseChannel() ? 'app.media.icon_search_gray_svg' : | ||
| 257 | + 'app.media.icon_search')) | ||
| 258 | + .colorFilter(this.isImmerseChannel() ? undefined : | ||
| 259 | + ColorUtils.getDrawingColorFilter(this.getBothColor(""))) | ||
| 260 | + .width('24vp') | ||
| 261 | + .height('24vp') | ||
| 262 | + .onClick(() => { | ||
| 263 | + TrackingButton.searchClick(TrackConstants.PageName.Search, "VIDEOS") | ||
| 264 | + let params = { 'tabName': "VIDEOS" } as Record<string, string> | ||
| 265 | + WDRouterRule.jumpWithPage(WDRouterPage.searchPage, params) | ||
| 266 | + }) | ||
| 267 | + } | ||
| 268 | + | ||
| 251 | // .opacity(this.isImmerseChannel() ? 0.8 : 1.0) | 269 | // .opacity(this.isImmerseChannel() ? 0.8 : 1.0) |
| 252 | } | 270 | } |
| 253 | .width('40vp') | 271 | .width('40vp') |
| @@ -257,11 +275,6 @@ export struct VideoChannelPage { | @@ -257,11 +275,6 @@ export struct VideoChannelPage { | ||
| 257 | }) | 275 | }) |
| 258 | .alignItems(VerticalAlign.Center) | 276 | .alignItems(VerticalAlign.Center) |
| 259 | .justifyContent(FlexAlign.Center) | 277 | .justifyContent(FlexAlign.Center) |
| 260 | - .onClick(() => { | ||
| 261 | - TrackingButton.searchClick(TrackConstants.PageName.Search, "VIDEOS") | ||
| 262 | - let params = { 'tabName': "VIDEOS" } as Record<string, string> | ||
| 263 | - WDRouterRule.jumpWithPage(WDRouterPage.searchPage, params) | ||
| 264 | - }) | ||
| 265 | .backgroundColor(Color.Transparent) | 278 | .backgroundColor(Color.Transparent) |
| 266 | 279 | ||
| 267 | } | 280 | } |
| @@ -317,6 +330,7 @@ export struct VideoChannelPage { | @@ -317,6 +330,7 @@ export struct VideoChannelPage { | ||
| 317 | pageName: item.name + '', | 330 | pageName: item.name + '', |
| 318 | channelId: item.channelId + '', | 331 | channelId: item.channelId + '', |
| 319 | autoRefresh: this.autoRefresh, | 332 | autoRefresh: this.autoRefresh, |
| 333 | + isRefreshList: this.isRefreshList | ||
| 320 | }) | 334 | }) |
| 321 | } else { | 335 | } else { |
| 322 | Column() { | 336 | Column() { |
-
Please register or login to post a comment