diff --git a/entry/src/main/ets/controller/AvPlayerController.ets b/entry/src/main/ets/controller/AvPlayerController.ets index 585bfbd8099556ab64451471baa8219951eb7f5d..a30f1d9e13c1929a78044d52109da4aaadfdab72 100644 --- a/entry/src/main/ets/controller/AvPlayerController.ets +++ b/entry/src/main/ets/controller/AvPlayerController.ets @@ -64,21 +64,16 @@ export class AvPlayerController { if (source.index) { this.index = source.index; } - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `initPlayer == this.curSource : ${JSON.stringify(this.curSource)}`); if (!this.curSource) { return; } - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `initPlayer == initCamera surfaceId == ${surfaceId}`); this.surfaceID = surfaceId; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `initPlayer == this.surfaceID surfaceId == ${this.surfaceID}`); try { - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'initPlayer videoPlay avPlayerDemo'); // Creates the avPlayer instance object. this.avPlayer = avPlayer ? avPlayer : await media.createAVPlayer() // Creates a callback function for state machine changes. this.setAVPlayerCallback(); - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'initPlayer videoPlay setAVPlayerCallback'); if (!this.context) { hilog.info(CommonConstants.LOG_DOMAIN, TAG, `initPlayer failed context not set`); @@ -88,14 +83,10 @@ export class AvPlayerController { case VideoDataType.RAW_FILE: let fileDescriptor = await this.context.resourceManager.getRawFd(this.curSource.videoSrc); this.avPlayer.fdSrc = fileDescriptor; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, - `initPlayer videoPlay src = ${JSON.stringify(this.avPlayer.fdSrc)}`); break; case VideoDataType.URL: this.avPlayer.url = this.curSource.videoSrc; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, - `initPlayer videoPlay url = ${JSON.stringify(this.avPlayer.url)}`); break; case VideoDataType.RAW_M3U8_FILE: @@ -105,13 +96,11 @@ export class AvPlayerController { mediaSource.setMimeType(media.AVMimeTypes.APPLICATION_M3U8); let playbackStrategy: media.PlaybackStrategy = { preferredBufferDuration: 20, showFirstFrameOnPrepare: true }; await this.avPlayer.setMediaSource(mediaSource, playbackStrategy); - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `initPlayer videoPlay fdUrl = ${JSON.stringify(fdUrl)}`); break; case VideoDataType.RAW_MP4_FILE: let mp4Fd = await this.context.resourceManager.getRawFd(this.curSource.videoSrc); let mp4FdUrl = 'fd://' + mp4Fd.fd; this.avPlayer.url = mp4FdUrl; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `initPlayer videoPlay fdUrl = ${JSON.stringify(mp4FdUrl)}`); break; default: break; @@ -119,13 +108,16 @@ export class AvPlayerController { // [Start AddCaption] if (this.curSource.caption) { let fileDescriptorSub = await this.context.resourceManager.getRawFd(this.curSource.caption); - this.avPlayer.addSubtitleFromFd(fileDescriptorSub.fd, fileDescriptorSub.offset, fileDescriptorSub.length); - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'initPlayer videoPlay addSubtitleFromFd'); + this.avPlayer.addSubtitleFromFd(fileDescriptorSub.fd, fileDescriptorSub.offset, fileDescriptorSub.length) + .catch((err: BusinessError) => { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `addSubtitleFromFd failed, code is ${err.code}, message is ${err.message}`); + }); } // [End AddCaption] } catch (err) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, - `initPlayer initPlayer, code is ${err.code}, message is ${err.message}`); + `initPlayer failed, code is ${err.code}, message is ${err.message}`); } } @@ -137,23 +129,18 @@ export class AvPlayerController { } this.avPlayer!.on('error', (err: BusinessError) => { hilog.error(CommonConstants.LOG_DOMAIN, TAG, `AVPlayer error, code is ${err.code}, message is ${err.message}`); - this.avPlayer!.reset(); - }); - // Listening function for reporting time - this.avPlayer!.on('startRenderFrame', () => { - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `AVPlayer start render frame`); - AppStorage.setOrCreate('StartRender', true); + this.avPlayer!.reset().catch((err: BusinessError) => { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `reset failed, code is ${err.code}, message is ${err.message}`); + }); }); this.avPlayer!.on('durationUpdate', (time: number) => { this.duration = time; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `AVPlayer duration update: ${time}`); AppStorage.setOrCreate('DurationTime', time); }); this.avPlayer.on('timeUpdate', (time: number) => { this.currentTime = time; AppStorage.setOrCreate('CurrentTime', time); - hilog.info(CommonConstants.LOG_DOMAIN, TAG, - `setAVPlayerCallback timeUpdate success, and new time is = ${this.currentTime}`); }); // The error callback function is triggered when an error occurs during avPlayer operations, @@ -164,7 +151,10 @@ export class AvPlayerController { } hilog.error(CommonConstants.LOG_DOMAIN, TAG, `Invoke avPlayer failed, code is ${err.code}, message is ${err.message}`); - this.avPlayer.reset(); // resets the resources and triggers the idle state + this.avPlayer.reset().catch((err: BusinessError) => { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `reset failed, code is ${err.code}, message is ${err.message}`); + }); }) this.subtitleUpdateFunction(); this.setStateChangeCallback(); @@ -175,36 +165,29 @@ export class AvPlayerController { return; } // [Start loop_playback] - /** - * Loop playback - */ // Callback function for state machine changes this.avPlayer.on('stateChange', async (state) => { if (!this.avPlayer) { return; } switch (state) { - // DocsDot - // [StartExclude state] + // [StartExclude loop_playback] case 'idle': // This state machine is triggered after the reset interface is successfully invoked. hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'setAVPlayerCallback AVPlayer state idle called.'); break; case 'initialized': // This status is reported after the playback source is set on the AVPlayer. - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'setAVPlayerCallback AVPlayer state initialized called.'); // Set the display screen. This parameter is not required when the resource to be played is audio-only. this.avPlayer.surfaceId = this.surfaceID; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, - `setAVPlayerCallback this.avPlayer.surfaceId = ${this.avPlayer.surfaceId}`); - this.avPlayer.prepare(); + this.avPlayer.prepare().catch((err: BusinessError) => { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `prepare failed, code is ${err.code}, message is ${err.message}`); + }); break; - // [EndExclude state] - // DocsDot + // [EndExclude loop_playback] case 'prepared': // This state machine is reported after the prepare interface is successfully invoked. - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'setAVPlayerCallback AVPlayer state prepared called.'); this.isReady = true; this.avPlayer.loop = true - // DocsDot - // [StartExclude prepared] + // [StartExclude loop_playback] this.durationTime = this.avPlayer.duration; this.currentTime = this.avPlayer.currentTime; this.avPlayer.audioInterruptMode = audio.InterruptMode.SHARE_MODE; @@ -218,23 +201,25 @@ export class AvPlayerController { }; emitter.emit(CommonConstants.AVPLAYER_PREPARED, eventData); if (this.isMuted) { - await this.avPlayer!.setMediaMuted(media.MediaType.MEDIA_TYPE_AUD, this.isMuted!) + try { + await this.avPlayer!.setMediaMuted(media.MediaType.MEDIA_TYPE_AUD, this.isMuted!) + } catch (err) { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `setMediaMuted failed, code is ${err.code}, message is ${err.message}`); + } } - this.setWindowScale(); - if (this.index === 0) { - this.avPlayer.play(); // Invoke the playback interface to start playback. + this.avPlayer.play().catch((err: BusinessError) => { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `play failed, code is ${err.code}, message is ${err.message}`); + }); } - this.setVideoSpeed(); - // [EndExclude prepared] - // DocsDot + // [EndExclude loop_playback] break; - // DocsDot - // [StartExclude other_state] + // [StartExclude loop_playback] case 'playing': // After the play interface is successfully invoked, the state machine is reported. - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'setAVPlayerCallback AVPlayer state playing called.'); this.isPlaying = true; let eventDataTrue: emitter.EventData = { data: { @@ -248,7 +233,6 @@ export class AvPlayerController { emitter.emit(innerEventTrue, eventDataTrue); break; case 'completed': // This state machine is triggered to report when the playback ends. - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'setAVPlayerCallback AVPlayer state completed called.'); this.currentTime = 0; let eventDataFalse: emitter.EventData = { data: { @@ -264,8 +248,7 @@ export class AvPlayerController { default: hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'setAVPlayerCallback AVPlayer state unknown called.'); break; - // [EndExclude other_state] - // DocsDot + // [EndExclude loop_playback] } }); // [End loop_playback] @@ -305,40 +288,32 @@ export class AvPlayerController { videoPlay(): void { if (this.avPlayer) { - try { - this.avPlayer.play(); - this.isPlaying = true; - } catch (err) { + this.avPlayer.play().catch((err: BusinessError) => { hilog.error(CommonConstants.LOG_DOMAIN, TAG, - `videoPlay failed, code is ${err.code}, message is ${err.message}`); - } + `play failed, code is ${err.code}, message is ${err.message}`); + }); + this.isPlaying = true; } } videoPause(): void { if (this.avPlayer) { - try { - this.avPlayer.pause(); - this.isPlaying = false; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'videoPause'); - } catch (err) { + this.avPlayer.pause().catch((err: BusinessError) => { hilog.error(CommonConstants.LOG_DOMAIN, TAG, - `videoPause failed, code is ${err.code}, message is ${err.message}`); - } + `addSubtitleFromFd failed, code is ${err.code}, message is ${err.message}`); + }); + this.isPlaying = false; } } // Toggle play/pause state videoStop(): void { if (this.avPlayer) { - try { - this.avPlayer.stop(); - this.isPlaying = false; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'videoPause'); - } catch (err) { + this.avPlayer.stop().catch((err: BusinessError) => { hilog.error(CommonConstants.LOG_DOMAIN, TAG, `videoPause failed, code is ${err.code}, message is ${err.message}`); - } + }); + this.isPlaying = false; } } @@ -353,7 +328,6 @@ export class AvPlayerController { try { this.isMuted = isMuted; await this.avPlayer!.setMediaMuted(media.MediaType.MEDIA_TYPE_AUD, isMuted) - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'videoMuted'); } catch (err) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, `videoMuted failed, code is ${err.code}, message is ${err.message}`); @@ -368,7 +342,6 @@ export class AvPlayerController { if (this.avPlayer) { try { this.avPlayer.setSpeed(speed); - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'videoSpeed'); } catch (err) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, `videoSpeed failed, code is ${err.code}, message is ${err.message}`); @@ -382,7 +355,6 @@ export class AvPlayerController { if (this.avPlayer) { try { this.avPlayer.seek(seekTime, media.SeekMode.SEEK_CLOSEST); - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `videoSeek== ${seekTime}`); } catch (err) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, `videoSeek failed, code is ${err.code}, message is ${err.message}`); @@ -432,7 +404,6 @@ export class AvPlayerController { if (this.avPlayer) { try { this.avPlayer.videoScaleType = media.VideoScaleType.VIDEO_SCALE_TYPE_FIT - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `videoScaleType_0`); } catch (err) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, `videoScaleType_0 failed, code is ${err.code}, message is ${err.message}`); @@ -444,7 +415,6 @@ export class AvPlayerController { if (this.avPlayer) { try { this.avPlayer.videoScaleType = media.VideoScaleType.VIDEO_SCALE_TYPE_FIT_CROP - hilog.info(CommonConstants.LOG_DOMAIN, TAG, `videoScaleType_1`); } catch (err) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, `videoScaleType_1 failed, code is ${err.code}, message is ${err.message}`); @@ -454,27 +424,23 @@ export class AvPlayerController { // [End window_scale_fun] subtitleUpdateFunction(): void { - try { - if (this.avPlayer) { + if (this.avPlayer) { + try { // [Start RegisterCaptionCallBack] this.avPlayer.on('subtitleUpdate', (info: media.SubtitleInfo) => { if (info) { let text = (!info.text) ? '' : info.text; - let startTime = (!info.startTime) ? 0 : info.startTime; - let duration = (!info.duration) ? 0 : info.duration; this.currentCaption = text; //update current caption content - hilog.info(CommonConstants.LOG_DOMAIN, TAG, - `subtitleUpdate info: text:${text}, startTime:${startTime}, duration:${duration}`); } else { this.currentCaption = ''; hilog.error(CommonConstants.LOG_DOMAIN, TAG, 'subtitleUpdate info is null'); } }); // [End RegisterCaptionCallBack] + } catch (err) { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `subtitleUpdateFunction failed, code is ${err.code}, message is ${err.message}`); } - } catch (err) { - hilog.error(CommonConstants.LOG_DOMAIN, TAG, - `subtitleUpdateFunction failed, code is ${err.code}, message is ${err.message}`); } } @@ -487,7 +453,6 @@ export class AvPlayerController { this.curSource.seekTime = this.avPlayer.currentTime; await this.avPlayer.reset(); this.initAVPlayer(this.curSource, this.surfaceID, this.avPlayer); - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'language change'); } } catch (err) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, diff --git a/entry/src/main/ets/entryability/EntryAbility.ets b/entry/src/main/ets/entryability/EntryAbility.ets index 9d939aec0e89269e2237344f3169a51914e37155..c9ed418399b8ee541795a276de4aafffff79aaaf 100644 --- a/entry/src/main/ets/entryability/EntryAbility.ets +++ b/entry/src/main/ets/entryability/EntryAbility.ets @@ -30,40 +30,32 @@ export default class EntryAbility extends UIAbility { if (want.parameters) { if (want.parameters.currentTime) { GlobalContext.getContext().setObject('currentTime', want.parameters.currentTime); - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'time: ' + want.parameters.currentTime); } } - hilog.info(CommonConstants.LOG_DOMAIN, TAG, '%{public}s', 'Ability onCreate'); } onDestroy() { hilog.info(CommonConstants.LOG_DOMAIN, TAG, '%{public}s', 'Ability onDestroy'); } - onWindowStageCreate(windowStage: window.WindowStage): void { - hilog.info(CommonConstants.LOG_DOMAIN, TAG, '%{public}s', 'Ability onWindowStageCreate'); + async onWindowStageCreate(windowStage: window.WindowStage): Promise { try { - windowStage.getMainWindow().then((win: window.Window) => { - win.setWindowKeepScreenOn(true); - win.setWindowSystemBarProperties({ - statusBarColor: '#000000', - statusBarContentColor: '#FFFFFF' - }); - win.setWindowLayoutFullScreen(true); - win.on('windowSizeChange', (newSize: window.Size) => { - let eventWHData: emitter.EventData = { - data: { - 'width': newSize.width, - 'height': newSize.height - } - }; - emitter.emit(CommonConstants.innerEventWH, eventWHData); - }); + let window = await windowStage.getMainWindow() + await window.setWindowKeepScreenOn(true) + window.on('windowSizeChange', (newSize: window.Size) => { + let eventWHData: emitter.EventData = { + data: { + 'width': newSize.width, + 'height': newSize.height + } + }; + emitter.emit(CommonConstants.innerEventWH, eventWHData); }); } catch (err) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, `getMainWindow failed, code is ${err.code}, message is ${err.message}`); } + windowStage.loadContent('pages/Index', (err, data) => { if (err.code) { hilog.error(CommonConstants.LOG_DOMAIN, TAG, 'Failed to load the content. Cause: %{public}s', @@ -72,6 +64,16 @@ export default class EntryAbility extends UIAbility { } hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? ''); + try { + let windowClass: window.Window = windowStage.getMainWindowSync(); + windowClass.setWindowLayoutFullScreen(true).catch(() => { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `setWindowLayoutFullScreen failed, code is ${err.code}, message is ${err.message}`); + }); + } catch (err) { + hilog.error(CommonConstants.LOG_DOMAIN, TAG, + `getMainWindowSync failed, code is ${err.code}, message is ${err.message}`); + } }); } diff --git a/entry/src/main/ets/pages/Index.ets b/entry/src/main/ets/pages/Index.ets index eb581110dfbb861f8b94718ebcbb5635aa1d36ac..a010e48434b9573aef7df4efec3fc47eedffa325 100644 --- a/entry/src/main/ets/pages/Index.ets +++ b/entry/src/main/ets/pages/Index.ets @@ -60,9 +60,11 @@ struct Index { @State windowWidth: number = 300; @State windowHeight: number = 300; @State isCalcWHFinished: boolean = false; - @StorageLink('videoName') videoName: Resource = $r('app.string.video_res_1'); - @StorageLink('videoIndex') videoIndex: number = 0; - @StorageLink('videoScaleType') videoScaleType: number = 0; + @Provide videoScaleType: number = media.VideoScaleType.VIDEO_SCALE_TYPE_FIT; + @Provide speedName: Resource = $r('app.string.video_speed_1_0X'); + @Provide speedIndex: number = 0; + @Provide isMuted: boolean = false; + @Provide currentLanguageType: number = 0; private surfaceId: string = ''; private timeout: number = 0; // Timer ID private volumeTimeout: number = 0; // VolumeTimer ID @@ -167,12 +169,12 @@ struct Index { } onSpeedSelectUpdate() { - AppStorage.setOrCreate('speedName', this.speedList[this.speedSelect]); - AppStorage.setOrCreate('speedIndex', this.speedSelect); + this.speedName = this.speedList[this.speedSelect] + this.speedIndex = this.speedSelect } onVolumeUpdate() { - AppStorage.setOrCreate('isMuted', this.volume <= 0.0); + this.isMuted = this.volume <= 0.0 this.avPlayerController.videoMuted(this.volume <= 0.0); } @@ -238,7 +240,7 @@ struct Index { .fontFamily('Sans') } .width('100%') - .position({ x: $r('app.float.size_zero'), y: $r('app.float.size_210') }) + .position({ x: $r('app.float.size_zero'), y: $r('app.float.size_216') }) .zIndex(1) // [End currentCaptionText] @@ -256,7 +258,6 @@ struct Index { curVolume = curVolume >= 15.0 ? 15.0 : curVolume; curVolume = curVolume <= 0.0 ? 0.0 : curVolume; this.volume = curVolume; - hilog.info(CommonConstants.LOG_DOMAIN, TAG, 'AVPlayManage', 'AVPlayer', `this volumn is: ` + this.volume); }) .onActionEnd(() => { this.setVolumeTimer(); @@ -268,13 +269,13 @@ struct Index { .id('Video') .justifyContent(FlexAlign.Center) - Text() - .height(`${this.surfaceH}px`) - .width(`${this.surfaceW}px`) - .margin({ top: $r('app.float.size_80') }) - .backgroundColor(Color.Black) - .opacity($r('app.float.size_zero_five')) - .visibility(this.isSwiping ? Visibility.Visible : Visibility.Hidden) + // Text() + // .height(`${this.surfaceH}px`) + // .width(`${this.surfaceW}px`) + // .margin({ top: $r('app.float.size_80') }) + // .backgroundColor(Color.Black) + // .opacity($r('app.float.size_zero_five')) + // .visibility(this.isSwiping ? Visibility.Visible : Visibility.Hidden) Row() { Text(timeConvert(this.currentTime)) @@ -286,7 +287,13 @@ struct Index { .opacity($r('app.float.size_1')) .fontColor(Color.White) } + .height($r('app.float.size_50')) + .backgroundColor('#90000000') + .borderRadius(10) + .alignItems(VerticalAlign.Center) + .justifyContent(FlexAlign.Center) .margin({ top: $r('app.float.size_80') }) + .padding({ left: $r('app.float.size_15'), right: $r('app.float.size_15') }) .visibility(this.isSwiping ? Visibility.Visible : Visibility.Hidden) Column() { @@ -344,6 +351,6 @@ struct Index { .backgroundColor(Color.Black) .height('100%') .width('100%') - .padding({ top: '36vp', bottom: '28vp' }) + .padding({ top: '36vp' }) } } \ No newline at end of file diff --git a/entry/src/main/ets/views/LanguageDialog.ets b/entry/src/main/ets/views/LanguageDialog.ets index 9fe6e4a1a385389e381724296401bf2b662e057e..db61dacdc6f55da5d7d1a391eebf9c8470525f37 100644 --- a/entry/src/main/ets/views/LanguageDialog.ets +++ b/entry/src/main/ets/views/LanguageDialog.ets @@ -26,11 +26,12 @@ export struct LanguageDialog { @State languageList: Resource[] = [$r('app.string.Chinese'), $r('app.string.English')]; @Link @Watch('onLanguageSelectUpdate') languageSelect: number; // Index of the current selection + @Consume currentLanguageType: number; @StorageLink('avPlayerController') avPlayerController: AvPlayerController = new AvPlayerController(); private controller: CustomDialogController; onLanguageSelectUpdate() { - AppStorage.setOrCreate('currentLanguageType', this.languageSelect); + this.currentLanguageType = this.languageSelect; } build() { @@ -39,7 +40,7 @@ export struct LanguageDialog { .fontSize($r('app.float.size_20')) .fontWeight(FontWeight.Bold) .width('90%') - .fontColor(Color.Black) + .fontColor($r('app.color.dialog_title_color')) .textAlign(TextAlign.Center) .margin({ top: $r('app.float.size_20'), bottom: $r('app.float.size_12') }) @@ -50,27 +51,22 @@ export struct LanguageDialog { Column() { Row() { Text(item) - // DocsDot - // [StartExclude text_style2] + // [StartExclude video_language_dialog] .fontSize($r('app.float.size_16')) - .fontColor(Color.Black) + .fontColor($r('app.color.dialog_text_color')) .fontWeight(FontWeight.Medium) .textAlign(TextAlign.Center) - // [EndExclude text_style2] - // DocsDot + // [EndExclude video_language_dialog] Blank() Image(this.languageSelect === index ? $r('app.media.ic_radio_selected') : $r('app.media.ic_radio')) - // DocsDot - // [StartExclude text_style3] + // [StartExclude video_language_dialog] .width($r('app.float.size_24')) .height($r('app.float.size_24')) .objectFit(ImageFit.Contain) - // [EndExclude text_style3] - // DocsDot + // [EndExclude video_language_dialog] } - // DocsDot - // [StartExclude text_style4] + // [StartExclude video_language_dialog] .width('100%') if (index != this.languageList.length - ONE) { @@ -81,8 +77,7 @@ export struct LanguageDialog { .color($r('app.color.speed_dialog')) .width('100%') } - // [EndExclude text_style4] - // DocsDot + // [EndExclude video_language_dialog] } .width('90%') } @@ -98,15 +93,16 @@ export struct LanguageDialog { // [End video_language_dialog] .width('100%') - .height('192vp') + .height('auto') .margin({ - top: $r('app.float.size_12') + top: $r('app.float.size_12'), + bottom: $r('app.float.size_15') }) Row() { Text($r('app.string.dialog_cancel')) .fontSize($r('app.float.size_16')) - .fontColor('#0A59F7') + .fontColor($r('app.color.dialog_cancel_color')) .fontWeight(FontWeight.Medium) .layoutWeight(1) .textAlign(TextAlign.Center) @@ -124,7 +120,6 @@ export struct LanguageDialog { .width('100%') .margin({ left: $r('app.float.size_16'), right: $r('app.float.size_16') }) .borderRadius($r('app.float.size_24')) - .backgroundColor(Color.White) - + .backgroundColor($r('app.color.dialog_background_color')) } } \ No newline at end of file diff --git a/entry/src/main/ets/views/ScaleDialog.ets b/entry/src/main/ets/views/ScaleDialog.ets index 91ff6a7230e9f7f24ac5fc63aab875a7d1ffced4..36795b280c0b4e81ca83e28fae01f1a5f1b1ef5a 100644 --- a/entry/src/main/ets/views/ScaleDialog.ets +++ b/entry/src/main/ets/views/ScaleDialog.ets @@ -29,9 +29,10 @@ export struct ScaleDialog { @Link @Watch('onWindowScaleSelectUpdate') windowScaleSelect: number; // Index of the current selection @StorageLink('avPlayerController') avPlayerController: AvPlayerController = new AvPlayerController(); private controller: CustomDialogController; + @Consume videoScaleType: number; onWindowScaleSelectUpdate() { - AppStorage.setOrCreate('videoScaleType', this.windowScaleSelect); + this.videoScaleType = this.windowScaleSelect } build() { @@ -40,7 +41,7 @@ export struct ScaleDialog { .fontSize($r('app.float.size_20')) .fontWeight(FontWeight.Bold) .width('90%') - .fontColor(Color.Black) + .fontColor($r('app.color.dialog_title_color')) .textAlign(TextAlign.Center) .margin({ top: $r('app.float.size_20'), bottom: $r('app.float.size_12') }) // [Start window_scale_dialog] @@ -50,28 +51,24 @@ export struct ScaleDialog { Column() { Row() { Text(item) - // DocsDot - // [StartExclude text_style2] + // [StartExclude window_scale_dialog] .fontSize($r('app.float.size_16')) - .fontColor(Color.Black) + .fontColor($r('app.color.dialog_text_color')) .fontWeight(FontWeight.Medium) .textAlign(TextAlign.Center) - // [EndExclude text_style2] - // DocsDot + // [EndExclude window_scale_dialog] Blank() Image(this.windowScaleSelect === index ? $r('app.media.ic_radio_selected') : - $r('app.media.ic_radio')) - // DocsDot - // [StartExclude text_style3] + $r('app.media.ic_radio')) + // [StartExclude window_scale_dialog] .width($r('app.float.size_24')) .height($r('app.float.size_24')) .objectFit(ImageFit.Contain) - // [EndExclude text_style3] - // DocsDot + // [EndExclude window_scale_dialog] } - // DocsDot - // [StartExclude text_style4] + // [StartExclude window_scale_dialog] .width('100%') + if (index != this.scaleList.length - ONE) { Divider() .vertical(false) @@ -80,8 +77,7 @@ export struct ScaleDialog { .color($r('app.color.speed_dialog')) .width('100%') } - // [EndExclude text_style4] - // DocsDot + // [EndExclude window_scale_dialog] } .width('90%') } @@ -105,15 +101,16 @@ export struct ScaleDialog { } // [End window_scale_dialog] .width('100%') - .height('192vp') + .height('auto') .margin({ - top: $r('app.float.size_12') + top: $r('app.float.size_12'), + bottom: $r('app.float.size_15') }) Row() { Text($r('app.string.dialog_cancel')) .fontSize($r('app.float.size_16')) - .fontColor($r('app.color.scale_font_color')) + .fontColor($r('app.color.dialog_cancel_color')) .fontWeight(FontWeight.Medium) .layoutWeight(1) .textAlign(TextAlign.Center) @@ -130,7 +127,7 @@ export struct ScaleDialog { .width('100%') .margin({ left: $r('app.float.size_16'), right: $r('app.float.size_16') }) .borderRadius($r('app.float.size_24')) - .backgroundColor(Color.White) + .backgroundColor($r('app.color.dialog_background_color')) } } \ No newline at end of file diff --git a/entry/src/main/ets/views/SetVolume.ets b/entry/src/main/ets/views/SetVolume.ets index 3d779ab719bbe8c176aed6a750f8e0533607537c..2f8d22d9941ad39f3d815af618b235113df92b2d 100644 --- a/entry/src/main/ets/views/SetVolume.ets +++ b/entry/src/main/ets/views/SetVolume.ets @@ -28,7 +28,7 @@ export struct SetVolume { volumeParameter: { position: { x: 50, - y: 900 + y: 1000 } } }) diff --git a/entry/src/main/ets/views/SpeedDialog.ets b/entry/src/main/ets/views/SpeedDialog.ets index a97c3d59793efb76238b06aa9c2b8ce0ae141861..3bbb38c60366f10c78303daaa00424c279f63413 100644 --- a/entry/src/main/ets/views/SpeedDialog.ets +++ b/entry/src/main/ets/views/SpeedDialog.ets @@ -30,12 +30,14 @@ export struct SpeedDialog { [$r('app.string.video_speed_1_0X'), $r('app.string.video_speed_1_25X'), $r('app.string.video_speed_1_75X'), $r('app.string.video_speed_2_0X')]; @Link @Watch('onSpeedSelectUpdate') speedSelect: number; // Index of the current selection + @Consume speedName: Resource; + @Consume speedIndex: number; @StorageLink('avPlayerController') avPlayerController: AvPlayerController = new AvPlayerController(); private controller: CustomDialogController; onSpeedSelectUpdate() { - AppStorage.setOrCreate('speedName', this.speedList[this.speedSelect]); - AppStorage.setOrCreate('speedIndex', this.speedSelect); + this.speedName = this.speedList[this.speedSelect] + this.speedIndex = this.speedSelect } build() { @@ -44,7 +46,7 @@ export struct SpeedDialog { .fontSize($r('app.float.size_20')) .fontWeight(FontWeight.Bold) .width('90%') - .fontColor(Color.Black) + .fontColor($r('app.color.dialog_title_color')) .textAlign(TextAlign.Center) .margin({ top: $r('app.float.size_20'), bottom: $r('app.float.size_12') }) @@ -55,27 +57,22 @@ export struct SpeedDialog { Column() { Row() { Text(item) - // DocsDot - // [StartExclude text_style2] + // [StartExclude video_speed_dialog] .fontSize($r('app.float.size_16')) - .fontColor(Color.Black) + .fontColor($r('app.color.dialog_text_color')) .fontWeight(FontWeight.Medium) .textAlign(TextAlign.Center) - // [EndExclude text_style2] - // DocsDot + // [EndExclude video_speed_dialog] Blank() Image(this.speedSelect === index ? $r('app.media.ic_radio_selected') : $r('app.media.ic_radio')) - // DocsDot - // [StartExclude text_style3] + // [StartExclude video_speed_dialog] .width($r('app.float.size_24')) .height($r('app.float.size_24')) .objectFit(ImageFit.Contain) - // [EndExclude text_style3] - // DocsDot + // [EndExclude video_speed_dialog] } - // DocsDot - // [StartExclude text_style4] + // [StartExclude video_speed_dialog] .width('100%') if (index != this.speedList.length - ONE) { @@ -86,8 +83,7 @@ export struct SpeedDialog { .color($r('app.color.speed_dialog')) .width('100%') } - // [EndExclude text_style4] - // DocsDot + // [EndExclude video_speed_dialog] } .width('90%') } @@ -125,7 +121,7 @@ export struct SpeedDialog { Row() { Text($r('app.string.dialog_cancel')) .fontSize($r('app.float.size_16')) - .fontColor('#0A59F7') + .fontColor($r('app.color.dialog_cancel_color')) .fontWeight(FontWeight.Medium) .layoutWeight(1) .textAlign(TextAlign.Center) @@ -142,7 +138,7 @@ export struct SpeedDialog { .width('100%') .margin({ left: $r('app.float.size_16'), right: $r('app.float.size_16') }) .borderRadius($r('app.float.size_24')) - .backgroundColor(Color.White) + .backgroundColor($r('app.color.dialog_background_color')) } } \ No newline at end of file diff --git a/entry/src/main/ets/views/VideoOperate.ets b/entry/src/main/ets/views/VideoOperate.ets index 715b82198bb968ae0366c0379d6be591b70775c4..dc14a4bc129ff67127188af436e2c25c4012d4ba 100644 --- a/entry/src/main/ets/views/VideoOperate.ets +++ b/entry/src/main/ets/views/VideoOperate.ets @@ -13,7 +13,6 @@ * limitations under the License. */ -import { media } from '@kit.MediaKit'; import { timeConvert } from '../common/utils/TimeUtils'; import { AvPlayerController } from '../controller/AvPlayerController'; import { SpeedDialog } from './SpeedDialog'; @@ -31,26 +30,26 @@ export struct VideoOperate { @Link avPlayerController: AvPlayerController @Link flag: boolean; // Play/Pause @Link XComponentFlag: boolean; - @StorageLink('speedIndex') speedIndex: number = 0; // Index of the playback rate list. + @Consume speedIndex: number; // Index of the playback rate list. + @Consume speedName: Resource; + @Consume videoScaleType: number; + @Consume isMuted: boolean; @StorageLink('sliderWidth') sliderWidth: string = ''; - @StorageLink('speedName') speedName: Resource = $r('app.string.video_speed_1_0X'); - @StorageLink('isMuted') isMuted: boolean = false; - @StorageLink('videoScaleType') videoScaleType: number = media.VideoScaleType.VIDEO_SCALE_TYPE_FIT; - @StorageLink('currentLanguageType') currentLanguageType: number = 0; + @Consume currentLanguageType: number; private dialogController: CustomDialogController = new CustomDialogController({ builder: SpeedDialog({ speedSelect: $speedSelect }), alignment: DialogAlignment.Center, - offset: { dx: $r('app.float.size_zero'), dy: $r('app.float.size_down_20') } + offset: { dx: $r('app.float.size_zero'), dy: $r('app.float.size_down_4') } }); private scaleDialogController: CustomDialogController = new CustomDialogController({ builder: ScaleDialog({ windowScaleSelect: $windowScaleSelect }), alignment: DialogAlignment.Center, - offset: { dx: $r('app.float.size_zero'), dy: $r('app.float.size_down_20') } + offset: { dx: $r('app.float.size_zero'), dy: $r('app.float.size_down_4') } }); private languageDialogController: CustomDialogController = new CustomDialogController({ builder: LanguageDialog({ languageSelect: $languageSelect }), alignment: DialogAlignment.Center, - offset: { dx: $r('app.float.size_zero'), dy: $r('app.float.size_down_20') } + offset: { dx: $r('app.float.size_zero'), dy: $r('app.float.size_down_4') } }); build() { @@ -206,7 +205,7 @@ export struct VideoOperate { } } .justifyContent(FlexAlign.Center) - .padding({ left: $r('app.float.size_12'), right: $r('app.float.size_20') }) + .padding({ left: $r('app.float.size_12'), right: $r('app.float.size_20'), bottom: '28vp' }) .width('100%') } } diff --git a/entry/src/main/resources/base/element/color.json b/entry/src/main/resources/base/element/color.json index 07787b20afa5a0d303a4bbf57b2311bdca980031..acb78736989ebdf3b055423901462fd4fb76d955 100644 --- a/entry/src/main/resources/base/element/color.json +++ b/entry/src/main/resources/base/element/color.json @@ -6,7 +6,7 @@ }, { "name": "slider_selected", - "value": "#007DFF" + "value": "#317af7" }, { "name": "speed_dialog", @@ -27,6 +27,22 @@ { "name": "scale_font_color", "value": "#0A59F7" + }, + { + "name": "dialog_title_color", + "value": "#e5ffffff" + }, + { + "name": "dialog_text_color", + "value": "#99ffffff" + }, + { + "name": "dialog_cancel_color", + "value": "#317af7" + }, + { + "name": "dialog_background_color", + "value": "#ff202224" } ] } \ No newline at end of file diff --git a/entry/src/main/resources/base/element/float.json b/entry/src/main/resources/base/element/float.json index 5006bd8c2403b0d94091f881fdf27e71e4624fd8..c7d9b4441923cefd3409af78bad00b2930a2f180 100644 --- a/entry/src/main/resources/base/element/float.json +++ b/entry/src/main/resources/base/element/float.json @@ -49,8 +49,8 @@ "value": "20" }, { - "name": "size_down_20", - "value": "-20" + "name": "size_down_4", + "value": "-4" }, { "name": "size_down_80", @@ -105,8 +105,12 @@ "value": "-80" }, { - "name": "size_210", - "value": "210" + "name": "size_120", + "value": "120" + }, + { + "name": "size_216", + "value": "216" }, { "name": "size_254", diff --git a/entry/src/main/resources/base/media/ic_radio_selected.svg b/entry/src/main/resources/base/media/ic_radio_selected.svg index f115d62baa097b60a6b7764edd5ea81295cb12d4..36314afefe2174bd3daf3b639e2b5466db2d24a4 100644 --- a/entry/src/main/resources/base/media/ic_radio_selected.svg +++ b/entry/src/main/resources/base/media/ic_radio_selected.svg @@ -5,7 +5,7 @@ - + diff --git a/entry/src/main/resources/base/media/ic_video_window_scale.svg b/entry/src/main/resources/base/media/ic_video_window_scale.svg index 67eef9e155a46b5541a1fbced2ed9084cc55c257..0d57cd40631be025ad68d4c2dbb19d69f7ddbe25 100644 --- a/entry/src/main/resources/base/media/ic_video_window_scale.svg +++ b/entry/src/main/resources/base/media/ic_video_window_scale.svg @@ -1,2 +1,26 @@ - - \ No newline at end of file + + + Created with Pixso. + + + + + + + + + + + + + + + + + + + + + + + diff --git a/screenshots/devices/pause.png b/screenshots/devices/pause.png index 86813701956bc38e2c419b398fb3b7ee6a4d2703..5ef2153df92b8c8ac1501738ede3dcf7dacbde90 100644 Binary files a/screenshots/devices/pause.png and b/screenshots/devices/pause.png differ diff --git a/screenshots/devices/playing.png b/screenshots/devices/playing.png index ed81fd38eb1d70d89c46ab5949cb6404f596aa03..a595babaaec359a4bf78eb0fc2392c749f5d721b 100644 Binary files a/screenshots/devices/playing.png and b/screenshots/devices/playing.png differ diff --git a/screenshots/devices/scale_fit.png b/screenshots/devices/scale_fit.png index 67b8a911244de0e2344b2ac587dffe03466fa275..63789bb34b2859e5808475f3c35358e8ff789072 100644 Binary files a/screenshots/devices/scale_fit.png and b/screenshots/devices/scale_fit.png differ diff --git a/screenshots/devices/set_media_muted.png b/screenshots/devices/set_media_muted.png index a4a94bc62cbe343948dd686d73e937525a004821..03316ed146758e35f486bbe2e7cd164909f332aa 100644 Binary files a/screenshots/devices/set_media_muted.png and b/screenshots/devices/set_media_muted.png differ diff --git a/screenshots/devices/set_volume.png b/screenshots/devices/set_volume.png index c11e3f332a78c94df518552da031d975d406fa2b..9a3126a4953f74938859d1a315731c7057f132c4 100644 Binary files a/screenshots/devices/set_volume.png and b/screenshots/devices/set_volume.png differ diff --git a/screenshots/devices/speed_dialog.png b/screenshots/devices/speed_dialog.png index 9845b501bcd6b66f3013b14438666e66a085b6ac..e8c995194f675447966eebe1ff3c1c8f1d743925 100644 Binary files a/screenshots/devices/speed_dialog.png and b/screenshots/devices/speed_dialog.png differ