HarmonyOS Video设置全屏后，遮挡了其它组件

Video设置全屏后，遮挡了其它组件，请问如何将其它组件显示在全屏的Video之上

HarmonyOS

zxjiu

2024-12-25 12:36:25

浏览

回答 1

待解决

回答 1

按赞同

按时间

fox280

示例参开：

@Entry
@Component
struct VideoPlayerPage {
  @State videoSrc: Resource = $rawfile('shipin.mp4')
  @State previewUri: Resource = $r('app.media.startIcon');
  controller: VideoController = new VideoController();
  @State curRate: PlaybackSpeed = PlaybackSpeed.Speed_Forward_1_00_X
  @State fullHeight: Length = 600
  @State isFullScreen: boolean = false

  build() {
    Column() {
      Stack({ alignContent: Alignment.Bottom }) {
        Video({ src: this.videoSrc, previewUri: this.previewUri, controller: this.controller })
          .width('100%')
          .height(this.fullHeight)
          .loop(false)
          .objectFit(ImageFit.Contain)
          .autoPlay(false)
          .controls(false)
        // 自定义控制器
        Row() {
          Text('start')
            .onClick(() => {
              this.controller.start()
            })
            .margin(5)
            .fontColor(Color.White)
          Text('pause')
            .onClick(() => {
              this.controller.pause()
            })
            .margin(5)
            .fontColor(Color.White)
          Text('0.75').onClick(() => {
            this.curRate = PlaybackSpeed.Speed_Forward_0_75_X
          })
            .margin(5)
            .fontColor(Color.White)
          Text('1').onClick(() => {
            this.curRate = PlaybackSpeed.Speed_Forward_1_00_X
          })
            .margin(5)
            .fontColor(Color.White)
          Text('2')
            .onClick(() => {
              this.curRate = PlaybackSpeed.Speed_Forward_2_00_X
            })
            .margin(5)
            .fontColor(Color.White)
          Text(this.isFullScreen ? '退出全屏' : '全屏')
            .onClick(() => {
              if (this.isFullScreen) {
                this.fullHeight = 600
              }
              else {
                this.fullHeight = '100%'
              }
              this.isFullScreen = !this.isFullScreen
            })
            .fontColor(Color.White)
            .zIndex(1)
        }
      }
      .width('100%')
      .height('100%')
    }.justifyContent(FlexAlign.Center)
  }
}