PlayerInfoComponent.ets 1.77 KB
import { WDAliPlayerController } from 'wdPlayer/Index'
import { PlayerUIComponent } from './PlayerUIComponent'
//竖屏直播详情页左右滑动浮层
@Component
export struct PlayerInfoComponent {
  swiperController?: SwiperController
  private playerController?: WDAliPlayerController
  @Consume bottomSafeHeight: number
  @Consume topSafeHeight: number
  @Consume liveState: string
  @Consume isShowControl: boolean
  @Link swiperIndex: number
  @Link showClearButton: boolean
  @Provide isFullScreen: boolean = false // 判断是否全屏,全屏状态下swiper禁止切换

  build() {
    Column() {
      Swiper(this.swiperController) {
        Text('')
        PlayerUIComponent({ playerController: this.playerController })
          .margin({
          // bottom: this.bottomSafeHeight + 'px',
          top:this.isFullScreen ? 0 : this.topSafeHeight + 'px'
        })
      }
      .cachedCount(2)
      .indicator(false)
      .effectMode(EdgeEffect.None)
      .loop(false)
      .width('100%')
      .height('100%')
      .index(this.swiperIndex)
      .onClick(() => {
        if (this.liveState === 'end') {
          this.isShowControl = !this.isShowControl
        }
      })
      .onGestureSwipe((index: number, extraInfo: SwiperAnimationEvent) => {
        this.dealShowClearButton(index,extraInfo.currentOffset)
      })
      .onAnimationEnd((index: number, extraInfo: SwiperAnimationEvent) => {
        this.dealShowClearButton(index,extraInfo.currentOffset)
      })
      .disableSwipe(this.isFullScreen)
    }
    .height('100%')
    .width('100%')
  }
  dealShowClearButton(index:number, currentOffset: number) {
    this.swiperIndex = index
    if (index == 0) {
      this.showClearButton = currentOffset >= 0;
    }else if (index == 1) {
      this.showClearButton = false
    }
  }
}