早晚报 音频图文对话框 回调后暂停失效TODO

@@ -7,7 +7,7 @@ import { MorningEveningViewModel } from '../../viewmodel/MorningEveningViewModel
 import { PaperTitleComponent } from './PaperTitleComponent';
 import { PaperTitleComponent } from './PaperTitleComponent';
 import { SingleColumn999Component } from './SingleColumn999Component';
 import { SingleColumn999Component } from './SingleColumn999Component';
 import { topicInfoView } from './topicInfoView';
 import { topicInfoView } from './topicInfoView';
-import { WDPlayerController } from 'wdPlayer';
+import { PlayerConstants, WDPlayerController } from 'wdPlayer';
 
 
 const TAG = 'MorningEveningPaperComponent';
 const TAG = 'MorningEveningPaperComponent';
 
 
@@ -40,16 +40,33 @@ export struct MorningEveningPaperComponent {
   @Provide title: string = ''
   @Provide title: string = ''
   @Provide subTitle: string = ''
   @Provide subTitle: string = ''
   @Provide isAudioPlaying: boolean = false
   @Provide isAudioPlaying: boolean = false
+  @Provide status: number = PlayerConstants.STATUS_START;
   private playerController: WDPlayerController = new WDPlayerController();
   private playerController: WDPlayerController = new WDPlayerController();
-  private xComponentController: XComponentController = new XComponentController();
   simpleAudioDialog: CustomDialogController = new CustomDialogController({
   simpleAudioDialog: CustomDialogController = new CustomDialogController({
-    builder: PaperReaderSimpleDialog(),
+    builder: PaperReaderSimpleDialog({
+      cancel: this.onCancel,
+      confirm: this.onConfirm
+    }),
     autoCancel: false,
     autoCancel: false,
     customStyle: true,
     customStyle: true,
     alignment: DialogAlignment.CenterStart,
     alignment: DialogAlignment.CenterStart,
-    offset: { dx: 12, dy: -150 }
+    offset: { dx: 12, dy: -150 },
+
   })
   })
 
 
+  onCancel() {
+    Logger.info(TAG, "cj2024 onCancel = ")
+  }
+
+  onConfirm() {
+    Logger.info(TAG, "cj2024 onConfirm = ")
+    // if (this.playerController != undefined) {
+    //
+    // }
+    this.status = PlayerConstants.STATUS_PAUSE;
+    this.playerController?.pause()
+  }
+
   async aboutToAppear() {
   async aboutToAppear() {
     console.info(TAG, `aboutToAppear`)
     console.info(TAG, `aboutToAppear`)
 
 
@@ -84,6 +101,11 @@ export struct MorningEveningPaperComponent {
     }
     }
   }
   }
 
 
+  onPageHide() {
+    this.status = PlayerConstants.STATUS_PAUSE;
+    this.playerController?.pause();
+  }
+
   build() {
   build() {
     Stack({ alignContent: Alignment.Top }) {
     Stack({ alignContent: Alignment.Top }) {
       List() {
       List() {

 /**
 /**
  * 简易音频对话框
  * 简易音频对话框
  * */
  * */
+
 @CustomDialog
 @CustomDialog
 export struct PaperReaderSimpleDialog {
 export struct PaperReaderSimpleDialog {
-  private controllerSimple?: CustomDialogController;
+  cancel: () => void = () => {
+  }
+  confirm: () => void = () => {
+  }
+  paperReaderDialog: CustomDialogController = new CustomDialogController({
+    builder: PaperReaderDialog({
+      onCancel: this.cancel,
+      onConfirm: this.confirm
+    }),
+    autoCancel: false,
+    customStyle: true,
+    alignment: DialogAlignment.CenterStart,
+    offset: { dx: 12, dy: -150 }
+  })
+  controllerSimple?: CustomDialogController // // 若尝试在CustomDialog中传入多个其他的Controller，以实现在CustomDialog中打开另一个或另一些CustomDialog，那么此处需要将指向自己的controller放在所有controller的后面
 
 
   build() {
   build() {
     Row() {
     Row() {
@@ -19,6 +34,18 @@ export struct PaperReaderSimpleDialog {
     .onClick(() => {
     .onClick(() => {
       if (this.controllerSimple) {
       if (this.controllerSimple) {
         this.controllerSimple.close()
         this.controllerSimple.close()
+        this.paperReaderDialog.open()
+        if (this.paperReaderDialog) {
+          setTimeout(() => {
+            console.log('PaperReaderSimpleDialog delay 1s');
+            if (this.paperReaderDialog != undefined) {
+              this.paperReaderDialog.close()
+            }
+            if (this.controllerSimple != undefined) {
+              this.controllerSimple.open()
+            }
+          }, 100000);
+        }
       }
       }
 
 
     })
     })
@@ -32,13 +59,17 @@ export struct PaperReaderSimpleDialog {
 @CustomDialog
 @CustomDialog
 export struct PaperReaderDialog {
 export struct PaperReaderDialog {
   controllerDetail?: CustomDialogController
   controllerDetail?: CustomDialogController
+  onCancel: () => void = () => {
+  }
+  onConfirm: () => void = () => {
+  }
 
 
   build() {
   build() {
-    Stack() {
+    Stack({ alignContent: Alignment.End }) {
       Column() { //标题 时间 进度条
       Column() { //标题 时间 进度条
         Marquee({
         Marquee({
           start: true,
           start: true,
-          step: 50,
+          step: 5,
           loop: Number.POSITIVE_INFINITY,
           loop: Number.POSITIVE_INFINITY,
           fromStart: true,
           fromStart: true,
           src: "Running Marquee starts rolling"
           src: "Running Marquee starts rolling"
@@ -47,7 +78,8 @@ export struct PaperReaderDialog {
           .height(20)
           .height(20)
           .fontColor($r("app.color.color_222222"))
           .fontColor($r("app.color.color_222222"))
           .fontSize(14)
           .fontSize(14)
-          .margin({ top: 10 })
+          .margin({ top: 10, left: 10 })
+          .alignSelf(ItemAlign.Start)
           .onStart(() => {
           .onStart(() => {
             console.info('Marquee animation complete onStart')
             console.info('Marquee animation complete onStart')
           })
           })
@@ -62,45 +94,58 @@ export struct PaperReaderDialog {
           Text("00:00")
           Text("00:00")
             .fontSize($r('app.float.font_size_12'))
             .fontSize($r('app.float.font_size_12'))
             .fontColor($r('app.color.color_999999'))
             .fontColor($r('app.color.color_999999'))
-            .width("49%")
             .height("100%")
             .height("100%")
+            .alignSelf(ItemAlign.Start)
           Text("/00:00")
           Text("/00:00")
             .fontSize($r('app.float.font_size_12'))
             .fontSize($r('app.float.font_size_12'))
             .fontColor($r('app.color.color_999999'))
             .fontColor($r('app.color.color_999999'))
-            .width("51%")
             .height("100%")
             .height("100%")
+            .alignSelf(ItemAlign.Start)
 
 
         }
         }
         .width("100%")
         .width("100%")
         .height(16)
         .height(16)
-        .margin({ top: 4 })
+        .margin({ top: 4, left: 10 })
+
+        Progress({ value: 50, total: 100, type: ProgressType.Capsule })
+          .color($r('app.color.color_ED2800'))
+          .backgroundColor($r('app.color.white'))
+          .width("100%")
+          .height(3)
+          .margin({ top: 7 })
       }
       }
       .width("100%")
       .width("100%")
       .height("100%")
       .height("100%")
+      .justifyContent(FlexAlign.Start)
 
 
-      Progress({ value: 0, total: 100, type: ProgressType.Linear })
-        .color($r('app.color.color_ED2800'))
-        .width("100%")
-        .height(3)
+      Row() {
+        Image($r("app.media.icon_audio_pause"))
+          .objectFit(ImageFit.Contain)
+          .width(24)
+          .height(24)
+          .margin({ right: 12 })
+          .onClick(() => {
+            if (this.controllerDetail) {
+              this.onConfirm()
+            }
+          })
 
 
-      Image($r("app.media.icon_audio_pause"))
-        .objectFit(ImageFit.Auto)
-        .align(Alignment.End)
-        .margin({ right: 12 })
+        Image($r("app.media.icon_audio_close"))
+          .objectFit(ImageFit.Contain)
+          .width(24)
+          .height(24)
+          .onClick(() => {
+            if (this.controllerDetail) {
+              this.controllerDetail.close()
+            }
+          })
+      }.width(80)
+      .height(60)
 
 
-      Image($r("app.media.icon_audio_close"))
-        .objectFit(ImageFit.Auto)
-        .align(Alignment.End)
-        .margin({ right: 48 })
-        .onClick(() => {
-          if (this.controllerDetail) {
-            this.controllerDetail.close()
-          }
-        })
     }
     }
     .width("65%")
     .width("65%")
     .height(60)
     .height(60)
     .backgroundColor(Color.White)
     .backgroundColor(Color.White)
-    .borderRadius(5)
+    .borderRadius(2)
   }
   }
 }
 }