developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
王士厅
dd97650d 1 parent 5eba3a8f

音频悬浮窗

Inline Side-by-side
Showing 9 changed files with 195 additions and 120 deletions
@@ -43,5 +43,8 @@ export enum EmitterEventId { @@ -43,5 +43,8 @@ export enum EmitterEventId {
43 // 获取音频悬浮窗焦点状态 43 // 获取音频悬浮窗焦点状态
44 AUDIO_WINDOW_TYPE = 12, 44 AUDIO_WINDOW_TYPE = 12,
45 45
  46 + // 展开悬浮窗
  47 + AUDIO_WINDOW_EXPAND = 13,
  48 +
46 } 49 }
47 50
@@ -26,6 +26,7 @@ import { WDShare } from 'wdShare/Index'; @@ -26,6 +26,7 @@ import { WDShare } from 'wdShare/Index';
26 import { AudioSuspensionModel } from '../../viewmodel/AudioSuspensionModel' 26 import { AudioSuspensionModel } from '../../viewmodel/AudioSuspensionModel'
27 import { EmitterEventId, EmitterUtils } from 'wdKit/Index' 27 import { EmitterEventId, EmitterUtils } from 'wdKit/Index'
28 import { PlayerConstants } from 'wdPlayer' 28 import { PlayerConstants } from 'wdPlayer'
  29 +import { LottieView } from '../lottie/LottieView'
29 30
30 const TAG = 'OperRowListView'; 31 const TAG = 'OperRowListView';
31 32
@@ -78,8 +79,9 @@ export struct OperRowListView { @@ -78,8 +79,9 @@ export struct OperRowListView {
78 @State audioUrl: string = '' 79 @State audioUrl: string = ''
79 @State audioTitle: string = '' 80 @State audioTitle: string = ''
80 @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0 81 @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
81 - // private AudioSuspension = new AudioSuspensionModel() 82 + private AudioSuspension = new AudioSuspensionModel()
82 @State currentStatus: number | string | undefined = 0; 83 @State currentStatus: number | string | undefined = 0;
  84 + @State name: string = 'audio_recommend_status_wait'
83 85
84 async aboutToAppear() { 86 async aboutToAppear() {
85 console.info(TAG, '22222----', this.styleType) 87 console.info(TAG, '22222----', this.styleType)
@@ -284,16 +286,36 @@ export struct OperRowListView { @@ -284,16 +286,36 @@ export struct OperRowListView {
284 @Builder 286 @Builder
285 builderListen() { 287 builderListen() {
286 Column() { 288 Column() {
287 - Image(this.currentStatus === PlayerConstants.STATUS_START ? $r("app.media.icon_audio_pause") :  
288 - $r("app.media.icon_listen"))  
289 - .width(24)  
290 - .height(24)  
291 - .aspectRatio(1)  
292 - .interpolation(ImageInterpolation.High)  
293 - .onClick((event: ClickEvent) => {  
294 - // this.AudioSuspension.setPlayerUrl(this.audioUrl, this.audioTitle)  
295 - // ToastUtils.showToast('音频为公共方法，待开发', 1000);  
296 - }) 289 + if(this.currentStatus === PlayerConstants.STATUS_START) {
  290 + Column() {
  291 + LottieView({
  292 + name: this.name,
  293 + path: "lottie/audio_recommend_playing.json",
  294 + lottieWidth: 24,
  295 + lottieHeight: 24,
  296 + autoplay: true,
  297 + loop: true
  298 + })
  299 + }
  300 + .width(25)
  301 + .height(25)
  302 + .parallelGesture(
  303 + TapGesture()
  304 + .onAction((event: GestureEvent) => {
  305 + this.AudioSuspension.setPlayerUrl(this.audioUrl, this.audioTitle)
  306 + }))
  307 + } else {
  308 + Image($r("app.media.icon_listen"))
  309 + .width(24)
  310 + .height(24)
  311 + .aspectRatio(1)
  312 + .interpolation(ImageInterpolation.High)
  313 + .gesture(
  314 + TapGesture()
  315 + .onAction((event: GestureEvent) => {
  316 + this.AudioSuspension.setPlayerUrl(this.audioUrl, this.audioTitle)
  317 + }))
  318 + }
297 } 319 }
298 .height(36) 320 .height(36)
299 .width(48) 321 .width(48)
@@ -14,8 +14,10 @@ export class AudioSuspensionModel { @@ -14,8 +14,10 @@ export class AudioSuspensionModel {
14 public floatWindowClass: SubscribedAbstractProperty<window.Window> = AppStorage.link<window.Window>('floatWindowClass') 14 public floatWindowClass: SubscribedAbstractProperty<window.Window> = AppStorage.link<window.Window>('floatWindowClass')
15 public srcTitle: string = '' 15 public srcTitle: string = ''
16 private url: string = '' 16 private url: string = ''
17 - private expandWidth: number = 800  
18 - private expandHeight: number = 200 17 + private expandWidth: number = vp2px(243)
  18 + private expandHeight: number = vp2px(60)
  19 + // 窗口是否最小化
  20 + private isMinimize: SubscribedAbstractProperty<boolean> = AppStorage.link<boolean>('isMinimize')
19 constructor() { 21 constructor() {
20 this.initPlayerController() 22 this.initPlayerController()
21 } 23 }
@@ -29,7 +31,7 @@ export class AudioSuspensionModel { @@ -29,7 +31,7 @@ export class AudioSuspensionModel {
29 this.playerController = AppStorage.link<WDPlayerController>('playerController') 31 this.playerController = AppStorage.link<WDPlayerController>('playerController')
30 Logger.info(TAG, 'playerController create success') 32 Logger.info(TAG, 'playerController create success')
31 this.playerController.get().onStatusChange = (status: number) => { 33 this.playerController.get().onStatusChange = (status: number) => {
32 - console.info(TAG, 'this.currentStatus', status) 34 + console.info(TAG, 'this.currentStatus Model', status)
33 EmitterUtils.sendEvent(EmitterEventId.AUDIO_CHANGE_STATUS, status) 35 EmitterUtils.sendEvent(EmitterEventId.AUDIO_CHANGE_STATUS, status)
34 } 36 }
35 } else { 37 } else {
@@ -43,6 +45,12 @@ export class AudioSuspensionModel { @@ -43,6 +45,12 @@ export class AudioSuspensionModel {
43 // console.log(TAG,'this.url', this.url) 45 // console.log(TAG,'this.url', this.url)
44 // console.log(TAG,'url', url) 46 // console.log(TAG,'url', url)
45 if (this.url === url) { 47 if (this.url === url) {
  48 + this.isMinimize = AppStorage.link<boolean>('isMinimize')
  49 + console.log(TAG, 'this.isMinimize', this.isMinimize?.get())
  50 + if (this.isMinimize?.get()) {
  51 + EmitterUtils.sendEvent(EmitterEventId.AUDIO_WINDOW_EXPAND, 1)
  52 + AppStorage.setOrCreate('isMinimize', false);
  53 + }
46 this.playerController.get().switchPlayOrPause() 54 this.playerController.get().switchPlayOrPause()
47 } else { 55 } else {
48 this.url = url 56 this.url = url
@@ -52,7 +60,6 @@ export class AudioSuspensionModel { @@ -52,7 +60,6 @@ export class AudioSuspensionModel {
52 } 60 }
53 this.srcTitle = srcTitle 61 this.srcTitle = srcTitle
54 EmitterUtils.sendEvent(EmitterEventId.AUDIO_CHANGE_TITLe, this.srcTitle) 62 EmitterUtils.sendEvent(EmitterEventId.AUDIO_CHANGE_TITLe, this.srcTitle)
55 - console.log(TAG, 'handlePlayer')  
56 this.resizeWindow(this.expandWidth, this.expandHeight) 63 this.resizeWindow(this.expandWidth, this.expandHeight)
57 } 64 }
58 this.showWindow() 65 this.showWindow()
@@ -93,16 +100,28 @@ export class AudioSuspensionModel { @@ -93,16 +100,28 @@ export class AudioSuspensionModel {
93 }); 100 });
94 } 101 }
95 102
96 - // 销毁悬浮窗 使用destroy对其进行销毁。  
97 - public destroyWindow() {  
98 - /*this.floatWindowClass.get().destroyWindow((err: BusinessError) => { 103 + public moveWindow(y: number) {
  104 + this.floatWindowClass.get().moveWindowTo(0, vp2px(y), (err: BusinessError) => {
99 let errCode: number = err.code; 105 let errCode: number = err.code;
100 if (errCode) { 106 if (errCode) {
101 - console.error('floatWindowClass Failed to destroy the window. Cause: ' + JSON.stringify(err)); 107 + console.error('floatWindowClass Failed to move the window. Cause:' + JSON.stringify(err));
102 return; 108 return;
103 } 109 }
104 - console.info('floatWindowClass Succeeded in destroying the window.');  
105 - });*/ 110 + console.info('floatWindowClass Succeeded in moving the window.');
  111 + });
  112 + }
  113 +
  114 + // 隐藏悬浮窗
  115 + public minimize() {
  116 + this.floatWindowClass.get().minimize((err: BusinessError) => {
  117 + const errCode: number = err.code;
  118 + if (errCode) {
  119 + console.error(TAG, 'Failed to minimize the window. Cause: ' + JSON.stringify(err));
  120 + return;
  121 + }
  122 + AppStorage.setOrCreate('isMinimize', true);
  123 + console.info(TAG, 'Succeeded in minimizing the window.');
  124 + });
106 } 125 }
107 126
108 127
@@ -7,6 +7,7 @@ @@ -7,6 +7,7 @@
7 "main": "", 7 "main": "",
8 "version": "1.0.0", 8 "version": "1.0.0",
9 "dependencies": { 9 "dependencies": {
  10 + "@ohos/lottie": "2.0.10",
10 "wdComponent": "file:../../features/wdComponent", 11 "wdComponent": "file:../../features/wdComponent",
11 "wdConstant": "file:../../commons/wdConstant", 12 "wdConstant": "file:../../commons/wdConstant",
12 "wdKit": "file:../../commons/wdKit", 13 "wdKit": "file:../../commons/wdKit",
@@ -9,6 +9,7 @@ import { DeviceUtil, EmitterEventId, EmitterUtils, WindowModel } from 'wdKit'; @@ -9,6 +9,7 @@ import { DeviceUtil, EmitterEventId, EmitterUtils, WindowModel } from 'wdKit';
9 import { ConfigurationConstant } from '@kit.AbilityKit'; 9 import { ConfigurationConstant } from '@kit.AbilityKit';
10 import { WDPushNotificationManager } from 'wdHwAbility/Index'; 10 import { WDPushNotificationManager } from 'wdHwAbility/Index';
11 import { StartupManager } from '../startupmanager/StartupManager'; 11 import { StartupManager } from '../startupmanager/StartupManager';
  12 +import { UIContext } from '@ohos.arkui.UIContext';
12 13
13 let floatWindowClass: window.Window | null = null; 14 let floatWindowClass: window.Window | null = null;
14 15
@@ -54,8 +55,8 @@ export default class EntryAbility extends UIAbility { @@ -54,8 +55,8 @@ export default class EntryAbility extends UIAbility {
54 AppStorage.setOrCreate('topSafeHeight', topSafeHeight); 55 AppStorage.setOrCreate('topSafeHeight', topSafeHeight);
55 AppStorage.setOrCreate('windowWidth', width); 56 AppStorage.setOrCreate('windowWidth', width);
56 AppStorage.setOrCreate('windowHeight', height); 57 AppStorage.setOrCreate('windowHeight', height);
57 - let audioWidth = px2vp(width) * 0.65  
58 - console.info('floatWindowClass audioWidth' + audioWidth); 58 + // 音频悬浮窗初始移动位置604为ui高度
  59 + let initMoveY = vp2px(604)
59 60
60 61
61 // 在普通phone/折叠屏/tablet设备上以沉浸式(全屏)启动 62 // 在普通phone/折叠屏/tablet设备上以沉浸式(全屏)启动
@@ -91,58 +92,55 @@ export default class EntryAbility extends UIAbility { @@ -91,58 +92,55 @@ export default class EntryAbility extends UIAbility {
91 hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? ''); 92 hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');
92 }); 93 });
93 // 1.创建悬浮窗 94 // 1.创建悬浮窗
94 - // const config: window.Configuration = {  
95 - // name: "floatWindow", windowType: window.WindowType.TYPE_FLOAT, ctx: this.context  
96 - // };  
97 - // window.createWindow(config, (err: BusinessError, data) => {  
98 - // let errCode: number = err.code;  
99 - // if (errCode) {  
100 - // console.error('floatWindowClass Failed to create the floatWindow. Cause: ' + JSON.stringify(err));  
101 - // return;  
102 - // }  
103 - // console.info('floatWindowClass Succeeded in creating the floatWindow. Data: ' + JSON.stringify(data));  
104 - // floatWindowClass = data;  
105 - // AppStorage.setOrCreate('floatWindowClass', floatWindowClass);  
106 - // // 2.悬浮窗窗口创建成功后，设置悬浮窗的位置、大小及相关属性等。  
107 - // floatWindowClass.moveWindowTo(0, 604, (err: BusinessError) => {  
108 - // let errCode: number = err.code;  
109 - // if (errCode) {  
110 - // console.error('floatWindowClass Failed to move the window. Cause:' + JSON.stringify(err));  
111 - // return;  
112 - // }  
113 - // console.info('floatWindowClass Succeeded in moving the window.');  
114 - // });  
115 - // // 3.为悬浮窗加载对应的目标页面。  
116 - // floatWindowClass.setUIContent("pages/view/AudioComponent", (err: BusinessError) => {  
117 - // let errCode: number = err.code;  
118 - // if (errCode) {  
119 - // console.error('floatWindowClass Failed to load the content. Cause:' + JSON.stringify(err));  
120 - // return;  
121 - // }  
122 - // console.info('floatWindowClass Succeeded in loading the content.');  
123 - // });  
124 - //  
125 - // floatWindowClass.on('windowEvent', (data) => {  
126 - // EmitterUtils.sendEvent(EmitterEventId.AUDIO_WINDOW_TYPE, data)  
127 - // });  
128 - //  
129 - // }); 95 + windowStage.createSubWindow('subWindow', (err: BusinessError, data) => {
  96 + let errCode: number = err.code;
  97 + if (errCode) {
  98 + console.error('floatWindowClass Failed to create the subwindow. Cause: ' + JSON.stringify(err));
  99 + return;
  100 + }
  101 + console.info('floatWindowClass Succeeded in creating the subwindow. Data: ' + JSON.stringify(data));
  102 + floatWindowClass = data;
  103 + AppStorage.setOrCreate('floatWindowClass', floatWindowClass);
  104 + // 2.悬浮窗窗口创建成功后，设置悬浮窗的位置、大小及相关属性等。
  105 + floatWindowClass.moveWindowTo(0, initMoveY, (err: BusinessError) => {
  106 + let errCode: number = err.code;
  107 + if (errCode) {
  108 + console.error('floatWindowClass Failed to move the window. Cause:' + JSON.stringify(err));
  109 + return;
  110 + }
  111 + console.info('floatWindowClass Succeeded in moving the window.');
  112 + });
  113 + // 3.为悬浮窗加载对应的目标页面。
  114 + floatWindowClass.setUIContent("pages/view/AudioComponent", (err: BusinessError) => {
  115 + let errCode: number = err.code;
  116 + if (errCode) {
  117 + console.error('floatWindowClass Failed to load the content. Cause:' + JSON.stringify(err));
  118 + return;
  119 + }
  120 + console.info('floatWindowClass Succeeded in loading the content.');
  121 + });
  122 +
  123 + floatWindowClass.on('windowEvent', (data) => {
  124 + EmitterUtils.sendEvent(EmitterEventId.AUDIO_WINDOW_TYPE, data)
  125 + });
  126 +
  127 + });
130 } 128 }
131 129
132 - // destroyFloatWindow() {  
133 - // (floatWindowClass as window.Window).destroyWindow((err: BusinessError) => {  
134 - // let errCode: number = err.code;  
135 - // if (errCode) {  
136 - // console.error('floatWindowClass Failed to destroy the window. Cause: ' + JSON.stringify(err));  
137 - // return;  
138 - // }  
139 - // console.info('floatWindowClass Succeeded in destroying the window.');  
140 - // });  
141 - // } 130 + destroyFloatWindow() {
  131 + (floatWindowClass as window.Window).destroyWindow((err: BusinessError) => {
  132 + let errCode: number = err.code;
  133 + if (errCode) {
  134 + console.error('floatWindowClass Failed to destroy the window. Cause: ' + JSON.stringify(err));
  135 + return;
  136 + }
  137 + console.info('floatWindowClass Succeeded in destroying the window.');
  138 + });
  139 + }
142 140
143 onWindowStageDestroy(): void { 141 onWindowStageDestroy(): void {
144 // Main window is destroyed, release UI related resources 142 // Main window is destroyed, release UI related resources
145 - // this.destroyFloatWindow() 143 + this.destroyFloatWindow()
146 hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageDestroy'); 144 hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageDestroy');
147 } 145 }
148 146
  1 +{"v":"5.6.10","fr":60,"ip":0,"op":32,"w":120,"h":120,"nm":"播放的","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"“图层 2”轮廓","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[60.375,60,0],"ix":2},"a":{"a":0,"k":[60,60,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":0,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.971,-24.327],[5.075,-19.579],[5.716,-18.514],[5.716,23.545],[4.523,24.745],[-4.523,24.745],[-5.716,23.545],[-5.716,-23.264]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":8,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.902,-39.149],[5.144,-34.4],[5.785,-33.336],[5.785,23.475],[4.592,24.676],[-4.454,24.676],[-5.647,23.475],[-5.647,-38.085]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":16,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.985,-64.591],[5.061,-59.842],[5.702,-58.778],[5.785,23.475],[4.592,24.676],[-4.454,24.676],[-5.647,23.475],[-5.73,-63.527]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":24,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.902,-39.149],[5.144,-34.4],[5.785,-33.336],[5.785,23.475],[4.592,24.676],[-4.454,24.676],[-5.647,23.475],[-5.647,-38.085]],"c":true}]},{"t":32,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.971,-24.327],[5.075,-19.579],[5.716,-18.514],[5.716,23.545],[4.523,24.745],[-4.523,24.745],[-5.716,23.545],[-5.716,-23.264]],"c":true}]}],"ix":2},"nm":"路径 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.929411824544,0.156862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"填充 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[24.216,79.75],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"变换"}],"nm":"组 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":32,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"“图层 3”轮廓","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[60,60,0],"ix":2},"a":{"a":0,"k":[60,60,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":0,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.075,-39.472],[-3.971,-44.221],[-5.715,-43.157],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.715,-38.408]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":8,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.04,-14.722],[-4.006,-19.471],[-5.75,-18.407],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.681,-13.658]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":16,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.096,0.153],[-3.95,-4.596],[-5.694,-3.532],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.737,1.217]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":24,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.083,-14.972],[-3.963,-19.721],[-5.707,-18.657],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.724,-13.908]],"c":true}]},{"t":32,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.057,-40.097],[-3.989,-44.846],[-5.733,-43.782],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.698,-39.033]],"c":true}]}],"ix":2},"nm":"路径 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.929411824544,0.156862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"填充 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[60.249,59.859],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"变换"}],"nm":"组 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":32,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"“图层 4”轮廓","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[60,60,0],"ix":2},"a":{"a":0,"k":[60,60,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":0,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.971,-31.704],[5.075,-26.955],[5.716,-25.891],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.716,-30.64]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":8,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-4.005,-56.954],[5.041,-52.205],[5.682,-51.141],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.75,-55.89]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":16,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.971,-31.704],[5.075,-26.955],[5.716,-25.891],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.716,-30.64]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":24,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-4.005,-16.829],[5.041,-12.08],[5.682,-11.016],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.75,-15.765]],"c":true}]},{"t":32,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.948,-31.954],[5.098,-27.205],[5.739,-26.141],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.693,-30.89]],"c":true}]}],"ix":2},"nm":"路径 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.929411824544,0.156862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"填充 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[95.785,72.379],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"变换"}],"nm":"组 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":32,"st":0,"bm":0}],"markers":[]}
  1 +{"v":"5.6.10","fr":60,"ip":0,"op":32,"w":144,"h":144,"nm":"今日推荐-直播","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":3,"nm":"空 16","sr":1,"ks":{"o":{"a":0,"k":0,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[72,72,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[70,70,100],"ix":6}},"ao":0,"ip":0,"op":32,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"“图层 2”轮廓","parent":1,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[0.161,-0.036,0],"ix":2},"a":{"a":0,"k":[60,60,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":0,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.971,-24.327],[5.075,-19.579],[5.716,-18.514],[5.716,23.545],[4.523,24.745],[-4.523,24.745],[-5.716,23.545],[-5.716,-23.264]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":8,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.902,-39.149],[5.144,-34.4],[5.785,-33.336],[5.785,23.475],[4.592,24.676],[-4.454,24.676],[-5.647,23.475],[-5.647,-38.085]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":16,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.985,-64.591],[5.061,-59.842],[5.702,-58.778],[5.785,23.475],[4.592,24.676],[-4.454,24.676],[-5.647,23.475],[-5.73,-63.527]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":24,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.902,-39.149],[5.144,-34.4],[5.785,-33.336],[5.785,23.475],[4.592,24.676],[-4.454,24.676],[-5.647,23.475],[-5.647,-38.085]],"c":true}]},{"t":32,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.971,-24.327],[5.075,-19.579],[5.716,-18.514],[5.716,23.545],[4.523,24.745],[-4.523,24.745],[-5.716,23.545],[-5.716,-23.264]],"c":true}]}],"ix":2},"nm":"路径 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.929411824544,0.156862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"填充 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[24.216,79.75],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"变换"}],"nm":"组 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":32,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"“图层 3”轮廓","parent":1,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[-0.214,-0.036,0],"ix":2},"a":{"a":0,"k":[60,60,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":0,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.075,-39.472],[-3.971,-44.221],[-5.715,-43.157],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.715,-38.408]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":8,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.04,-14.722],[-4.006,-19.471],[-5.75,-18.407],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.681,-13.658]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":16,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.096,0.153],[-3.95,-4.596],[-5.694,-3.532],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.737,1.217]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":24,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.083,-14.972],[-3.963,-19.721],[-5.707,-18.657],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.724,-13.908]],"c":true}]},{"t":32,"s":[{"i":[[0.394,0.207],[0,0],[0,-0.901],[0,0],[-0.659,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[-0.794,-0.417],[0,0],[0,0.663],[0,0],[0.659,0],[0,0],[0,-0.447]],"v":[[5.057,-40.097],[-3.989,-44.846],[-5.733,-43.782],[-5.715,43.438],[-4.523,44.638],[4.523,44.638],[5.715,43.438],[5.698,-39.033]],"c":true}]}],"ix":2},"nm":"路径 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.929411824544,0.156862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"填充 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[60.249,59.859],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"变换"}],"nm":"组 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":32,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"“图层 4”轮廓","parent":1,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[-0.214,-0.036,0],"ix":2},"a":{"a":0,"k":[60,60,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":0,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.971,-31.704],[5.075,-26.955],[5.716,-25.891],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.716,-30.64]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":8,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-4.005,-56.954],[5.041,-52.205],[5.682,-51.141],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.75,-55.89]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":16,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.971,-31.704],[5.075,-26.955],[5.716,-25.891],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.716,-30.64]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":24,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-4.005,-16.829],[5.041,-12.08],[5.682,-11.016],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.75,-15.765]],"c":true}]},{"t":32,"s":[{"i":[[-0.794,-0.417],[0,0],[0,-0.447],[0,0],[0.658,0],[0,0],[0,0.663],[0,0]],"o":[[0,0],[0.394,0.207],[0,0],[0,0.663],[0,0],[-0.659,0],[0,0],[0,-0.901]],"v":[[-3.948,-31.954],[5.098,-27.205],[5.739,-26.141],[5.716,30.92],[4.523,32.121],[-4.523,32.121],[-5.716,30.92],[-5.693,-30.89]],"c":true}]}],"ix":2},"nm":"路径 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.929411824544,0.156862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"填充 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[95.785,72.379],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"变换"}],"nm":"组 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":32,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"形状图层 1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[72,72,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"d":1,"ty":"el","s":{"a":0,"k":[144,144],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"椭圆路径 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.929411768913,0.156862750649,0,1],"ix":4},"o":{"a":0,"k":5,"ix":5},"r":1,"bm":0,"nm":"填充 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":32,"st":0,"bm":0}],"markers":[]}
@@ -2,50 +2,67 @@ import { AudioSuspensionModel } from 'wdComponent' @@ -2,50 +2,67 @@ import { AudioSuspensionModel } from 'wdComponent'
2 import { PlayerConstants, DateFormatUtil } from 'wdPlayer' 2 import { PlayerConstants, DateFormatUtil } from 'wdPlayer'
3 import { EmitterEventId, EmitterUtils } from 'wdKit/Index' 3 import { EmitterEventId, EmitterUtils } from 'wdKit/Index'
4 import window from '@ohos.window'; 4 import window from '@ohos.window';
  5 +import lottie from '@ohos/lottie';
  6 +import { LottieView } from 'wdComponent/Index'
5 7
6 const TAG = 'AudioSuspensionModel' 8 const TAG = 'AudioSuspensionModel'
7 9
8 @Entry 10 @Entry
9 @Component 11 @Component
10 struct Index { 12 struct Index {
11 - // private AudioSuspension = new AudioSuspensionModel() 13 + private AudioSuspension = new AudioSuspensionModel()
12 @State audioTitle: string | undefined = ''; 14 @State audioTitle: string | undefined = '';
13 @State currentTime: string = '00:00'; 15 @State currentTime: string = '00:00';
14 @State totalTime: string = '00:00'; 16 @State totalTime: string = '00:00';
15 @State progressVal: number = 0; 17 @State progressVal: number = 0;
16 @State currentStatus: number | string |undefined = 0; 18 @State currentStatus: number | string |undefined = 0;
17 @State isExpand: boolean = true; 19 @State isExpand: boolean = true;
18 - private expandWidth: number = 800  
19 - private expandHeight: number = 200  
20 - private foldWidth: number = 200  
21 - private foldHeight: number = 200 20 + @State moveY: number = 604;
  21 + private expandWidth: number = vp2px(243)
  22 + private expandHeight: number = vp2px(60)
  23 + private foldWidth: number = vp2px(60)
  24 + private foldHeight: number = vp2px(60)
  25 + bottomSafeHeight: number = 720 // 悬浮窗底部滑动限制
  26 + topSafeHeight: number = 94 // 悬浮窗顶部滑动限制
  27 + @State name: string = 'audio_status_wait';
22 28
23 - aboutToAppear() {  
24 - // this.AudioSuspension.playerController.get().onTimeUpdate = (position, duration) => {  
25 - // this.currentTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(position);  
26 - // this.totalTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(duration);  
27 - // this.progressVal = Math.floor(position * 100 / duration);  
28 - // } 29 + async aboutToAppear() {
  30 + this.AudioSuspension.playerController.get().onTimeUpdate = (position, duration) => {
  31 + this.currentTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(position);
  32 + this.totalTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(duration);
  33 + this.progressVal = Math.floor(position * 100 / duration);
  34 + }
29 35
30 EmitterUtils.receiveEvent(EmitterEventId.AUDIO_CHANGE_TITLe, (val:string | undefined) => { 36 EmitterUtils.receiveEvent(EmitterEventId.AUDIO_CHANGE_TITLe, (val:string | undefined) => {
31 - console.log(TAG,'this.audioTitle', val)  
32 this.audioTitle = val 37 this.audioTitle = val
33 }) 38 })
34 39
35 EmitterUtils.receiveEvent(EmitterEventId.AUDIO_CHANGE_STATUS, (val: number | string | undefined) => { 40 EmitterUtils.receiveEvent(EmitterEventId.AUDIO_CHANGE_STATUS, (val: number | string | undefined) => {
36 - console.log(TAG,'this.currentStatus', val) 41 + // val 2 pause
  42 + if(val === 2) {
  43 + console.log(TAG,'this.currentStatus 2 ', val)
  44 + lottie.pause(this.name)
  45 + } else if(val === 1) {
  46 + console.log(TAG,'this.currentStatus 1 ', val)
  47 + lottie.play(this.name)
  48 + }
37 this.currentStatus = val 49 this.currentStatus = val
38 }) 50 })
39 51
40 EmitterUtils.receiveEvent(EmitterEventId.AUDIO_WINDOW_TYPE, (val: number | string | undefined) => { 52 EmitterUtils.receiveEvent(EmitterEventId.AUDIO_WINDOW_TYPE, (val: number | string | undefined) => {
41 if (val == window.WindowEventType.WINDOW_ACTIVE) { 53 if (val == window.WindowEventType.WINDOW_ACTIVE) {
42 - console.info(TAG, 'current window stage event is WINDOW_ACTIVE', val);  
43 - this.isExpand = true 54 + // this.isExpand = true
44 // this.AudioSuspension.resizeWindow(this.expandWidth, this.expandHeight) 55 // this.AudioSuspension.resizeWindow(this.expandWidth, this.expandHeight)
45 } else if (val == window.WindowEventType.WINDOW_INACTIVE) { 56 } else if (val == window.WindowEventType.WINDOW_INACTIVE) {
46 - console.info(TAG, 'current window stage event is WINDOW_INACTIVE', val);  
47 this.isExpand = false 57 this.isExpand = false
48 - // this.AudioSuspension.resizeWindow(this.foldWidth, this.foldHeight) 58 + this.AudioSuspension.resizeWindow(this.foldWidth, this.foldHeight)
  59 + }
  60 + })
  61 +
  62 + EmitterUtils.receiveEvent(EmitterEventId.AUDIO_WINDOW_EXPAND, (val: number | string | undefined) => {
  63 + if (val == 1) {
  64 + this.isExpand = true
  65 + this.AudioSuspension.resizeWindow(this.expandWidth, this.expandHeight)
49 } 66 }
50 }) 67 })
51 68
@@ -53,7 +70,7 @@ struct Index { @@ -53,7 +70,7 @@ struct Index {
53 70
54 onPageHide() { 71 onPageHide() {
55 // this.status = PlayerConstants.STATUS_PAUSE; 72 // this.status = PlayerConstants.STATUS_PAUSE;
56 - // this.AudioSuspension.playerController.get()?.pause(); 73 + this.AudioSuspension.playerController.get()?.pause();
57 } 74 }
58 75
59 build() { 76 build() {
@@ -117,41 +134,64 @@ struct Index { @@ -117,41 +134,64 @@ struct Index {
117 .width(24) 134 .width(24)
118 .height(24) 135 .height(24)
119 .margin({ right: 12 }) 136 .margin({ right: 12 })
120 - .onClick(() => {  
121 - // if (this.AudioSuspension.playerController) {  
122 - // this.AudioSuspension.playerController.get().switchPlayOrPause()  
123 - // }  
124 - })  
125 - 137 + .gesture(
  138 + TapGesture()
  139 + .onAction((event: GestureEvent) => {
  140 + if (this.AudioSuspension.playerController) {
  141 + this.AudioSuspension.playerController.get().switchPlayOrPause()
  142 + }
  143 + }))
126 Image($r("app.media.icon_audio_close")) 144 Image($r("app.media.icon_audio_close"))
127 .objectFit(ImageFit.Contain) 145 .objectFit(ImageFit.Contain)
128 .width(24) 146 .width(24)
129 .height(24) 147 .height(24)
130 - .onClick(() => {  
131 - // if (this.AudioSuspension.playerController) {  
132 - // this.AudioSuspension.playerController.get().stop()  
133 - // this.AudioSuspension.destroyWindow()  
134 - // }  
135 - })  
136 - }.width(80) 148 + .gesture(
  149 + TapGesture()
  150 + .onAction((event: GestureEvent) => {
  151 + if (this.AudioSuspension.playerController) {
  152 + this.AudioSuspension.playerController.get().switchPlayOrPause()
  153 + this.AudioSuspension.minimize()
  154 + }
  155 + }))
  156 + }
  157 + .width(80)
137 .height(60) 158 .height(60)
138 } else { 159 } else {
139 Row() { 160 Row() {
140 - Image(this.currentStatus === PlayerConstants.STATUS_START ? $r("app.media.icon_audio_pause") : $r("app.media.icon_audio_playing"))  
141 - .objectFit(ImageFit.Contain)  
142 - .width(24)  
143 - .height(24)  
144 - .onClick(() => {  
145 - // if (this.AudioSuspension.playerController) {  
146 - // this.AudioSuspension.playerController.get().switchPlayOrPause()  
147 - // }  
148 - }) 161 + LottieView({
  162 + name: this.name,
  163 + path: "lottie/audio_animation_playing.json",
  164 + lottieWidth: 24,
  165 + lottieHeight: 24,
  166 + autoplay: true,
  167 + loop: true
  168 + })
149 } 169 }
150 .justifyContent(FlexAlign.Center) 170 .justifyContent(FlexAlign.Center)
151 .width(60) 171 .width(60)
152 .height(60) 172 .height(60)
153 } 173 }
154 } 174 }
  175 + .parallelGesture(
  176 + GestureGroup(GestureMode.Parallel,
  177 + TapGesture()
  178 + .onAction((event?: GestureEvent) => {
  179 + this.isExpand = true
  180 + this.AudioSuspension.resizeWindow(this.expandWidth, this.expandHeight)
  181 + }),
  182 + PanGesture({
  183 + fingers: 1,
  184 + direction: PanDirection.Vertical,
  185 + distance: 0
  186 + })
  187 + .onActionUpdate((event: GestureEvent) => {
  188 + let newY = Math.ceil(this.moveY + event.offsetY);
  189 + this.moveY = Math.min(Math.max(newY, this.topSafeHeight), this.bottomSafeHeight);
  190 + // console.log(TAG,'this.moveY', this.moveY)
  191 + this.AudioSuspension.moveWindow(this.moveY)
  192 + })
  193 + )
  194 + )
155 .width('100%') 195 .width('100%')
156 .height('100%') 196 .height('100%')
157 .backgroundColor(Color.White) 197 .backgroundColor(Color.White)
@@ -92,16 +92,6 @@ @@ -92,16 +92,6 @@
92 { 92 {
93 "name": "ohos.permission.INTERNET" 93 "name": "ohos.permission.INTERNET"
94 }, 94 },
95 -// {  
96 -// "name": "ohos.permission.SYSTEM_FLOAT_WINDOW",  
97 -// "reason": "$string:EntryAbility_desc",  
98 -// "usedScene": {  
99 -// "abilities": [  
100 -// "FormAbility"  
101 -// ],  
102 -// "when": "inuse"  
103 -// }  
104 -// }  
105 ] 95 ]
106 } 96 }
107 } 97 }