Showing
5 changed files
with
95 additions
and
28 deletions
| @@ -14,9 +14,6 @@ export class AudioSuspensionModel { | @@ -14,9 +14,6 @@ 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 = vp2px(243) | ||
| 18 | - private expandHeight: number = vp2px(60) | ||
| 19 | - private initMoveX = vp2px(12) | ||
| 20 | // 窗口是否最小化 | 17 | // 窗口是否最小化 |
| 21 | private isMinimize: SubscribedAbstractProperty<boolean> = AppStorage.link<boolean>('isMinimize') | 18 | private isMinimize: SubscribedAbstractProperty<boolean> = AppStorage.link<boolean>('isMinimize') |
| 22 | constructor() { | 19 | constructor() { |
| @@ -100,16 +97,6 @@ export class AudioSuspensionModel { | @@ -100,16 +97,6 @@ export class AudioSuspensionModel { | ||
| 100 | console.info(TAG, 'floatWindowClass Succeeded in changing the window size.'); | 97 | console.info(TAG, 'floatWindowClass Succeeded in changing the window size.'); |
| 101 | }); | 98 | }); |
| 102 | } | 99 | } |
| 103 | - public moveWindow(y: number) { | ||
| 104 | - this.floatWindowClass.get().moveWindowTo(this.initMoveX, vp2px(y), (err: BusinessError) => { | ||
| 105 | - let errCode: number = err.code; | ||
| 106 | - if (errCode) { | ||
| 107 | - console.error('floatWindowClass Failed to move the window. Cause:' + JSON.stringify(err)); | ||
| 108 | - return; | ||
| 109 | - } | ||
| 110 | - console.info('floatWindowClass Succeeded in moving the window.'); | ||
| 111 | - }); | ||
| 112 | - } | ||
| 113 | 100 | ||
| 114 | // 隐藏悬浮窗 | 101 | // 隐藏悬浮窗 |
| 115 | public minimize() { | 102 | public minimize() { |
| @@ -10,6 +10,8 @@ import { window } from '@kit.ArkUI'; | @@ -10,6 +10,8 @@ import { window } from '@kit.ArkUI'; | ||
| 10 | import { EmptyComponent } from 'wdComponent/Index'; | 10 | import { EmptyComponent } from 'wdComponent/Index'; |
| 11 | import { DateTimeUtils } from 'wdKit/Index'; | 11 | import { DateTimeUtils } from 'wdKit/Index'; |
| 12 | import { TrackConstants, TrackingPageBrowse } from 'wdTracking/Index'; | 12 | import { TrackConstants, TrackingPageBrowse } from 'wdTracking/Index'; |
| 13 | +import { AudioSuspensionModel } from 'wdComponent' | ||
| 14 | +import { BusinessError } from '@kit.BasicServicesKit'; | ||
| 13 | 15 | ||
| 14 | const storage = LocalStorage.getShared(); | 16 | const storage = LocalStorage.getShared(); |
| 15 | const TAG = 'DetailVideoListPage' | 17 | const TAG = 'DetailVideoListPage' |
| @@ -42,6 +44,8 @@ export struct DetailVideoListPage { | @@ -42,6 +44,8 @@ export struct DetailVideoListPage { | ||
| 42 | pageHideTime:number = 0; | 44 | pageHideTime:number = 0; |
| 43 | @Provide onlyWifiLoadVideo: boolean = false | 45 | @Provide onlyWifiLoadVideo: boolean = false |
| 44 | @Provide toastTextVisible: boolean = false | 46 | @Provide toastTextVisible: boolean = false |
| 47 | + private AudioSuspension = new AudioSuspensionModel() | ||
| 48 | + @State isShowAudioCom: boolean = false | ||
| 45 | 49 | ||
| 46 | async aboutToAppear(): Promise<void> { | 50 | async aboutToAppear(): Promise<void> { |
| 47 | // 注册监听网络连接 | 51 | // 注册监听网络连接 |
| @@ -80,6 +84,21 @@ export struct DetailVideoListPage { | @@ -80,6 +84,21 @@ export struct DetailVideoListPage { | ||
| 80 | this.openFullScreen() | 84 | this.openFullScreen() |
| 81 | 85 | ||
| 82 | this.pageShowTime = DateTimeUtils.getTimeStamp() | 86 | this.pageShowTime = DateTimeUtils.getTimeStamp() |
| 87 | + | ||
| 88 | + // 判断当前窗口是否已显示,使用callback异步回调。 | ||
| 89 | + this.AudioSuspension.floatWindowClass.get().isShowing((err: BusinessError, data) => { | ||
| 90 | + const errCode: number = err.code; | ||
| 91 | + if (errCode) { | ||
| 92 | + console.error(TAG, 'Failed window is showing Cause:' + JSON.stringify(err)); | ||
| 93 | + return; | ||
| 94 | + } | ||
| 95 | + console.info(TAG, 'window is showing: ' + JSON.stringify(data)); | ||
| 96 | + if(data) { | ||
| 97 | + this.isShowAudioCom = true | ||
| 98 | + this.AudioSuspension.playerController.get()?.pause(); | ||
| 99 | + this.AudioSuspension.minimize() | ||
| 100 | + } | ||
| 101 | + }); | ||
| 83 | } | 102 | } |
| 84 | 103 | ||
| 85 | onPageHide(): void { | 104 | onPageHide(): void { |
| @@ -91,6 +110,13 @@ export struct DetailVideoListPage { | @@ -91,6 +110,13 @@ export struct DetailVideoListPage { | ||
| 91 | let duration = 0 | 110 | let duration = 0 |
| 92 | duration = Math.floor((this.pageHideTime - this.pageShowTime)/1000) | 111 | duration = Math.floor((this.pageHideTime - this.pageShowTime)/1000) |
| 93 | TrackingPageBrowse.trackCommonPageExposureEnd(TrackConstants.PageName.Customer_Personal,TrackConstants.PageName.Customer_Personal,duration) | 112 | TrackingPageBrowse.trackCommonPageExposureEnd(TrackConstants.PageName.Customer_Personal,TrackConstants.PageName.Customer_Personal,duration) |
| 113 | + | ||
| 114 | + console.info(TAG, 'this.isShowAudioCom: ' + this.isShowAudioCom); | ||
| 115 | + if (this.isShowAudioCom) { | ||
| 116 | + this.AudioSuspension.showWindow() | ||
| 117 | + this.AudioSuspension.playerController.get()?.play(); | ||
| 118 | + this.isShowAudioCom = false | ||
| 119 | + } | ||
| 94 | } | 120 | } |
| 95 | 121 | ||
| 96 | /** | 122 | /** |
| @@ -7,6 +7,11 @@ import { LottieView } from 'wdComponent/Index' | @@ -7,6 +7,11 @@ import { LottieView } from 'wdComponent/Index' | ||
| 7 | 7 | ||
| 8 | const TAG = 'AudioSuspensionModel' | 8 | const TAG = 'AudioSuspensionModel' |
| 9 | 9 | ||
| 10 | +interface Position { | ||
| 11 | + x: number, | ||
| 12 | + y: number | ||
| 13 | +} | ||
| 14 | + | ||
| 10 | @Entry | 15 | @Entry |
| 11 | @Component | 16 | @Component |
| 12 | struct Index { | 17 | struct Index { |
| @@ -17,17 +22,21 @@ struct Index { | @@ -17,17 +22,21 @@ struct Index { | ||
| 17 | @State progressVal: number = 0; | 22 | @State progressVal: number = 0; |
| 18 | @State currentStatus: number | string |undefined = 0; | 23 | @State currentStatus: number | string |undefined = 0; |
| 19 | @State isExpand: boolean = true; | 24 | @State isExpand: boolean = true; |
| 20 | - @State moveY: number = 604; | ||
| 21 | private expandWidth: number = vp2px(243) | 25 | private expandWidth: number = vp2px(243) |
| 22 | private expandHeight: number = vp2px(60) | 26 | private expandHeight: number = vp2px(60) |
| 23 | private foldWidth: number = vp2px(60) | 27 | private foldWidth: number = vp2px(60) |
| 24 | private foldHeight: number = vp2px(60) | 28 | private foldHeight: number = vp2px(60) |
| 25 | - bottomSafeHeight: number = 720 // 悬浮窗底部滑动限制 | ||
| 26 | - topSafeHeight: number = 94 // 悬浮窗顶部滑动限制 | 29 | + bottomSafeHeight: number = vp2px(720) // 悬浮窗底部滑动限制 |
| 30 | + topSafeHeight: number = vp2px(94) // 悬浮窗顶部滑动限制 | ||
| 27 | @State name: string = 'audio_status_wait'; | 31 | @State name: string = 'audio_status_wait'; |
| 32 | + @State @Watch("moveWindow") windowPosition: Position = { x: vp2px(12), y: vp2px(576) }; | ||
| 33 | + private panOption: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.All }); | ||
| 34 | + private subWindow:window.Window | null = null | ||
| 28 | 35 | ||
| 29 | async aboutToAppear() { | 36 | async aboutToAppear() { |
| 30 | - window.findWindow("subWindow").setWindowBackgroundColor("#00000000") | 37 | + this.subWindow = window.findWindow("subWindow") |
| 38 | + this.subWindow.setWindowBackgroundColor("#00000000") | ||
| 39 | + | ||
| 31 | this.AudioSuspension.playerController.get().onTimeUpdate = (position, duration) => { | 40 | this.AudioSuspension.playerController.get().onTimeUpdate = (position, duration) => { |
| 32 | this.currentTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(position); | 41 | this.currentTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(position); |
| 33 | this.totalTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(duration); | 42 | this.totalTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(duration); |
| @@ -69,6 +78,14 @@ struct Index { | @@ -69,6 +78,14 @@ struct Index { | ||
| 69 | 78 | ||
| 70 | } | 79 | } |
| 71 | 80 | ||
| 81 | + moveWindow() { | ||
| 82 | + if (this.subWindow == null) { | ||
| 83 | + console.info('Faild in destroying the window.'); | ||
| 84 | + } else { | ||
| 85 | + this.subWindow.moveWindowTo(this.windowPosition.x, this.windowPosition.y); | ||
| 86 | + } | ||
| 87 | + } | ||
| 88 | + | ||
| 72 | onPageHide() { | 89 | onPageHide() { |
| 73 | // this.status = PlayerConstants.STATUS_PAUSE; | 90 | // this.status = PlayerConstants.STATUS_PAUSE; |
| 74 | this.AudioSuspension.playerController.get()?.pause(); | 91 | this.AudioSuspension.playerController.get()?.pause(); |
| @@ -183,16 +200,20 @@ struct Index { | @@ -183,16 +200,20 @@ struct Index { | ||
| 183 | this.isExpand = true | 200 | this.isExpand = true |
| 184 | this.AudioSuspension.resizeWindow(this.expandWidth, this.expandHeight) | 201 | this.AudioSuspension.resizeWindow(this.expandWidth, this.expandHeight) |
| 185 | }), | 202 | }), |
| 186 | - PanGesture({ | ||
| 187 | - fingers: 1, | ||
| 188 | - direction: PanDirection.Vertical, | ||
| 189 | - distance: 0 | ||
| 190 | - }) | 203 | + PanGesture(this.panOption) |
| 204 | + //手势识别成功回调。 | ||
| 205 | + .onActionStart((event: GestureEvent) => { | ||
| 206 | + console.info('Pan start'); | ||
| 207 | + }) | ||
| 208 | + // 手势移动过程中回调。发生拖拽时,获取到触摸点的位置,并将位置信息传递给windowPosition | ||
| 191 | .onActionUpdate((event: GestureEvent) => { | 209 | .onActionUpdate((event: GestureEvent) => { |
| 192 | - let newY = Math.ceil(this.moveY + event.offsetY); | ||
| 193 | - this.moveY = Math.min(Math.max(newY, this.topSafeHeight), this.bottomSafeHeight); | ||
| 194 | - // console.log(TAG,'this.moveY', this.moveY) | ||
| 195 | - this.AudioSuspension.moveWindow(this.moveY) | 210 | + // this.windowPosition.x += event.offsetX; |
| 211 | + let newY = this.windowPosition.y + event.offsetY; | ||
| 212 | + this.windowPosition.y = Math.min(Math.max(newY, this.topSafeHeight), this.bottomSafeHeight); | ||
| 213 | + }) | ||
| 214 | + //手势识别成功,手指抬起后触发回调。 | ||
| 215 | + .onActionEnd(() => { | ||
| 216 | + console.info('Pan end'); | ||
| 196 | }) | 217 | }) |
| 197 | ) | 218 | ) |
| 198 | ) | 219 | ) |
| @@ -9,6 +9,8 @@ import { VideoChannelPage } from './VideoChannelPage'; | @@ -9,6 +9,8 @@ import { VideoChannelPage } from './VideoChannelPage'; | ||
| 9 | import ChannelViewModel from 'wdComponent/src/main/ets/viewmodel/ChannelViewModel'; | 9 | import ChannelViewModel from 'wdComponent/src/main/ets/viewmodel/ChannelViewModel'; |
| 10 | import { ALL, ImageKnifeComponent, ImageKnifeOption } from '@ohos/imageknife'; | 10 | import { ALL, ImageKnifeComponent, ImageKnifeOption } from '@ohos/imageknife'; |
| 11 | import { ParamType, Tracking } from 'wdTracking/Index'; | 11 | import { ParamType, Tracking } from 'wdTracking/Index'; |
| 12 | +import { AudioSuspensionModel } from 'wdComponent' | ||
| 13 | +import { BusinessError } from '@kit.BasicServicesKit'; | ||
| 12 | 14 | ||
| 13 | const TAG = 'BottomNavigationComponent'; | 15 | const TAG = 'BottomNavigationComponent'; |
| 14 | PersistentStorage.persistProp('channelIds', ''); | 16 | PersistentStorage.persistProp('channelIds', ''); |
| @@ -52,6 +54,8 @@ export struct BottomNavigationComponent { | @@ -52,6 +54,8 @@ export struct BottomNavigationComponent { | ||
| 52 | @State assignChannel: AssignChannelParam = new AssignChannelParam() | 54 | @State assignChannel: AssignChannelParam = new AssignChannelParam() |
| 53 | // 自动刷新触发(双击tab自动刷新) | 55 | // 自动刷新触发(双击tab自动刷新) |
| 54 | @State autoRefresh: number = 0 | 56 | @State autoRefresh: number = 0 |
| 57 | + private AudioSuspension = new AudioSuspensionModel() | ||
| 58 | + @State isShowAudioCom: boolean = false | ||
| 55 | 59 | ||
| 56 | 60 | ||
| 57 | async aboutToAppear() { | 61 | async aboutToAppear() { |
| @@ -143,6 +147,9 @@ export struct BottomNavigationComponent { | @@ -143,6 +147,9 @@ export struct BottomNavigationComponent { | ||
| 143 | .hoverEffect(HoverEffect.Highlight) | 147 | .hoverEffect(HoverEffect.Highlight) |
| 144 | .visibility(this.displayDirection === DisplayDirection.VERTICAL ? Visibility.Visible : Visibility.None) | 148 | .visibility(this.displayDirection === DisplayDirection.VERTICAL ? Visibility.Visible : Visibility.None) |
| 145 | // .hitTestBehavior(HitTestMode.Block) | 149 | // .hitTestBehavior(HitTestMode.Block) |
| 150 | + .onTouch(() => { | ||
| 151 | + this.handleAudio(navItem) | ||
| 152 | + }) | ||
| 146 | .onClick(() => { | 153 | .onClick(() => { |
| 147 | Logger.info(TAG, `onChange, index: ${index}`); | 154 | Logger.info(TAG, `onChange, index: ${index}`); |
| 148 | Logger.info(TAG, `onChange, navItem: ${JSON.stringify(navItem)}`); | 155 | Logger.info(TAG, `onChange, navItem: ${JSON.stringify(navItem)}`); |
| @@ -152,7 +159,6 @@ export struct BottomNavigationComponent { | @@ -152,7 +159,6 @@ export struct BottomNavigationComponent { | ||
| 152 | "pageId": navItem.id, | 159 | "pageId": navItem.id, |
| 153 | } | 160 | } |
| 154 | Tracking.event("bar_click", params) | 161 | Tracking.event("bar_click", params) |
| 155 | - | ||
| 156 | this.onBottomNavigationIndexChange(navItem, index) | 162 | this.onBottomNavigationIndexChange(navItem, index) |
| 157 | }) | 163 | }) |
| 158 | 164 | ||
| @@ -221,9 +227,37 @@ export struct BottomNavigationComponent { | @@ -221,9 +227,37 @@ export struct BottomNavigationComponent { | ||
| 221 | return isSelect ? $r('app.media.icon_tab_res1') : $r('app.media.icon_tab_res1_no') | 227 | return isSelect ? $r('app.media.icon_tab_res1') : $r('app.media.icon_tab_res1_no') |
| 222 | } | 228 | } |
| 223 | 229 | ||
| 230 | + // 控制音频悬浮窗显隐 | ||
| 231 | + handleAudio(navItem: BottomNavDTO) { | ||
| 232 | + if (navItem.name === '视频') { | ||
| 233 | + // 判断当前窗口是否已显示,使用callback异步回调。 | ||
| 234 | + this.AudioSuspension.floatWindowClass.get().isShowing((err: BusinessError, data) => { | ||
| 235 | + const errCode: number = err.code; | ||
| 236 | + if (errCode) { | ||
| 237 | + console.error(TAG, 'Failed window is showing Cause:' + JSON.stringify(err)); | ||
| 238 | + return; | ||
| 239 | + } | ||
| 240 | + console.info(TAG, 'window is showing: ' + JSON.stringify(data)); | ||
| 241 | + if(data) { | ||
| 242 | + this.isShowAudioCom = true | ||
| 243 | + this.AudioSuspension.playerController.get()?.pause(); | ||
| 244 | + this.AudioSuspension.minimize() | ||
| 245 | + } | ||
| 246 | + }); | ||
| 247 | + } else { | ||
| 248 | + console.info(TAG, 'this.isShowAudioCom: ' + this.isShowAudioCom); | ||
| 249 | + if (this.isShowAudioCom) { | ||
| 250 | + this.AudioSuspension.showWindow() | ||
| 251 | + this.AudioSuspension.playerController.get()?.play(); | ||
| 252 | + this.isShowAudioCom = false | ||
| 253 | + } | ||
| 254 | + } | ||
| 255 | + } | ||
| 256 | + | ||
| 224 | // 底导切换函数 | 257 | // 底导切换函数 |
| 225 | async onBottomNavigationIndexChange(navItem: BottomNavDTO, index: number) { | 258 | async onBottomNavigationIndexChange(navItem: BottomNavDTO, index: number) { |
| 226 | Logger.info(TAG, `onBottomNavigationIndexChange this.currentNavIndex: ${this.currentNavIndex}`); | 259 | Logger.info(TAG, `onBottomNavigationIndexChange this.currentNavIndex: ${this.currentNavIndex}`); |
| 260 | + | ||
| 227 | if (navItem.name === '我的') { | 261 | if (navItem.name === '我的') { |
| 228 | this.barBackgroundColor = Color.White | 262 | this.barBackgroundColor = Color.White |
| 229 | this.currentBottomNavInfo = {} as BottomNavDTO | 263 | this.currentBottomNavInfo = {} as BottomNavDTO |
| @@ -237,7 +271,6 @@ export struct BottomNavigationComponent { | @@ -237,7 +271,6 @@ export struct BottomNavigationComponent { | ||
| 237 | } | 271 | } |
| 238 | } | 272 | } |
| 239 | this.currentNavIndex = index; | 273 | this.currentNavIndex = index; |
| 240 | - | ||
| 241 | // 请求顶导数据(参数): | 274 | // 请求顶导数据(参数): |
| 242 | } | 275 | } |
| 243 | 276 |
-
Please register or login to post a comment