diff --git a/README.md b/README.md index 55d4e29b7c37d727cdede6358eae5102888acf69..dceee4676000691d41f9f4443ddb66b5d3a3c621 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# 一多开发实例-长视频 +# 优秀实践-一多开发实例-长视频 ### 简介 @@ -46,8 +46,3 @@ 2. HarmonyOS系统：HarmonyOS NEXT Developer Beta1及以上。 3. DevEco Studio版本：DevEco Studio NEXT Developer Beta1及以上。 4. HarmonyOS SDK版本：HarmonyOS NEXT Developer Beta1 SDK及以上。 - -### 注意 - -运行时需设置引用所有HSP模块。点击Run > Edit Configurations，选择Deploy Multi Hap标签页，勾选Deploy Multi Hap Packages， 选择使用方模块（phone）和所有HSP模块，点击OK。单击Run > Run “模块名称”（如Run ”entry“）或![](screenshots/device/run.png)来启动应用/服务的编译构建。 -![](screenshots/device/config.png) diff --git a/commons/base/hvigorfile.ts b/commons/base/hvigorfile.ts index d993120bd71f5f5dfe04480be9dc5f73c00c2599..42187071482d292588ad40babeda74f7b8d97a23 100644 --- a/commons/base/hvigorfile.ts +++ b/commons/base/hvigorfile.ts @@ -1,6 +1,6 @@ -import { hspTasks } from '@ohos/hvigor-ohos-plugin'; +import { harTasks } from '@ohos/hvigor-ohos-plugin'; export default { - system: hspTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + system: harTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ } diff --git a/commons/base/src/main/ets/utils/AvPlayerUtil.ets b/commons/base/src/main/ets/utils/AvPlayerUtil.ets index 85280ce3e95bd521fc9d51c80fdffaa3960d7cff..c08657c4932323f6429dbf4a085db9f325e6f27f 100644 --- a/commons/base/src/main/ets/utils/AvPlayerUtil.ets +++ b/commons/base/src/main/ets/utils/AvPlayerUtil.ets @@ -54,8 +54,7 @@ export class AvPlayerUtil { } switch (state) { case CommonConstants.AV_PLAYER_IDLE_STATE: - this.url = await this.context.createModuleContext(CommonConstants.VIDEO_DETAIL_HSP_NAME).resourceManager - .getRawFd(CommonConstants.PRODUCT_VIDEO_NAME); + this.url = await this.context.resourceManager.getRawFd(CommonConstants.PRODUCT_VIDEO_NAME); this.avPlayer.fdSrc = this.url; Logger.info('AVPlayer state idle called.'); break; @@ -126,8 +125,7 @@ export class AvPlayerUtil { this.surfaceId = surfaceId; Logger.info('Created AvPlayer successfully.'); // Entering idle state. - this.url = await this.context.createModuleContext(CommonConstants.VIDEO_DETAIL_HSP_NAME).resourceManager - .getRawFd(CommonConstants.PRODUCT_VIDEO_NAME); + this.url = await this.context.resourceManager.getRawFd(CommonConstants.PRODUCT_VIDEO_NAME); this.avPlayer.fdSrc = this.url; this.setAVPlayerCallback(); } else { diff --git a/commons/base/src/main/module.json5 b/commons/base/src/main/module.json5 index 74b8eceebe7e3637e41fb9cfc417ac52807c6372..5b88767e30950571337935f398f2dcbf4d1b822d 100644 --- a/commons/base/src/main/module.json5 +++ b/commons/base/src/main/module.json5 @@ -1,13 +1,11 @@ { "module": { "name": "base", - "type": "shared", - "description": "$string:shared_desc", + "type": "har", "deviceTypes": [ "phone", "tablet", "2in1" - ], - "deliveryWithInstall": true + ] } } \ No newline at end of file diff --git a/commons/base/src/main/resources/base/element/string.json b/commons/base/src/main/resources/base/element/string.json deleted file mode 100644 index 98e1d8a84b3d8539ea33e79fe2ac593a05d23bb4..0000000000000000000000000000000000000000 --- a/commons/base/src/main/resources/base/element/string.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "string": [ - { - "name": "shared_desc", - "value": "description" - } - ] -} \ No newline at end of file diff --git a/features/home/hvigorfile.ts b/features/home/hvigorfile.ts index d993120bd71f5f5dfe04480be9dc5f73c00c2599..42187071482d292588ad40babeda74f7b8d97a23 100644 --- a/features/home/hvigorfile.ts +++ b/features/home/hvigorfile.ts @@ -1,6 +1,6 @@ -import { hspTasks } from '@ohos/hvigor-ohos-plugin'; +import { harTasks } from '@ohos/hvigor-ohos-plugin'; export default { - system: hspTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + system: harTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ } diff --git a/features/home/src/main/ets/view/BannerView.ets b/features/home/src/main/ets/view/BannerView.ets index ee6a3f0df95d7ea7d8431ba0c8f0b13e4cb3b95e..2ec304a3f896fbbeb4a9d39a2f32b33a18370634 100644 --- a/features/home/src/main/ets/view/BannerView.ets +++ b/features/home/src/main/ets/view/BannerView.ets @@ -74,72 +74,70 @@ export struct BannerView { Row() { Swiper() { LazyForEach(this.bannerDataSource, (item: Banner, index: number) => { - Column() { - Stack() { - Image(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? item.getBannerImg().getImgSrcSm() : - item.getBannerImg().getImgSrc()) - .objectFit(ImageFit.Fill) - .borderRadius($r('app.float.banner_img_border_radius')) - .height(CommonConstants.FULL_PERCENT) - .width(CommonConstants.FULL_PERCENT) - .focusable(true) - .groupDefaultFocus(index === 0 ? true : false) - .stateStyles({ - normal: this.normalStyles, - focused: this.focusedStyles - }) + Stack() { + Image(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? item.getBannerImg().getImgSrcSm() : + item.getBannerImg().getImgSrc()) + .objectFit(ImageFit.Fill) + .borderRadius($r('app.float.banner_img_border_radius')) + .height(CommonConstants.FULL_PERCENT) + .width(CommonConstants.FULL_PERCENT) + .focusable(true) + .groupDefaultFocus(index === 0 ? true : false) + .stateStyles({ + normal: this.normalStyles, + focused: this.focusedStyles + }) - Column() { - Text(item.getDescription().getIsLeftCenter().getValue(this.currentBreakpoint) ? - item.getDescription().getDescription()[0] + item.getDescription().getDescription()[1] : - item.getDescription().getDescription()[0]) - .fontSize(item.getDescription().getFontSize().getValue(this.currentBreakpoint)[0]) - .fontWeight(item.getDescription().getFontWeight()[0]) - .lineHeight(item.getDescription().getLineHeight().getValue(this.currentBreakpoint)[0]) - .fontColor(Color.White) - .letterSpacing(HomeConstants.BANNER_TEXT_LETTER_SPACES[2]) - .maxLines(1) + Column() { + Text(item.getDescription().getIsLeftCenter().getValue(this.currentBreakpoint) ? + item.getDescription().getDescription()[0] + item.getDescription().getDescription()[1] : + item.getDescription().getDescription()[0]) + .fontSize(item.getDescription().getFontSize().getValue(this.currentBreakpoint)[0]) + .fontWeight(item.getDescription().getFontWeight()[0]) + .lineHeight(item.getDescription().getLineHeight().getValue(this.currentBreakpoint)[0]) + .fontColor(Color.White) + .letterSpacing(HomeConstants.BANNER_TEXT_LETTER_SPACES[2]) + .maxLines(1) - Text(item.getDescription().getDescription()[1]) - .fontSize(item.getDescription().getFontSize().getValue(this.currentBreakpoint)[0]) - .fontWeight(item.getDescription().getFontWeight()[0]) - .lineHeight(item.getDescription().getLineHeight().getValue(this.currentBreakpoint)[0]) - .fontColor(Color.White) - .letterSpacing(HomeConstants.BANNER_TEXT_LETTER_SPACES[2]) - .maxLines(1) - .visibility(item.getDescription().getIsLeftCenter().getValue(this.currentBreakpoint) ? - Visibility.None : Visibility.Visible) + Text(item.getDescription().getDescription()[1]) + .fontSize(item.getDescription().getFontSize().getValue(this.currentBreakpoint)[0]) + .fontWeight(item.getDescription().getFontWeight()[0]) + .lineHeight(item.getDescription().getLineHeight().getValue(this.currentBreakpoint)[0]) + .fontColor(Color.White) + .letterSpacing(HomeConstants.BANNER_TEXT_LETTER_SPACES[2]) + .maxLines(1) + .visibility(item.getDescription().getIsLeftCenter().getValue(this.currentBreakpoint) ? + Visibility.None : Visibility.Visible) - Text(item.getDescription().getDescription()[2]) - .fontSize(item.getDescription().getFontSize().getValue(this.currentBreakpoint)[1]) - .fontWeight(item.getDescription().getFontWeight()[1]) - .lineHeight(item.getDescription().getLineHeight().getValue(this.currentBreakpoint)[1]) - .fontColor(Color.White) - .margin({ - top: item.getDescription().getTopPosition().getValue(this.currentBreakpoint)[1] - }) - .letterSpacing(HomeConstants.BANNER_TEXT_LETTER_SPACES[1]) - .maxLines(1) - } - .padding({ - left: !item.getDescription().getIsLeftCenter().getValue(this.currentBreakpoint) ? - item.getDescription().getLeftPosition().getValue(this.currentBreakpoint)[0] : '0', - top: !item.getDescription().getIsTopCenter().getValue(this.currentBreakpoint) ? - item.getDescription().getTopPosition().getValue(this.currentBreakpoint)[0] : '0' - }) - .alignItems(item.getDescription().getIsLeftCenter().getValue(this.currentBreakpoint) ? - HorizontalAlign.Center : HorizontalAlign.Start) - .justifyContent(!item.getDescription().getIsTopCenter().getValue(this.currentBreakpoint) ? - FlexAlign.Start : FlexAlign.Center) - .height(CommonConstants.FULL_PERCENT) - .width(CommonConstants.FULL_PERCENT) + Text(item.getDescription().getDescription()[2]) + .fontSize(item.getDescription().getFontSize().getValue(this.currentBreakpoint)[1]) + .fontWeight(item.getDescription().getFontWeight()[1]) + .lineHeight(item.getDescription().getLineHeight().getValue(this.currentBreakpoint)[1]) + .fontColor(Color.White) + .margin({ + top: item.getDescription().getTopPosition().getValue(this.currentBreakpoint)[1] + }) + .letterSpacing(HomeConstants.BANNER_TEXT_LETTER_SPACES[1]) + .maxLines(1) } - .height(item.getBannerImg().getHeight().getValue(this.currentBreakpoint)) + .padding({ + left: !item.getDescription().getIsLeftCenter().getValue(this.currentBreakpoint) ? + item.getDescription().getLeftPosition().getValue(this.currentBreakpoint)[0] : '0', + top: !item.getDescription().getIsTopCenter().getValue(this.currentBreakpoint) ? + item.getDescription().getTopPosition().getValue(this.currentBreakpoint)[0] : '0' + }) + .alignItems(item.getDescription().getIsLeftCenter().getValue(this.currentBreakpoint) ? + HorizontalAlign.Center : HorizontalAlign.Start) + .justifyContent(!item.getDescription().getIsTopCenter().getValue(this.currentBreakpoint) ? + FlexAlign.Start : FlexAlign.Center) + .height(CommonConstants.FULL_PERCENT) .width(CommonConstants.FULL_PERCENT) - // The width and height vary with the container assembly and the aspect ratio remains unchanged. - .aspectRatio(new BreakpointType(HomeConstants.BANNER_RATIOS[0], HomeConstants.BANNER_RATIOS[1], - HomeConstants.BANNER_RATIOS[2]).getValue(this.currentBreakpoint)) } + .height(item.getBannerImg().getHeight().getValue(this.currentBreakpoint)) + .width(CommonConstants.FULL_PERCENT) + // The width and height vary with the container assembly and the aspect ratio remains unchanged. + .aspectRatio(new BreakpointType(HomeConstants.BANNER_RATIOS[0], HomeConstants.BANNER_RATIOS[1], + HomeConstants.BANNER_RATIOS[2]).getValue(this.currentBreakpoint)) }, (item: Banner, index: number) => index + JSON.stringify(item)) } .tabIndex(getTabIndex(HomeConstants.DIRECTION_LIST[2])) diff --git a/features/home/src/main/ets/view/Home.ets b/features/home/src/main/ets/view/Home.ets index 93033bb8f50290fce73abbeb5557610ac9d16a8d..547fe41cdd49115db0818148b39b8675b34a6dc0 100644 --- a/features/home/src/main/ets/view/Home.ets +++ b/features/home/src/main/ets/view/Home.ets @@ -75,8 +75,9 @@ export struct Home { .scrollBar(BarState.Off) .height(CommonConstants.FULL_PERCENT) // Obtains the sliding offset on the y axis during sliding. - .onScroll(() => { + .onScrollFrameBegin((offset: number) => { this.scrollHeight = this.sideScroller.currentOffset().yOffset; + return { offsetRemain: offset } }) HomeHeader({ isSearching: $isSearching }) diff --git a/features/home/src/main/ets/view/PreviousVideo.ets b/features/home/src/main/ets/view/PreviousVideo.ets index 3390c5d24e59c41689e7660214657f1c33097eb6..76436d657bf78ba2cf90c6c9cb243faf2b48c82f 100644 --- a/features/home/src/main/ets/view/PreviousVideo.ets +++ b/features/home/src/main/ets/view/PreviousVideo.ets @@ -15,7 +15,6 @@ import { BreakpointConstants, CommonConstants } from '@ohos/commons'; import { BreakpointType } from '@ohos/commons'; -import { router } from '@kit.ArkUI'; import { HomeConstants } from '../constants/HomeConstants'; import { VideoImage, VideoImgViewModel } from '../viewmodel/VideoImgViewModel'; import { PreviousVideoUtil } from '../utils/PreviousVideoUtil'; @@ -26,6 +25,7 @@ export struct PreviousVideo { @StorageLink('currentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_LG; @StorageLink('currentTopIndex') currentTopIndex: number = 0; @State previousVideoImgListTwo: VideoImage[] = new VideoImgViewModel().getPreviousVideoTwo(this.currentBreakpoint); + @Consume('pageInfo') pageInfo: NavPathStack; private previousVideoImgListOne: VideoImage[] = new VideoImgViewModel().getPreviousVideoOne(); @Styles focusedStyles(): void { @@ -116,13 +116,7 @@ export struct PreviousVideo { .layoutWeight(1) .groupDefaultFocus(index === 0 ? true : false) .onClick(() => { - router.pushUrl({ - url: HomeConstants.VIDEO_DETAIL_URL, - params: { - currentTime: 0, - isLayoutFullScreen: this.currentTopIndex === 2 ? true : false - } - }) + this.pageInfo.pushPath({ name: 'VideoDetail' }); }) Blank() diff --git a/features/home/src/main/module.json5 b/features/home/src/main/module.json5 index 2c96c8af59454cd5dba40d59fa9e3a555e0a4d26..7a40a436c346c4b3523266ab801e76f4d38bcec0 100644 --- a/features/home/src/main/module.json5 +++ b/features/home/src/main/module.json5 @@ -1,14 +1,11 @@ { "module": { "name": "home", - "type": "shared", - "description": "$string:shared_desc", + "type": "har", "deviceTypes": [ "phone", "tablet", "2in1" - ], - "deliveryWithInstall": true, - "pages": "$profile:main_pages" + ] } } \ No newline at end of file diff --git a/features/home/src/main/resources/base/element/string.json b/features/home/src/main/resources/base/element/string.json index 11e582ec5ab8188f2c948bbaafafeca2fa2fa20f..51850af9b05b6b13da788e77bf319a46caa68d6e 100644 --- a/features/home/src/main/resources/base/element/string.json +++ b/features/home/src/main/resources/base/element/string.json @@ -1,9 +1,5 @@ { "string": [ - { - "name": "shared_desc", - "value": "description" - }, { "name": "tab_home", "value": "首页" diff --git a/features/search/hvigorfile.ts b/features/search/hvigorfile.ts index d993120bd71f5f5dfe04480be9dc5f73c00c2599..42187071482d292588ad40babeda74f7b8d97a23 100644 --- a/features/search/hvigorfile.ts +++ b/features/search/hvigorfile.ts @@ -1,6 +1,6 @@ -import { hspTasks } from '@ohos/hvigor-ohos-plugin'; +import { harTasks } from '@ohos/hvigor-ohos-plugin'; export default { - system: hspTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + system: harTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ } diff --git a/features/search/src/main/ets/view/SearchResult.ets b/features/search/src/main/ets/view/SearchResult.ets index f80c22a769ee9d5af5059e01b321180b61ad01ba..d24b77f3ad1727705eb21970765dd3e459c40c56 100644 --- a/features/search/src/main/ets/view/SearchResult.ets +++ b/features/search/src/main/ets/view/SearchResult.ets @@ -15,7 +15,6 @@ import { BreakpointConstants, CommonConstants } from '@ohos/commons'; import { BreakpointType } from '@ohos/commons'; -import { router } from '@kit.ArkUI'; import { SearchConstants } from '../constants/SearchConstants'; import { SearchVideoImg, SearchVideoImgModel } from '../viewmodel/SearchVideoImgViewModel'; @@ -23,6 +22,7 @@ import { SearchVideoImg, SearchVideoImgModel } from '../viewmodel/SearchVideoImg export struct SearchResult { @StorageLink('currentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_LG; @State resultTabIndex: number = 0; + @Consume('pageInfo') pageInfo: NavPathStack; build() { Scroll() { @@ -163,12 +163,7 @@ export struct SearchResult { .fontColor(Color.White) .layoutWeight(1) .onClick(() => { - router.pushUrl({ - url: SearchConstants.VIDEO_DETAIL_URL, - params: { - currentTime: 0 - } - }) + this.pageInfo.pushPath({ name: 'VideoDetail' }); }) Blank() diff --git a/features/search/src/main/module.json5 b/features/search/src/main/module.json5 index 6924576589c68bc6936e404887a1c0ed2d597860..c3b61dabec00f0bf80f00358e2f75580864a7bcd 100644 --- a/features/search/src/main/module.json5 +++ b/features/search/src/main/module.json5 @@ -1,13 +1,11 @@ { "module": { "name": "search", - "type": "shared", - "description": "$string:shared_desc", + "type": "har", "deviceTypes": [ "phone", "tablet", "2in1" - ], - "deliveryWithInstall": true + ] } } \ No newline at end of file diff --git a/features/search/src/main/resources/base/element/string.json b/features/search/src/main/resources/base/element/string.json deleted file mode 100644 index 98e1d8a84b3d8539ea33e79fe2ac593a05d23bb4..0000000000000000000000000000000000000000 --- a/features/search/src/main/resources/base/element/string.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "string": [ - { - "name": "shared_desc", - "value": "description" - } - ] -} \ No newline at end of file diff --git a/features/videoDetail/Index.ets b/features/videoDetail/Index.ets index 664fba0aea13ab53ee2f579ddd49eeeb30b1b212..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391 100644 --- a/features/videoDetail/Index.ets +++ b/features/videoDetail/Index.ets @@ -1 +0,0 @@ -export { FoldStateParam } from './src/main/ets/pages/Index'; diff --git a/features/videoDetail/hvigorfile.ts b/features/videoDetail/hvigorfile.ts index d993120bd71f5f5dfe04480be9dc5f73c00c2599..42187071482d292588ad40babeda74f7b8d97a23 100644 --- a/features/videoDetail/hvigorfile.ts +++ b/features/videoDetail/hvigorfile.ts @@ -1,6 +1,6 @@ -import { hspTasks } from '@ohos/hvigor-ohos-plugin'; +import { harTasks } from '@ohos/hvigor-ohos-plugin'; export default { - system: hspTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + system: harTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ } diff --git a/features/videoDetail/src/main/ets/pages/Index.ets b/features/videoDetail/src/main/ets/pages/Index.ets deleted file mode 100644 index bdc3b8b98314ceb70acc829c58ab73d4ab3f35e2..0000000000000000000000000000000000000000 --- a/features/videoDetail/src/main/ets/pages/Index.ets +++ /dev/null @@ -1,209 +0,0 @@ -/* - * Copyright (c) 2023 Huawei Device Co., Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { Callback } from '@kit.BasicServicesKit'; -import { AvPlayerUtil, DeviceScreen, Logger, WindowUtil, BreakpointConstants, CommonConstants, DisplayUtil } from - '@ohos/commons'; -import { display, router, window } from '@kit.ArkUI'; -import { SelfComment } from '../view/SelfComment'; -import { AllComments } from '../view/AllComments'; -import { VideoDetail } from '../view/VideoDetail'; -import { DetailConstants } from '../constants/DetailConstants'; - -@Entry -@Component -export struct Index { - @StorageLink('currentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_LG; - @StorageLink('windowWidth') windowWidth: number = 0; - @StorageLink('updateTime') updateTime: number = 0; - @State commentImgHeight: string = DetailConstants.INITIAL_COMMENT_IMAGE_HEIGHT; - @State commentImgWidth: string = DetailConstants.INITIAL_COMMENT_IMAGE_WIDTH; - @State relatedVideoHeight: number = DetailConstants.INITIAL_RELATED_VIDEO_HEIGHT; - @State videoHeight: number = DetailConstants.INITIAL_VIDEO_HEIGHT; - @State screenWidth: number = DeviceScreen.getDeviceWidth(); - @State isHalfFolded: boolean = false; - private avPlayerUtil: AvPlayerUtil= new AvPlayerUtil(); - private screenHeight: number = 0; - private windowUtil?: WindowUtil; - private onDetailFoldStatusChange: Callback = (data: display.FoldStatus) => { - if (data === display.FoldStatus.FOLD_STATUS_FOLDED) { - if (this.windowUtil === undefined) { - return; - } - this.isHalfFolded = false; - this.windowUtil.setMainWindowOrientation(window.Orientation.PORTRAIT); - } else { - if (this.windowUtil === undefined) { - return; - } - this.windowUtil.setMainWindowOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED); - if (data === display.FoldStatus.FOLD_STATUS_HALF_FOLDED) { - this.isHalfFolded = true; - // Full-screen playback. - router.pushUrl({ - url: DetailConstants.FULL_SCREEN_URL, - params: new FoldStateParam(this.isHalfFolded) - }); - } else { - this.isHalfFolded = false; - } - } - }; - - aboutToAppear() { - DisplayUtil.getFoldCreaseRegion(); - this.screenHeight = DeviceScreen.getDeviceHeight(); - this.windowUtil = WindowUtil.getInstance(); - - if (this.windowUtil === undefined) { - return; - } - if (this.currentBreakpoint === BreakpointConstants.BREAKPOINT_MD && display.isFoldable()) { - this.windowUtil.setMainWindowOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED); - } - } - - aboutToDisappear() { - this.updateTime = 0; - if (this.windowUtil === undefined) { - return; - } - if (this.currentBreakpoint === BreakpointConstants.BREAKPOINT_MD && display.isFoldable()) { - this.windowUtil.setMainWindowOrientation(window.Orientation.PORTRAIT); - } - this.avPlayerUtil.release(); - } - - onPageShow() { - try { - display.on('foldStatusChange', this.onDetailFoldStatusChange); - } catch (exception) { - Logger.error('Failed to register callback. Code: ' + JSON.stringify(exception)); - } - if (this.windowUtil === undefined) { - return; - } - if (this.currentBreakpoint === BreakpointConstants.BREAKPOINT_MD && display.isFoldable()) { - this.isHalfFolded = false; - } - this.avPlayerUtil.setStartTime(this.updateTime); - this.avPlayerUtil.playerStateControl(); - this.avPlayerUtil.onTimeUpdate(); - } - - onPageHide() { - try { - display.off('foldStatusChange'); - } catch (exception) { - Logger.error('Failed to unregister callback. Code: ' + JSON.stringify(exception)); - } - this.avPlayerUtil.pause(); - this.avPlayerUtil.offTimeUpdate(); - } - - build() { - GridRow({ - columns: { - sm: BreakpointConstants.GRID_ROW_COLUMNS[2], - md: BreakpointConstants.GRID_ROW_COLUMNS[0], - lg: BreakpointConstants.GRID_ROW_COLUMNS[0] - } - }) { - GridCol({ - span: { - sm: BreakpointConstants.GRID_COLUMN_SPANS[5], - md: BreakpointConstants.GRID_COLUMN_SPANS[0], - lg: BreakpointConstants.GRID_COLUMN_SPANS[0] - } - }) { - SideBarContainer() { - Column() { - Scroll() { - AllComments({ commentImgHeight: $commentImgHeight, commentImgWidth: $commentImgWidth }) - .visibility(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG ? Visibility.Visible : - Visibility.None) - } - .align(Alignment.Top) - .scrollBar(BarState.Off) - .layoutWeight(1) - .width(CommonConstants.FULL_PERCENT) - .padding({ bottom: $r('app.float.side_scroll_padding') }) - - SelfComment() - .visibility(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG ? Visibility.Visible : - Visibility.None) - } - .justifyContent(FlexAlign.Start) - .height(CommonConstants.FULL_PERCENT) - .width(CommonConstants.FULL_PERCENT) - .backgroundColor(Color.White) - .onAreaChange((newValue: Area) => { - if (newValue.width !== 0) { - let height: number = DetailConstants.COMMENT_IMAGE_MIN_HEIGHT_NUMBER + (Number(newValue.width) - - DetailConstants.SIDE_BAR_MIN_WIDTH_NUMBER) / (this.windowWidth * DetailConstants.COMMENTS_AREA_PERCENT - - DetailConstants.SIDE_BAR_MIN_WIDTH_NUMBER) * (DetailConstants.COMMENT_IMAGE_MAX_HEIGHT_NUMBER - - DetailConstants.COMMENT_IMAGE_MIN_HEIGHT_NUMBER); - let width: number = DetailConstants.COMMENT_IMAGE_MIN_WIDTH_NUMBER + (Number(newValue.width) - - DetailConstants.SIDE_BAR_MIN_WIDTH_NUMBER) / (this.windowWidth * DetailConstants.COMMENTS_AREA_PERCENT - - DetailConstants.SIDE_BAR_MIN_WIDTH_NUMBER) * (DetailConstants.COMMENT_IMAGE_MAX_WIDTH_NUMBER - - DetailConstants.COMMENT_IMAGE_MIN_WIDTH_NUMBER); - this.commentImgHeight = JSON.stringify(height); - this.commentImgWidth = JSON.stringify(width); - } - }) - - Column() { - VideoDetail({ screenHeight: this.screenHeight, avPlayerUtil: this.avPlayerUtil, relatedVideoHeight: - $relatedVideoHeight, videoHeight: $videoHeight, isHalfFolded: $isHalfFolded }) - .layoutWeight(1) - SelfComment() - .visibility(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG ? Visibility.None : - Visibility.Visible) - } - .height(CommonConstants.FULL_PERCENT) - .width(CommonConstants.FULL_PERCENT) - } - .showSideBar(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG ? true : false) - .showControlButton(false) - .autoHide(false) - .sideBarPosition(SideBarPosition.End) - .sideBarWidth($r('app.float.side_bar_min_width')) - .minSideBarWidth($r('app.float.side_bar_min_width')) - .maxSideBarWidth(px2vp(this.windowWidth * DetailConstants.COMMENTS_AREA_PERCENT)) - } - .height(CommonConstants.FULL_PERCENT) - } - .width(CommonConstants.FULL_PERCENT) - .height(CommonConstants.FULL_PERCENT) - .onBreakpointChange((breakPoints) => { - if (breakPoints !== BreakpointConstants.BREAKPOINT_LG && this.videoHeight < DetailConstants.INITIAL_VIDEO_HEIGHT) - { - this.relatedVideoHeight = 0; - } else if (breakPoints === BreakpointConstants.BREAKPOINT_LG) { - this.relatedVideoHeight = DetailConstants.INITIAL_RELATED_VIDEO_HEIGHT; - } else { - Logger.info(`No specific function`); - } - }) - } -} - -export class FoldStateParam { - isHalfFolded: boolean; - - constructor(isHalfFolded: boolean) { - this.isHalfFolded = isHalfFolded; - } -} \ No newline at end of file diff --git a/features/videoDetail/src/main/ets/view/VideoDetail.ets b/features/videoDetail/src/main/ets/view/VideoDetail.ets index 40ca4f55619ffb84eaa3b609519d70b253a051b3..6a120cd6dd9f9d4653abf2e34199c9aae769eba3 100644 --- a/features/videoDetail/src/main/ets/view/VideoDetail.ets +++ b/features/videoDetail/src/main/ets/view/VideoDetail.ets @@ -13,187 +13,191 @@ * limitations under the License. */ -import { BreakpointConstants, CommonConstants } from '@ohos/commons'; -import { AvPlayerUtil, Logger } from '@ohos/commons'; -import { router } from '@kit.ArkUI'; -import { RelatedList } from './RelatedList'; -import { CurrentOffsetUtil } from '../utils/CurrentOffsetUtil'; +import { Callback } from '@kit.BasicServicesKit'; +import { display, window } from '@kit.ArkUI'; +import { AvPlayerUtil, DeviceScreen, Logger, WindowUtil, BreakpointConstants, CommonConstants, DisplayUtil } from '@ohos/commons'; +import { SelfComment } from './SelfComment'; +import { AllComments } from './AllComments'; +import { VideoDetailView } from './VideoDetailView'; import { DetailConstants } from '../constants/DetailConstants'; -import { FoldStateParam } from '../pages/Index'; @Component export struct VideoDetail { - @StorageLink('currentTime') currentTime: string = CommonConstants.INITIAL_TIME; - @StorageLink('totalTime') totalTime: string = CommonConstants.INITIAL_TIME; - @StorageLink('progress') progress: number = 0; @StorageLink('currentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_LG; - @Link relatedVideoHeight: number; - @Link videoHeight: number; - @Link isHalfFolded: boolean; - private avPlayerUtil: AvPlayerUtil = new AvPlayerUtil(); + @StorageLink('windowWidth') windowWidth: number = 0; + @StorageLink('updateTime') updateTime: number = 0; + @StorageLink('isHalfFolded') isHalfFolded: boolean = false; + @Consume('pageInfo') pageInfo: NavPathStack; + @State commentImgHeight: string = DetailConstants.INITIAL_COMMENT_IMAGE_HEIGHT; + @State commentImgWidth: string = DetailConstants.INITIAL_COMMENT_IMAGE_WIDTH; + @State relatedVideoHeight: number = DetailConstants.INITIAL_RELATED_VIDEO_HEIGHT; + @State videoHeight: number = DetailConstants.INITIAL_VIDEO_HEIGHT; + @State screenWidth: number = DeviceScreen.getDeviceWidth(); + private avPlayerUtil: AvPlayerUtil= new AvPlayerUtil(); private screenHeight: number = 0; - private surfaceId: string = ''; - private xComponentController: XComponentController = new XComponentController(); - private scroller: Scroller = new Scroller(); + private windowUtil?: WindowUtil; + private onDetailFoldStatusChange: Callback = (data: display.FoldStatus) => { + if (data === display.FoldStatus.FOLD_STATUS_FOLDED) { + if (this.windowUtil === undefined) { + return; + } + this.isHalfFolded = false; + this.windowUtil.setMainWindowOrientation(window.Orientation.PORTRAIT); + } else { + if (this.windowUtil === undefined) { + return; + } + this.windowUtil.setMainWindowOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED); + if (data === display.FoldStatus.FOLD_STATUS_HALF_FOLDED) { + this.isHalfFolded = true; + // Full-screen playback. + this.pageInfo.pushPath({ name: 'VideoPlayer' }); + } else { + this.isHalfFolded = false; + } + } + }; - build() { - Scroll(this.scroller) { - Column() { - Column() { - Stack({ alignContent: Alignment.Bottom }) { - XComponent({ - id: DetailConstants.VIDEO_DETAIL, - type: XComponentType.SURFACE, - controller: this.xComponentController - }) - .onLoad(() => { - this.xComponentController.setXComponentSurfaceSize({ - surfaceWidth: CommonConstants.X_COMPONENT_SURFACE_WIDTH, - surfaceHeight: CommonConstants.X_COMPONENT_SURFACE_HEIGHT - }); - this.surfaceId = this.xComponentController.getXComponentSurfaceId(); - this.avPlayerUtil.createAvPlayer(this.surfaceId, false); - }) - .width(this.videoHeight + DetailConstants.PERCENT_SIGN) - .height(CommonConstants.FULL_PERCENT) - .aspectRatio(CommonConstants.VIDEO_ASPECT_RATIO) + aboutToAppear() { + DisplayUtil.getFoldCreaseRegion(); + this.screenHeight = DeviceScreen.getDeviceHeight(); + this.windowUtil = WindowUtil.getInstance(); - Row() { - TimeText({ time: $currentTime }) - .margin({ - left: $r('app.float.current_time_text_left'), - right: $r('app.float.current_time_text_right') - }) + if (this.windowUtil === undefined) { + return; + } + if (this.currentBreakpoint === BreakpointConstants.BREAKPOINT_MD && display.isFoldable()) { + this.windowUtil.setMainWindowOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED); + } + } - Slider({ min: 0, max: CommonConstants.PROGRESS_HUNDRED, step: 1, value: this.progress }) - .onChange((value: number, mode: SliderChangeMode) => { - this.avPlayerUtil.sliderChange(value, mode); - }) - .layoutWeight(1) - .selectedColor($r('app.color.episodes_font')) + aboutToDisappear() { + this.updateTime = 0; + if (this.windowUtil === undefined) { + return; + } + if (this.currentBreakpoint === BreakpointConstants.BREAKPOINT_MD && display.isFoldable()) { + this.windowUtil.setMainWindowOrientation(window.Orientation.PORTRAIT); + } + this.avPlayerUtil.release(); + } - TimeText({ time: $totalTime }) - .margin({ - left: $r('app.float.total_time_text_left'), - right: $r('app.float.total_time_text_right') - }) + build() { + NavDestination() { + GridRow({ + columns: { + sm: BreakpointConstants.GRID_ROW_COLUMNS[2], + md: BreakpointConstants.GRID_ROW_COLUMNS[0], + lg: BreakpointConstants.GRID_ROW_COLUMNS[0] + } + }) { + GridCol({ + span: { + sm: BreakpointConstants.GRID_COLUMN_SPANS[5], + md: BreakpointConstants.GRID_COLUMN_SPANS[0], + lg: BreakpointConstants.GRID_COLUMN_SPANS[0] + } + }) { + SideBarContainer() { + Column() { + Scroll() { + AllComments({ commentImgHeight: $commentImgHeight, commentImgWidth: $commentImgWidth }) + .visibility(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG ? Visibility.Visible : + Visibility.None) + } + .align(Alignment.Top) + .scrollBar(BarState.Off) + .layoutWeight(1) + .width(CommonConstants.FULL_PERCENT) + .padding({ bottom: $r('app.float.side_scroll_padding') }) - Image($r('app.media.ic_public_enlarge')) - .height($r('app.float.enlarge_size')) - .width($r('app.float.enlarge_size')) - .margin({ right: $r('app.float.enlarge_margin') }) - .fillColor(Color.White) - .onClick(() => { - // Full-screen playback. - router.pushUrl({ - url: DetailConstants.FULL_SCREEN_URL, - params: new FoldStateParam(this.isHalfFolded) - }); - }) + SelfComment() + .visibility(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG ? Visibility.Visible : + Visibility.None) } + .justifyContent(FlexAlign.Start) + .height(CommonConstants.FULL_PERCENT) .width(CommonConstants.FULL_PERCENT) - .height($r('app.float.time_row_height')) - .alignItems(VerticalAlign.Center) + .backgroundColor(Color.White) + .onAreaChange((newValue: Area) => { + if (newValue.width !== 0) { + let height: number = DetailConstants.COMMENT_IMAGE_MIN_HEIGHT_NUMBER + (Number(newValue.width) - + DetailConstants.SIDE_BAR_MIN_WIDTH_NUMBER) / (this.windowWidth * DetailConstants.COMMENTS_AREA_PERCENT - + DetailConstants.SIDE_BAR_MIN_WIDTH_NUMBER) * (DetailConstants.COMMENT_IMAGE_MAX_HEIGHT_NUMBER - + DetailConstants.COMMENT_IMAGE_MIN_HEIGHT_NUMBER); + let width: number = DetailConstants.COMMENT_IMAGE_MIN_WIDTH_NUMBER + (Number(newValue.width) - + DetailConstants.SIDE_BAR_MIN_WIDTH_NUMBER) / (this.windowWidth * DetailConstants.COMMENTS_AREA_PERCENT - + DetailConstants.SIDE_BAR_MIN_WIDTH_NUMBER) * (DetailConstants.COMMENT_IMAGE_MAX_WIDTH_NUMBER - + DetailConstants.COMMENT_IMAGE_MIN_WIDTH_NUMBER); + this.commentImgHeight = JSON.stringify(height); + this.commentImgWidth = JSON.stringify(width); + } + }) - Image($r('app.media.ic_public_back')) - .height($r('app.float.back_size')) - .width($r('app.float.back_size')) - .position({ - x: $r('app.float.back_position_x'), - y: $r('app.float.back_position_y') - }) - .fillColor(Color.White) - .onClick(() => { - router.back(); + Column() { + VideoDetailView({ + screenHeight: this.screenHeight, + avPlayerUtil: this.avPlayerUtil, + relatedVideoHeight: + $relatedVideoHeight, + videoHeight: $videoHeight }) + .layoutWeight(1) + SelfComment() + .visibility(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG ? Visibility.None : + Visibility.Visible) + } + .height(CommonConstants.FULL_PERCENT) + .width(CommonConstants.FULL_PERCENT) } - .width(CommonConstants.FULL_PERCENT) - .backgroundColor(Color.Black) - .onClick(() => { - this.avPlayerUtil.playerStateControl(); - }) - - RelatedList({ relatedVideoHeight: $relatedVideoHeight, videoHeight: $videoHeight, screenHeight: - this.screenHeight }) + .showSideBar(this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG ? true : false) + .showControlButton(false) + .autoHide(false) + .sideBarPosition(SideBarPosition.End) + .sideBarWidth($r('app.float.side_bar_min_width')) + .minSideBarWidth($r('app.float.side_bar_min_width')) + .maxSideBarWidth(px2vp(this.windowWidth * DetailConstants.COMMENTS_AREA_PERCENT)) } - .justifyContent(FlexAlign.Start) + .height(CommonConstants.FULL_PERCENT) } .width(CommonConstants.FULL_PERCENT) - .padding({ bottom: $r('app.float.video_col_padding') }) - } - .scrollable(ScrollDirection.Vertical) - .scrollBar(BarState.Off) - .height(CommonConstants.FULL_PERCENT) - .onScrollFrameBegin((offset: number) => { - if (this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG) { - if ((offset > 0) && (this.videoHeight > DetailConstants.MIN_VIDEO_PERCENT)) { - // Video zoom-out logic. - // Percentage of screen height by sliding. - let offsetPercent = (Math.abs(offset) * DetailConstants.MAX_VIDEO_PERCENT) / this.screenHeight; - // Video shrinkage percentage. - let heightOffset = offsetPercent < this.videoHeight - DetailConstants.MIN_VIDEO_PERCENT ? offsetPercent : - this.videoHeight - DetailConstants.MIN_VIDEO_PERCENT; - this.videoHeight = this.videoHeight - heightOffset; - } else if ((offset < 0) && (this.videoHeight < DetailConstants.MAX_VIDEO_PERCENT) && - (CurrentOffsetUtil.scrollToTop(JSON.stringify(this.scroller.currentOffset())))) { - // Video magnification logic. - let offsetPercent = (Math.abs(offset) * DetailConstants.MAX_VIDEO_PERCENT) / this.screenHeight; - let heightOffset = offsetPercent < DetailConstants.MAX_VIDEO_PERCENT - this.videoHeight ? offsetPercent : - DetailConstants.MAX_VIDEO_PERCENT - this.videoHeight; - this.videoHeight = this.videoHeight + heightOffset; - } else { - Logger.info(`No specific function`); - } - } else { - if ((offset > 0) && (this.videoHeight === DetailConstants.MAX_VIDEO_PERCENT) && (this.relatedVideoHeight > 0)) { - // Related list shrinking logic. - // Percentage of screen height by sliding. - let offsetPercent = (Math.abs(offset) * DetailConstants.TEN) / this.screenHeight; - this.relatedVideoHeight = (this.relatedVideoHeight - offsetPercent * DetailConstants.RELATED_LIST_HEIGHT) < - 0 ? 0 : (this.relatedVideoHeight - offsetPercent * DetailConstants.RELATED_LIST_HEIGHT); - } else if ((offset > 0) && (this.videoHeight > DetailConstants.MIN_VIDEO_PERCENT) && - (this.relatedVideoHeight === 0)) { - // Video zoom-out logic. - // Percentage of screen height by sliding. - let offsetPercent = (Math.abs(offset) * DetailConstants.MAX_VIDEO_PERCENT) / this.screenHeight; - // Video shrinkage percentage. - let heightOffset = offsetPercent < this.videoHeight - DetailConstants.MIN_VIDEO_PERCENT ? offsetPercent : - this.videoHeight - DetailConstants.MIN_VIDEO_PERCENT; - this.videoHeight = this.videoHeight - heightOffset; - } else if ((this.videoHeight < DetailConstants.MAX_VIDEO_PERCENT) && (this.relatedVideoHeight === 0) - && (offset < 0) && (CurrentOffsetUtil.scrollToTop(JSON.stringify(this.scroller.currentOffset())))) { - // Video magnification logic. - let offsetPercent = (Math.abs(offset) * DetailConstants.MAX_VIDEO_PERCENT) / this.screenHeight; - let heightOffset = offsetPercent < DetailConstants.MAX_VIDEO_PERCENT - this.videoHeight ? offsetPercent : - DetailConstants.MAX_VIDEO_PERCENT - this.videoHeight; - this.videoHeight = this.videoHeight + heightOffset; - } else if ((offset < 0) && (this.videoHeight === DetailConstants.MAX_VIDEO_PERCENT) && - (this.relatedVideoHeight >= 0)) { - // Related list enlargement logic. - // Percentage of screen height by sliding. - let offsetPercent = (Math.abs(offset) * DetailConstants.TEN) / this.screenHeight; - this.relatedVideoHeight = (this.relatedVideoHeight + offsetPercent * DetailConstants.RELATED_LIST_HEIGHT) > - DetailConstants.RELATED_LIST_HEIGHT ? DetailConstants.RELATED_LIST_HEIGHT : (this.relatedVideoHeight + - offsetPercent * DetailConstants.RELATED_LIST_HEIGHT); + .height(CommonConstants.FULL_PERCENT) + .onBreakpointChange((breakPoints) => { + if (breakPoints !== BreakpointConstants.BREAKPOINT_LG && + this.videoHeight < DetailConstants.INITIAL_VIDEO_HEIGHT) { + this.relatedVideoHeight = 0; + } else if (breakPoints === BreakpointConstants.BREAKPOINT_LG) { + this.relatedVideoHeight = DetailConstants.INITIAL_RELATED_VIDEO_HEIGHT; } else { Logger.info(`No specific function`); } + }) + } + .hideTitleBar(true) + .onShown(() => { + try { + display.on('foldStatusChange', this.onDetailFoldStatusChange); + } catch (exception) { + Logger.error('Failed to register callback. Code: ' + JSON.stringify(exception)); } - // Returns the actual offset 0. - return { offsetRemain: 0 }; + if (this.windowUtil === undefined) { + return; + } + if (this.currentBreakpoint === BreakpointConstants.BREAKPOINT_MD && display.isFoldable()) { + this.isHalfFolded = false; + } + this.avPlayerUtil.setStartTime(this.updateTime); + this.avPlayerUtil.playerStateControl(); + this.avPlayerUtil.onTimeUpdate(); + }) + .onHidden(() => { + try { + display.off('foldStatusChange'); + } catch (exception) { + Logger.error('Failed to unregister callback. Code: ' + JSON.stringify(exception)); + } + this.avPlayerUtil.pause(); + this.avPlayerUtil.offTimeUpdate(); }) - } -} - -@Component -struct TimeText { - @Link time: string; - - build() { - Text(this.time) - .fontSize($r('app.float.time_font')) - .fontColor(Color.White) - .lineHeight($r('app.float.time_text_line')) - .width($r('app.float.time_text_width')) } } \ No newline at end of file diff --git a/features/videoDetail/src/main/ets/view/VideoDetailView.ets b/features/videoDetail/src/main/ets/view/VideoDetailView.ets new file mode 100644 index 0000000000000000000000000000000000000000..81c601fdf9cd629bf20ab449c307d367ea3ce8ff --- /dev/null +++ b/features/videoDetail/src/main/ets/view/VideoDetailView.ets @@ -0,0 +1,197 @@ +/* + * Copyright (c) 2023 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { BreakpointConstants, CommonConstants } from '@ohos/commons'; +import { AvPlayerUtil, Logger } from '@ohos/commons'; +import { RelatedList } from './RelatedList'; +import { CurrentOffsetUtil } from '../utils/CurrentOffsetUtil'; +import { DetailConstants } from '../constants/DetailConstants'; + +@Component +export struct VideoDetailView { + @StorageLink('currentTime') currentTime: string = CommonConstants.INITIAL_TIME; + @StorageLink('totalTime') totalTime: string = CommonConstants.INITIAL_TIME; + @StorageLink('progress') progress: number = 0; + @StorageLink('currentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_LG; + @StorageLink('isHalfFolded') isHalfFolded: boolean = false; + @Consume('pageInfo') pageInfo: NavPathStack; + @Link relatedVideoHeight: number; + @Link videoHeight: number; + private avPlayerUtil: AvPlayerUtil = new AvPlayerUtil(); + private screenHeight: number = 0; + private surfaceId: string = ''; + private xComponentController: XComponentController = new XComponentController(); + private scroller: Scroller = new Scroller(); + + build() { + Scroll(this.scroller) { + Column() { + Stack({ alignContent: Alignment.Bottom }) { + XComponent({ + id: DetailConstants.VIDEO_DETAIL, + type: XComponentType.SURFACE, + controller: this.xComponentController + }) + .onLoad(() => { + this.surfaceId = this.xComponentController.getXComponentSurfaceId(); + this.avPlayerUtil.createAvPlayer(this.surfaceId, false); + }) + .width(this.videoHeight + DetailConstants.PERCENT_SIGN) + .height(CommonConstants.FULL_PERCENT) + .aspectRatio(CommonConstants.VIDEO_ASPECT_RATIO) + + Row() { + TimeText({ time: $currentTime }) + .margin({ + left: $r('app.float.current_time_text_left'), + right: $r('app.float.current_time_text_right') + }) + + Slider({ + min: 0, + max: CommonConstants.PROGRESS_HUNDRED, + step: 1, + value: this.progress + }) + .onChange((value: number, mode: SliderChangeMode) => { + this.avPlayerUtil.sliderChange(value, mode); + }) + .layoutWeight(1) + .selectedColor($r('app.color.episodes_font')) + + TimeText({ time: $totalTime }) + .margin({ + left: $r('app.float.total_time_text_left'), + right: $r('app.float.total_time_text_right') + }) + + Image($r('app.media.ic_public_enlarge')) + .height($r('app.float.enlarge_size')) + .width($r('app.float.enlarge_size')) + .margin({ right: $r('app.float.enlarge_margin') }) + .fillColor(Color.White) + .onClick(() => { + // Full-screen playback. + this.pageInfo.pushPath({ name: 'VideoPlayer' }); + }) + } + .width(CommonConstants.FULL_PERCENT) + .height($r('app.float.time_row_height')) + .alignItems(VerticalAlign.Center) + + Image($r('app.media.ic_public_back')) + .height($r('app.float.back_size')) + .width($r('app.float.back_size')) + .position({ + x: $r('app.float.back_position_x'), + y: $r('app.float.back_position_y') + }) + .fillColor(Color.White) + .onClick(() => { + this.pageInfo.pop(); + }) + } + .width(CommonConstants.FULL_PERCENT) + .backgroundColor(Color.Black) + .onClick(() => { + this.avPlayerUtil.playerStateControl(); + }) + + RelatedList({ + relatedVideoHeight: $relatedVideoHeight, + videoHeight: $videoHeight, + screenHeight: this.screenHeight + }) + } + .width(CommonConstants.FULL_PERCENT) + .justifyContent(FlexAlign.Start) + .padding({ bottom: $r('app.float.video_col_padding') }) + } + .scrollable(ScrollDirection.Vertical) + .scrollBar(BarState.Off) + .height(CommonConstants.FULL_PERCENT) + .onScrollFrameBegin((offset: number) => { + if (this.currentBreakpoint === BreakpointConstants.BREAKPOINT_LG) { + if ((offset > 0) && (this.videoHeight > DetailConstants.MIN_VIDEO_PERCENT)) { + // Video zoom-out logic. + // Percentage of screen height by sliding. + let offsetPercent = (Math.abs(offset) * DetailConstants.MAX_VIDEO_PERCENT) / this.screenHeight; + // Video shrinkage percentage. + let heightOffset = offsetPercent < this.videoHeight - DetailConstants.MIN_VIDEO_PERCENT ? offsetPercent : + this.videoHeight - DetailConstants.MIN_VIDEO_PERCENT; + this.videoHeight = this.videoHeight - heightOffset; + } else if ((offset < 0) && (this.videoHeight < DetailConstants.MAX_VIDEO_PERCENT) && + (CurrentOffsetUtil.scrollToTop(JSON.stringify(this.scroller.currentOffset())))) { + // Video magnification logic. + let offsetPercent = (Math.abs(offset) * DetailConstants.MAX_VIDEO_PERCENT) / this.screenHeight; + let heightOffset = offsetPercent < DetailConstants.MAX_VIDEO_PERCENT - this.videoHeight ? offsetPercent : + DetailConstants.MAX_VIDEO_PERCENT - this.videoHeight; + this.videoHeight = this.videoHeight + heightOffset; + } else { + Logger.info(`No specific function`); + } + } else { + if ((offset > 0) && (this.videoHeight === DetailConstants.MAX_VIDEO_PERCENT) && (this.relatedVideoHeight > 0)) { + // Related list shrinking logic. + // Percentage of screen height by sliding. + let offsetPercent = (Math.abs(offset) * DetailConstants.TEN) / this.screenHeight; + this.relatedVideoHeight = (this.relatedVideoHeight - offsetPercent * DetailConstants.RELATED_LIST_HEIGHT) < + 0 ? 0 : (this.relatedVideoHeight - offsetPercent * DetailConstants.RELATED_LIST_HEIGHT); + } else if ((offset > 0) && (this.videoHeight > DetailConstants.MIN_VIDEO_PERCENT) && + (this.relatedVideoHeight === 0)) { + // Video zoom-out logic. + // Percentage of screen height by sliding. + let offsetPercent = (Math.abs(offset) * DetailConstants.MAX_VIDEO_PERCENT) / this.screenHeight; + // Video shrinkage percentage. + let heightOffset = offsetPercent < this.videoHeight - DetailConstants.MIN_VIDEO_PERCENT ? offsetPercent : + this.videoHeight - DetailConstants.MIN_VIDEO_PERCENT; + this.videoHeight = this.videoHeight - heightOffset; + } else if ((this.videoHeight < DetailConstants.MAX_VIDEO_PERCENT) && (this.relatedVideoHeight === 0) + && (offset < 0) && (CurrentOffsetUtil.scrollToTop(JSON.stringify(this.scroller.currentOffset())))) { + // Video magnification logic. + let offsetPercent = (Math.abs(offset) * DetailConstants.MAX_VIDEO_PERCENT) / this.screenHeight; + let heightOffset = offsetPercent < DetailConstants.MAX_VIDEO_PERCENT - this.videoHeight ? offsetPercent : + DetailConstants.MAX_VIDEO_PERCENT - this.videoHeight; + this.videoHeight = this.videoHeight + heightOffset; + } else if ((offset < 0) && (this.videoHeight === DetailConstants.MAX_VIDEO_PERCENT) && + (this.relatedVideoHeight >= 0)) { + // Related list enlargement logic. + // Percentage of screen height by sliding. + let offsetPercent = (Math.abs(offset) * DetailConstants.TEN) / this.screenHeight; + this.relatedVideoHeight = (this.relatedVideoHeight + offsetPercent * DetailConstants.RELATED_LIST_HEIGHT) > + DetailConstants.RELATED_LIST_HEIGHT ? DetailConstants.RELATED_LIST_HEIGHT : (this.relatedVideoHeight + + offsetPercent * DetailConstants.RELATED_LIST_HEIGHT); + } else { + Logger.info(`No specific function`); + } + } + // Returns the actual offset 0. + return { offsetRemain: 0 }; + }) + } +} + +@Component +struct TimeText { + @Link time: string; + + build() { + Text(this.time) + .fontSize($r('app.float.time_font')) + .fontColor(Color.White) + .lineHeight($r('app.float.time_text_line')) + .width($r('app.float.time_text_width')) + } +} \ No newline at end of file diff --git a/features/videoDetail/src/main/module.json5 b/features/videoDetail/src/main/module.json5 index 41b6b591db54c3dcd36b30d5b1f4ac4f7e8e392a..77b02323e24845455f55f7d74f86aff6ac37e4ed 100644 --- a/features/videoDetail/src/main/module.json5 +++ b/features/videoDetail/src/main/module.json5 @@ -1,14 +1,11 @@ { "module": { "name": "videoDetail", - "type": "shared", - "description": "$string:shared_desc", + "type": "har", "deviceTypes": [ "phone", "tablet", "2in1" - ], - "deliveryWithInstall": true, - "pages": "$profile:main_pages" + ] } } \ No newline at end of file diff --git a/features/videoDetail/src/main/resources/base/element/string.json b/features/videoDetail/src/main/resources/base/element/string.json deleted file mode 100644 index 98e1d8a84b3d8539ea33e79fe2ac593a05d23bb4..0000000000000000000000000000000000000000 --- a/features/videoDetail/src/main/resources/base/element/string.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "string": [ - { - "name": "shared_desc", - "value": "description" - } - ] -} \ No newline at end of file diff --git a/features/videoDetail/src/main/resources/base/profile/main_pages.json b/features/videoDetail/src/main/resources/base/profile/main_pages.json deleted file mode 100644 index 1898d94f58d6128ab712be2c68acc7c98e9ab9ce..0000000000000000000000000000000000000000 --- a/features/videoDetail/src/main/resources/base/profile/main_pages.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "src": [ - "pages/Index" - ] -} diff --git a/features/videoPlayer/Index.ets b/features/videoPlayer/Index.ets index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..fc4df002478ca6153389e8dadee4b3db4047fc81 100644 --- a/features/videoPlayer/Index.ets +++ b/features/videoPlayer/Index.ets @@ -0,0 +1 @@ +export { VideoPlayer } from './src/main/ets/view/VideoPlayer'; \ No newline at end of file diff --git a/features/videoPlayer/hvigorfile.ts b/features/videoPlayer/hvigorfile.ts index d993120bd71f5f5dfe04480be9dc5f73c00c2599..42187071482d292588ad40babeda74f7b8d97a23 100644 --- a/features/videoPlayer/hvigorfile.ts +++ b/features/videoPlayer/hvigorfile.ts @@ -1,6 +1,6 @@ -import { hspTasks } from '@ohos/hvigor-ohos-plugin'; +import { harTasks } from '@ohos/hvigor-ohos-plugin'; export default { - system: hspTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + system: harTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ } diff --git a/features/videoPlayer/src/main/ets/pages/Index.ets b/features/videoPlayer/src/main/ets/view/VideoPlayer.ets similarity index 48% rename from features/videoPlayer/src/main/ets/pages/Index.ets rename to features/videoPlayer/src/main/ets/view/VideoPlayer.ets index 925610a7ec6ceb53f3f963324f54108b252d5964..0b289fed5ddcdbf7336313ff45b8599d6bd1f8c8 100644 --- a/features/videoPlayer/src/main/ets/pages/Index.ets +++ b/features/videoPlayer/src/main/ets/view/VideoPlayer.ets @@ -13,18 +13,16 @@ * limitations under the License. */ -import { display, router, window } from '@kit.ArkUI'; +import { display, window } from '@kit.ArkUI'; import { Callback, deviceInfo } from '@kit.BasicServicesKit'; -import { BreakpointConstants, CommonConstants } from '@ohos/commons'; -import { AvPlayerUtil, Logger, WindowUtil } from '@ohos/commons'; -import { FoldStateParam } from '@ohos/detail'; +import { BreakpointConstants, CommonConstants } from '@ohos/commons/'; +import { AvPlayerUtil, Logger, WindowUtil } from '@ohos/commons/'; import { PlayerConstants } from '../constants/PlayerConstants'; -import { FooterEpisodes } from '../view/FooterEpisodes'; -import { SideEpisodes } from '../view/SideEpisodes'; +import { FooterEpisodes } from './FooterEpisodes'; +import { SideEpisodes } from './SideEpisodes'; -@Entry @Component -struct Index { +export struct VideoPlayer { @StorageLink('currentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_LG; @StorageLink('creaseRegion') creaseRegion: number[] = []; @StorageLink('updateTime') updateTime: number = 0; @@ -32,9 +30,10 @@ struct Index { @StorageLink('totalTime') totalTime: string = CommonConstants.INITIAL_TIME; @StorageLink('progress') progress: number = 0; @StorageLink('fullScreenPlayState') fullScreenPlayState: boolean = true; + @StorageLink('isHalfFolded') isHalfFolded: boolean = false; @State isShowingSideBar: boolean = false; @State foldStatus: display.FoldStatus = display.getFoldStatus(); - @State isHalfFolded: boolean = false; + @Consume('pageInfo') pageInfo: NavPathStack; private windowUtil?: WindowUtil; private avPlayerUtil: AvPlayerUtil = new AvPlayerUtil(); private xComponentController: XComponentController = new XComponentController(); @@ -60,20 +59,6 @@ struct Index { } }; - onPageShow(): void { - try { - display.on('foldStatusChange', this.onFoldStatusChange); - } catch (exception) { - Logger.error('Failed to register callback. Code: ' + JSON.stringify(exception)); - } - this.avPlayerUtil.onTimeUpdate(); - } - - onPageHide(): void { - this.avPlayerUtil.offTimeUpdate(); - display.off('foldStatusChange'); - } - aboutToAppear() { this.windowUtil = WindowUtil.getInstance(); @@ -86,7 +71,6 @@ struct Index { this.windowUtil.setMainWindowOrientation(window.Orientation.AUTO_ROTATION_LANDSCAPE); } if (display.isFoldable()) { - this.isHalfFolded = (router.getParams() as FoldStateParam).isHalfFolded; if (this.isHalfFolded) { this.windowUtil.setMainWindowOrientation(window.Orientation.AUTO_ROTATION_LANDSCAPE); } @@ -117,142 +101,157 @@ struct Index { } build() { - Row() { - Column() { - Stack({ alignContent: Alignment.Center }) { - Flex({ - direction: FlexDirection.Column, - justifyContent: this.isHalfFolded ? FlexAlign.Start : FlexAlign.Center, - alignItems: ItemAlign.Start - }) { - Column() { - XComponent({ - id: PlayerConstants.X_COMPONENT_ID, - type: XComponentType.SURFACE, - controller: this.xComponentController - }) - .onLoad(() => { - this.xComponentController.setXComponentSurfaceSize({ - surfaceWidth: CommonConstants.X_COMPONENT_SURFACE_WIDTH, surfaceHeight: - CommonConstants.X_COMPONENT_SURFACE_HEIGHT - }); - this.surfaceId = this.xComponentController.getXComponentSurfaceId(); - this.avPlayerUtil.createAvPlayer(this.surfaceId, true); + NavDestination() { + Row() { + Column() { + Stack({ alignContent: Alignment.Center }) { + Flex({ + direction: FlexDirection.Column, + justifyContent: this.isHalfFolded ? FlexAlign.Start : FlexAlign.Center, + alignItems: ItemAlign.Start + }) { + Column() { + XComponent({ + id: PlayerConstants.X_COMPONENT_ID, + type: XComponentType.SURFACE, + controller: this.xComponentController }) - .aspectRatio(CommonConstants.VIDEO_ASPECT_RATIO) + .onLoad(() => { + this.xComponentController.setXComponentSurfaceSize({ + surfaceWidth: CommonConstants.X_COMPONENT_SURFACE_WIDTH, surfaceHeight: + CommonConstants.X_COMPONENT_SURFACE_HEIGHT + }); + this.surfaceId = this.xComponentController.getXComponentSurfaceId(); + this.avPlayerUtil.createAvPlayer(this.surfaceId, true); + }) + .aspectRatio(CommonConstants.VIDEO_ASPECT_RATIO) + } + .justifyContent(FlexAlign.Center) + .height(this.isHalfFolded ? this.creaseRegion[0] : CommonConstants.FULL_PERCENT) + .width(CommonConstants.FULL_PERCENT) } - .justifyContent(FlexAlign.Center) - .height(this.isHalfFolded ? this.creaseRegion[0] : CommonConstants.FULL_PERCENT) .width(CommonConstants.FULL_PERCENT) - } - .width(CommonConstants.FULL_PERCENT) - .height(CommonConstants.FULL_PERCENT) - .onClick(() => { - if (this.isShowingSideBar) { - this.isShowingSideBar = false; - } - }) - - Column() { - Row() { - TimeText({ time: $currentTime }) - .margin({ - left: $r('app.float.current_time_left'), - right: $r('app.float.current_time_right') - }) + .height(CommonConstants.FULL_PERCENT) + .onClick(() => { + if (this.isShowingSideBar) { + this.isShowingSideBar = false; + } + }) - Slider({ min: 0, max: CommonConstants.PROGRESS_HUNDRED, step: 1, value: this.progress }) - .onChange((value: number, mode: SliderChangeMode) => { - this.avPlayerUtil.sliderChange(value, mode); - }) - .layoutWeight(1) - .selectedColor($r('app.color.selected_color')) + Column() { + Row() { + TimeText({ time: $currentTime }) + .margin({ + left: $r('app.float.current_time_left'), + right: $r('app.float.current_time_right') + }) - TimeText({ time: $totalTime }) - .margin({ - left: $r('app.float.total_time_left'), - right: $r('app.float.total_time_right') - }) - } - .width(CommonConstants.FULL_PERCENT) - .height($r('app.float.time_row_height')) - .alignItems(VerticalAlign.Center) + Slider({ min: 0, max: CommonConstants.PROGRESS_HUNDRED, step: 1, value: this.progress }) + .onChange((value: number, mode: SliderChangeMode) => { + this.avPlayerUtil.sliderChange(value, mode); + }) + .layoutWeight(1) + .selectedColor($r('app.color.selected_color')) - Row() { - Row() { - Image(this.fullScreenPlayState ? $r('app.media.ic_public_pause') : $r('app.media.ic_public_play')) - .height($r('app.float.icon_size')) - .width($r('app.float.icon_size')) - .margin({ left: $r('app.float.icon_margin') }) - .onClick(() => { - this.avPlayerUtil.playerStateControl(); + TimeText({ time: $totalTime }) + .margin({ + left: $r('app.float.total_time_left'), + right: $r('app.float.total_time_right') }) - ImgIcon({ img: $r('app.media.ic_public_play_next') }) - ImgIcon({ img: $r('app.media.ic_public_view_list_white') }) } - .margin({ - top: this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? '0' : $r('app.float.icon_row_top'), + .width(CommonConstants.FULL_PERCENT) + .height($r('app.float.time_row_height')) + .alignItems(VerticalAlign.Center) + + Row() { + Row() { + Image(this.fullScreenPlayState ? $r('app.media.ic_public_pause') : $r('app.media.ic_public_play')) + .height($r('app.float.icon_size')) + .width($r('app.float.icon_size')) + .margin({ left: $r('app.float.icon_margin') }) + .onClick(() => { + this.avPlayerUtil.playerStateControl(); + }) + ImgIcon({ img: $r('app.media.ic_public_play_next') }) + ImgIcon({ img: $r('app.media.ic_public_view_list_white') }) + } + .margin({ + top: this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? '0' : $r('app.float.icon_row_top'), bottom: this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? $r('app.float.icon_row_bottom_sm') : $r('app.float.icon_row_bottom') - }) + }) - Blank() + Blank() - Row() { - TextButton({ content: PlayerConstants.PLAYER_TEXT_LIST[0] }) - .onClick(() => { - this.isShowingSideBar = !this.isShowingSideBar; - }) - TextButton({ content: PlayerConstants.PLAYER_TEXT_LIST[2] }) - TextButton({ content: PlayerConstants.PLAYER_TEXT_LIST[3] }) - } - .margin({ - top: this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? $r('app.float.button_row_top_sm') : + Row() { + TextButton({ content: PlayerConstants.PLAYER_TEXT_LIST[0] }) + .onClick(() => { + this.isShowingSideBar = !this.isShowingSideBar; + }) + TextButton({ content: PlayerConstants.PLAYER_TEXT_LIST[2] }) + TextButton({ content: PlayerConstants.PLAYER_TEXT_LIST[3] }) + } + .margin({ + top: this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? $r('app.float.button_row_top_sm') : $r('app.float.button_row_top'), - bottom: this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? + bottom: this.currentBreakpoint === BreakpointConstants.BREAKPOINT_SM ? $r('app.float.button_row_bottom_sm') : $r('app.float.button_row_bottom') - }) + }) + } + .height($r('app.float.icon_button_row_height')) + .width(CommonConstants.FULL_PERCENT) } - .height($r('app.float.icon_button_row_height')) + .height(CommonConstants.FULL_PERCENT) .width(CommonConstants.FULL_PERCENT) + .justifyContent(FlexAlign.End) + .visibility(this.isShowingSideBar ? Visibility.None : Visibility.Visible) + + Image($r('app.media.ic_public_back')) + .height($r('app.float.icon_size')) + .width($r('app.float.icon_size')) + .position({ + x: $r('app.float.back_position_x'), + y: this.isHalfFolded ? this.creaseRegion[0] + this.creaseRegion[1] : $r('app.float.back_position_y') + }) + .fillColor(Color.White) + .onClick(() => { + this.pageInfo.pop(); + }) + .visibility(!this.isShowingSideBar? Visibility.Visible : Visibility.None) } - .height(CommonConstants.FULL_PERCENT) .width(CommonConstants.FULL_PERCENT) - .justifyContent(FlexAlign.End) - .visibility(this.isShowingSideBar ? Visibility.None : Visibility.Visible) + .height(this.isShowingSideBar ? this.creaseRegion[0] : CommonConstants.FULL_PERCENT) + .layoutWeight(this.isHalfFolded? 0 : 1) - Image($r('app.media.ic_public_back')) - .height($r('app.float.icon_size')) - .width($r('app.float.icon_size')) - .position({ - x: $r('app.float.back_position_x'), - y: this.isHalfFolded ? this.creaseRegion[0] + this.creaseRegion[1] : $r('app.float.back_position_y') - }) - .fillColor(Color.White) - .onClick(() => { - router.back(); - }) - .visibility(!this.isShowingSideBar? Visibility.Visible : Visibility.None) - } - .width(CommonConstants.FULL_PERCENT) - .height(this.isShowingSideBar ? this.creaseRegion[0] : CommonConstants.FULL_PERCENT) - .layoutWeight(this.isHalfFolded? 0 : 1) + Blank() + .height(this.creaseRegion[1]) + .width(CommonConstants.FULL_PERCENT) + .visibility(this.isHalfFolded && this.isShowingSideBar ? Visibility.Visible : Visibility.None) - Blank() - .height(this.creaseRegion[1]) - .width(CommonConstants.FULL_PERCENT) - .visibility(this.isHalfFolded && this.isShowingSideBar ? Visibility.Visible : Visibility.None) + FooterEpisodes({ isShowingSideBar: $isShowingSideBar, foldStatus: this.foldStatus }) + } + .layoutWeight(3) - FooterEpisodes({ isShowingSideBar: $isShowingSideBar, foldStatus: this.foldStatus }) + SideEpisodes({ isShowingSideBar: $isShowingSideBar, foldStatus: this.foldStatus }) } - .layoutWeight(3) - - SideEpisodes({ isShowingSideBar: $isShowingSideBar, foldStatus: this.foldStatus }) + .justifyContent(FlexAlign.Start) + .backgroundColor(Color.Black) + .height(CommonConstants.FULL_PERCENT) + .width(CommonConstants.FULL_PERCENT) } - .justifyContent(FlexAlign.Start) - .backgroundColor(Color.Black) - .height(CommonConstants.FULL_PERCENT) - .width(CommonConstants.FULL_PERCENT) + .hideTitleBar(true) + .onShown(() => { + try { + display.on('foldStatusChange', this.onFoldStatusChange); + } catch (exception) { + Logger.error('Failed to register callback. Code: ' + JSON.stringify(exception)); + } + this.avPlayerUtil.onTimeUpdate(); + }) + .onHidden(() => { + this.avPlayerUtil.offTimeUpdate(); + display.off('foldStatusChange'); + }) } } diff --git a/features/videoPlayer/src/main/module.json5 b/features/videoPlayer/src/main/module.json5 index b195a21fef7872694879e48e941b99c94fa823ca..e663fced613867731b96b8a96ce9dd8384481478 100644 --- a/features/videoPlayer/src/main/module.json5 +++ b/features/videoPlayer/src/main/module.json5 @@ -1,14 +1,11 @@ { "module": { "name": "videoPlayer", - "type": "shared", - "description": "$string:shared_desc", + "type": "har", "deviceTypes": [ "phone", "tablet", "2in1" - ], - "deliveryWithInstall": true, - "pages": "$profile:main_pages" + ] } } \ No newline at end of file diff --git a/features/videoPlayer/src/main/resources/base/element/string.json b/features/videoPlayer/src/main/resources/base/element/string.json deleted file mode 100644 index 98e1d8a84b3d8539ea33e79fe2ac593a05d23bb4..0000000000000000000000000000000000000000 --- a/features/videoPlayer/src/main/resources/base/element/string.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "string": [ - { - "name": "shared_desc", - "value": "description" - } - ] -} \ No newline at end of file diff --git a/features/videoPlayer/src/main/resources/base/profile/main_pages.json b/features/videoPlayer/src/main/resources/base/profile/main_pages.json deleted file mode 100644 index 1898d94f58d6128ab712be2c68acc7c98e9ab9ce..0000000000000000000000000000000000000000 --- a/features/videoPlayer/src/main/resources/base/profile/main_pages.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "src": [ - "pages/Index" - ] -} diff --git a/products/phone/oh-package.json5 b/products/phone/oh-package.json5 index 9981d612d2a68c1f4edd3375ccbae53f71bd7421..bb69c549550b68bf66160aabd70e9ea66d3535fa 100644 --- a/products/phone/oh-package.json5 +++ b/products/phone/oh-package.json5 @@ -10,6 +10,7 @@ "dependencies": { "@ohos/commons": "file:../../commons/base", "@ohos/videoDetail": "file:../../features/videoDetail", - "@ohos/home": "file:../../features/home" + "@ohos/home": "file:../../features/home", + "@ohos/videoPlayer": "file:../../features/videoPlayer" } } \ No newline at end of file diff --git a/products/phone/src/main/ets/entryability/EntryAbility.ets b/products/phone/src/main/ets/entryability/EntryAbility.ets index 17e3b22db10f3ed3ea4685ec7de4e45b8e350f0b..3b4bbdf3c03dbf022a132de1c38d9d0de94fb661 100644 --- a/products/phone/src/main/ets/entryability/EntryAbility.ets +++ b/products/phone/src/main/ets/entryability/EntryAbility.ets @@ -41,7 +41,7 @@ export default class EntryAbility extends UIAbility { }) }) - let windowUtil = WindowUtil.getInstance(); + let windowUtil: WindowUtil | undefined = WindowUtil.getInstance(); if (windowUtil !== undefined) { windowUtil.setWindowStage(windowStage); windowUtil.setMainWindowPortrait(); diff --git a/products/phone/src/main/ets/pages/Index.ets b/products/phone/src/main/ets/pages/Index.ets index 3bddf4319612097350bdea5d3bbf94b0ced7d61e..a54c27b6903600e8364b67065b0d0e953e559609 100644 --- a/products/phone/src/main/ets/pages/Index.ets +++ b/products/phone/src/main/ets/pages/Index.ets @@ -14,15 +14,41 @@ */ import { Home } from '@ohos/home'; -import { CommonConstants } from '@ohos/commons'; +import { CommonConstants, WindowUtil } from '@ohos/commons'; +import { VideoDetail } from '@ohos/videoDetail/src/main/ets/view/VideoDetail'; +import { VideoPlayer } from '@ohos/videoPlayer/Index'; @Entry @Component struct Index { + @Provide('pageInfo') pageInfo: NavPathStack = new NavPathStack(); + + aboutToDisappear(): void { + let windowUtil: WindowUtil | undefined = WindowUtil.getInstance(); + if (windowUtil === undefined) { + return; + } + windowUtil.offWindowSizeChange(); + } + + @Builder + PageMap(name: string) { + if (name === 'VideoDetail') { + VideoDetail() + } else if (name === 'VideoPlayer') { + VideoPlayer() + } + } + build() { - Column() { + Navigation(this.pageInfo) { Home() } + .mode(NavigationMode.Stack) + .navDestination(this.PageMap) + .hideToolBar(true) + .hideTitleBar(true) + .hideBackButton(true) .width(CommonConstants.FULL_PERCENT) .height(CommonConstants.FULL_PERCENT) } diff --git a/screenshots/device/config.png b/screenshots/device/config.png deleted file mode 100644 index cf40268303f270370cbccd9dadf51dc36f250fc3..0000000000000000000000000000000000000000 Binary files a/screenshots/device/config.png and /dev/null differ diff --git a/screenshots/device/run.png b/screenshots/device/run.png deleted file mode 100644 index 7655fa7e041bb067e028029d820bd2d320e2cd83..0000000000000000000000000000000000000000 Binary files a/screenshots/device/run.png and /dev/null differ