• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2022-2023 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 *     http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16import router from '@ohos.router'
17
18@Component
19export struct VideoPage {
20  @State videoSrc: Resource = $r('app.media.videos')
21  @State controls: boolean = false
22  @State isFull: boolean = false
23  @State isPause: boolean = true
24  @State isPlayClick: boolean = true
25  @State firstClick: boolean = true
26  @State isHidden: boolean = true
27  @Link isStart: boolean
28  @Consume('playTime') updateTime: number
29  detailVideoController: VideoController = new VideoController()
30
31  build() {
32    Column() {
33      Stack() {
34        Video({
35          src: this.videoSrc,
36          controller: this.detailVideoController,
37        })
38          .width('100%')
39          .backgroundColor(this.isHidden ? '#ffffff' : '#000000')
40          .aspectRatio(1.12)
41          .controls(this.controls)
42          .objectFit(ImageFit.Contain)
43          .onUpdate((e) => {
44            this.updateTime = e.time
45          })
46          .onPrepared((e) => {
47            console.info('VideoPage_onPrepared:' + e.duration)
48          })
49          .onClick(() => {
50            if (this.isPlayClick) { // 判断play按钮是否用过，没有用过，进入这层
51              if (this.firstClick) { // 第一次点击视频开始播放，再次点击进入全屏
52                this.detailVideoController.start()
53                this.isHidden = !this.isHidden
54                this.isStart = true
55                this.firstClick = !this.firstClick
56              } else {
57                router.push({ url: 'pages/FullPage', params: { videoSrc: this.videoSrc, videoTime: this.updateTime } })
58              }
59            } else {
60              router.push({ url: 'pages/FullPage', params: { videoSrc: this.videoSrc, videoTime: this.updateTime } })
61            }
62          })
63          .onFinish(() => {
64            this.isHidden = true
65            this.isStart = false
66          })
67
68        // 空白层预览
69        if(this.isHidden){
70          Column() {
71            Image($r('app.media.previewImg'))
72              .id('previewImg')
73              .objectFit(ImageFit.Contain)
74          }
75          .width('100%')
76          .aspectRatio(1.12)
77          .backgroundColor('#ffffff')
78        }
79
80        // 视频上的play图标
81        if(this.isHidden){
82          Column() {
83            Image($r('app.media.play'))
84              .id('playBtn')
85              .width(76).height(76)
86              .onClick(() => {
87                this.detailVideoController.start()
88                this.isHidden = !this.isHidden
89                this.isStart = true
90                this.isPlayClick = false
91              })
92          }
93        }
94      }
95      .width('100%')
96      .height('100%')
97    }
98  }
99}