OpenHarmony仿视频播放器应用-爱电影（四）

/**
 * 全屏播放
 */
import emitter from '@ohos.events.emitter';
import { CommonData } from '../model/CommonData'
import router from '@ohos.router';
import { VideoView } from '../view/VideoView';
import { VideoData } from '../model/VideoData'
import { VideoDataUtils } from '../utils/VideoDataUtils'
import { VideoSpeed } from '../model/VideoSpeed'
import { PLAYBACK_SPEED, PLAYBACK_STATE } from '../model/Playback'
const TAG: string = 'VideoFullScreen'
@Entry
@Component
struct VideoFullScreen {
  @State mTag: string = TAG
  @State mVideoData: VideoData = null
  private name: string
  @State uri: any = null
  @State previewImage: any = null
  private actors: string | Resource
  private directs: string | Resource
  private introduction: string
  @State videoState: string = PLAYBACK_STATE.INIT
  @Provide('play_time') curTime: number = 0
  @State rateIndex: number = 1
  @State rate: VideoSpeed = PLAYBACK_SPEED[1]
  @Provide('show_operation') isShowOperation : boolean = true
  aboutToAppear() {
    // 横屏显示
    emitter.emit({
      eventId: CommonData.EVENT_WINDOW_LANDSCAPE_ID
    })
    this.initData()
  }
  initData() {
    // 获取当前需要播放的电影资源信息
    this.mVideoData = router.getParams()['video_data']
    this.name = this.mVideoData.name
    this.uri = this.mVideoData.uri
    this.previewImage = this.mVideoData.image
    this.actors = VideoDataUtils.getUser(this.mVideoData.actors)
    this.directs = VideoDataUtils.getUser(this.mVideoData.directs)
    this.introduction = this.mVideoData.introduction
    this.curTime = router.getParams()['cur_time']
    this.videoState = router.getParams()['video_state']
    console.info(`${TAG} curTime:${this.curTime} videoState:${this.videoState}`)
  }
  onBackPress() {
    console.info(`${TAG} onBackPress`)
    this.sendPlayVideo()
  }
  onScreen(isFull: boolean) {
    console.info(`${TAG} onScreen ${isFull}`)
    if (!isFull) {
      this.goBack()
    }
  }
  sendPlayVideo() {
    console.info(`${TAG} sendPlayVideo`)
    emitter.emit({
      eventId: CommonData.EVENT_PLAY_VIDEO
    }, {
      data: {
        cur_time: this.curTime,
        video_state: this.videoState
      }
    })
  }
  goBack() {
    this.sendPlayVideo()
    router.back()
  }
  aboutToDisappear() {
  }
  build() {
    Stack({
      alignContent: Alignment.TopStart
    }) {
      VideoView({
        _TAG: this.mTag,
        videoUri: $uri,
        previewUri: $previewImage,
        videoRate: $rate,
        videoRateIndex: $rateIndex,
        onScreen: this.onScreen.bind(this),
        videoState: $videoState,
        isFullScreen: true,
        isEvent: false,
        mWidth: '100%',
        mHeight: '100%'
      })
      if (this.isShowOperation) {
        Row({ space: 10 }) {
          Image($r('app.media.icon_back'))
            .width(24)
            .height(24)
            .objectFit(ImageFit.Cover)
            .onClick(() => {
              this.goBack()
            })
          Text(this.name)
            .fontSize(20)
            .fontColor(Color.White)
        }
        .padding(20)
      }
    }
    .width('100%')
    .height('100%')
  }
}

Select(options: Array<SelectOption>)

if (this.isFullScreen) {
            Select(this.selectSpeedOption)
              .selected(this.videoRateIndex)
              .value(this.videoRate.val)
              .font({ size: 10 })
              .fontColor(Color.White)
              .selectedOptionFont({ size: 10 })
              .selectedOptionFontColor('#F54F02')
              .optionFontColor('#5E5E5E')
              .optionFont({ size: 10 })
              .onSelect((index: number) => {
                console.info('Select:' + index)
                this.videoRate = PLAYBACK_SPEED[index]
                this.videoRateIndex = index
                console.info(`${TAG} videoRateIndex = ${this.videoRateIndex}`)
              })
              .border({
                width: 0,
                color: Color.White
              })
          }

setPreferredOrientation(orientation: Orientation, callback: AsyncCallback<void" style="font: revert; -webkit-font-smoothing: antialiased; margin: 0px; padding: 0px; border: 0px; vertical-align: baseline; color: rgb(166, 127, 89); cursor: help;">>): void

import UIAbility from '@ohos.app.ability.UIAbility';
import hilog from '@ohos.hilog';
import window from '@ohos.window';
import emitter from '@ohos.events.emitter';
import { CommonData } from '../model/CommonData'
export default class EntryAbility extends UIAbility {
    private mWindow : window.Window
    onCreate(want, launchParam) {
        
    }
    onDestroy() {
      
        // 设置竖屏
        this.mWindow.setPreferredOrientation(window.Orientation.PORTRAIT)
        this.unregisterEmitter()
    }
    onWindowStageCreate(windowStage: window.WindowStage) {
        // Main window is created, set main page for this ability
        this.mWindow = windowStage.getMainWindowSync()
        this.registerEmitter()
        windowStage.loadContent('pages/Splash', (err, data) => {
            if (err.code) {
                return;
            }
        });
    }

    registerEmitter() {
        emitter.on({
            eventId : CommonData.EVENT_WINDOW_PORTRAIT_ID
        }, () => {
            if (!this.mWindow) {
                return
            }
          this.mWindow.setPreferredOrientation(window.Orientation.PORTRAIT)
        })
        emitter.on({
            eventId : CommonData.EVENT_WINDOW_LANDSCAPE_ID
        }, () => {
            if (!this.mWindow) {
                return
            }
            this.mWindow.setPreferredOrientation(window.Orientation.LANDSCAPE)
        })
    }
    unregisterEmitter() {
        emitter.off(CommonData.EVENT_WINDOW_PORTRAIT_ID)
        emitter.off(CommonData.EVENT_WINDOW_LANDSCAPE_ID)
    }
}

aboutToAppear() {
    // 横屏显示
    emitter.emit({
      eventId: CommonData.EVENT_WINDOW_LANDSCAPE_ID
    })
  }

onPageShow() {
    // 竖屏显示
    emitter.emit({
      eventId: CommonData.EVENT_WINDOW_PORTRAIT_ID
    })
  }