From 51d186b0967a2b21804e16ddd5e344a91f326faf Mon Sep 17 00:00:00 2001 From: hdw Date: Wed, 4 Jun 2025 17:06:35 +0800 Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E4=BF=AE=E6=94=B9=E6=A0=87?= =?UTF-8?q?=E8=AF=86=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/main/ets/utils/BreakpointType.ets | 4 +- .../home/src/main/ets/view/BannerView.ets | 4 ++ .../src/main/ets/view/RecommendedVideo.ets | 26 +++++----- .../home/src/main/ets/view/exampleTest.ets | 52 +++++++++++++++++++ .../src/main/ets/view/VideoPlayer.ets | 2 - .../main/ets/entryability/EntryAbility.ets | 10 +++- 6 files changed, 81 insertions(+), 17 deletions(-) create mode 100644 features/home/src/main/ets/view/exampleTest.ets diff --git a/commons/base/src/main/ets/utils/BreakpointType.ets b/commons/base/src/main/ets/utils/BreakpointType.ets index 95b444b..09a2231 100644 --- a/commons/base/src/main/ets/utils/BreakpointType.ets +++ b/commons/base/src/main/ets/utils/BreakpointType.ets @@ -33,10 +33,10 @@ export class BreakpointType { } getValue(currentWidthBreakpoint: string): T { - if (currentWidthBreakpoint === BreakpointConstants.BREAKPOINT_MD) { + if (currentWidthBreakpoint === 'md') { return this.md; } - if (currentWidthBreakpoint === BreakpointConstants.BREAKPOINT_LG) { + if (currentWidthBreakpoint === 'lg') { return this.lg; } else { return this.sm; diff --git a/features/home/src/main/ets/view/BannerView.ets b/features/home/src/main/ets/view/BannerView.ets index b537200..a778418 100644 --- a/features/home/src/main/ets/view/BannerView.ets +++ b/features/home/src/main/ets/view/BannerView.ets @@ -77,6 +77,7 @@ export struct BannerView { .width('100%') .focusable(true) .zIndex(1) + // [StartExclude jh_lazy_for_each] Column() { Text(item.getDescription().getIsLeftCenter().getValue(this.currentWidthBreakpoint) ? `${item.getDescription().getDescription()[0]}${item.getDescription().getDescription()[1]}` : @@ -137,8 +138,10 @@ export struct BannerView { left: this.currentWidthBreakpoint === BreakpointConstants.BREAKPOINT_SM ? $r('app.float.banner_padding_sm') : 0, right: this.currentWidthBreakpoint === BreakpointConstants.BREAKPOINT_SM ? $r('app.float.banner_padding_sm') : 0 }) + // [EndExclude jh_lazy_for_each] }, (item: Banner, index: number) => index + JSON.stringify(item)) } + // [StartExclude jh_lazy_for_each] .displayCount(this.currentWidthBreakpoint === BreakpointConstants.BREAKPOINT_SM ? 1 : HomeConstants.TWO) // Interval between banner images .itemSpace(HomeConstants.SWIPER_ITEM_SPACE) @@ -166,6 +169,7 @@ export struct BannerView { .effectMode(EdgeEffect.None) // The sizes of the front and rear banners on the MD and LG devices are different. .index(2) + // [EndExclude jh_lazy_for_each] .tabIndex(getTabIndex('Banner')) // [End jh_lazy_for_each] // Switch the tab to switch the banner display effect. diff --git a/features/home/src/main/ets/view/RecommendedVideo.ets b/features/home/src/main/ets/view/RecommendedVideo.ets index 9a7956b..a0bfa1c 100644 --- a/features/home/src/main/ets/view/RecommendedVideo.ets +++ b/features/home/src/main/ets/view/RecommendedVideo.ets @@ -152,6 +152,7 @@ export struct RecommendedVideo { } // [StartExclude build_grid] // [StartExclude grid_foreach] + // [StartExclude jh_tabindex_gettabindex] .tabIndex(getTabIndex(HomeConstants.DIRECTION_LIST[4])) .editMode(false) // Sets the number of grid layout columns and evenly divides the width. @@ -177,33 +178,34 @@ export struct RecommendedVideo { ) // [EndExclude build_grid] // Zooming and pinching functions of the grid. + // [EndExclude jh_tabindex_gettabindex] .gesture(PinchGesture({ fingers: 2 }).onActionUpdate((event: GestureEvent) => { - if (event.scale > 1 && this.currentWidthBreakpoint !== BreakpointConstants.BREAKPOINT_SM) { - if (this.currentWidthBreakpoint === BreakpointConstants.BREAKPOINT_MD) { + if (event.scale > 1 && this.currentWidthBreakpoint !== 'sm') { + if (this.currentWidthBreakpoint === 'md') { this.getUIContext().animateTo({ - duration: HomeConstants.ANIMATION_DURATION + duration: 500 }, () => { - this.videoGridColumn = CommonConstants.VIDEO_GRID_COLUMNS[1]; + this.videoGridColumn = '1fr 1fr 1fr'; }) } else { this.getUIContext().animateTo({ - duration: HomeConstants.ANIMATION_DURATION + duration: 500 }, () => { - this.videoGridColumn = CommonConstants.VIDEO_GRID_COLUMNS[2]; + this.videoGridColumn = '1fr 1fr 1fr 1fr'; }) } - } else if (event.scale < 1 && this.currentWidthBreakpoint !== BreakpointConstants.BREAKPOINT_SM) { - if (this.currentWidthBreakpoint === BreakpointConstants.BREAKPOINT_MD) { + } else if (event.scale < 1 && this.currentWidthBreakpoint !== 'sm') { + if (this.currentWidthBreakpoint === 'md') { this.getUIContext().animateTo({ - duration: HomeConstants.ANIMATION_DURATION + duration: 500 }, () => { - this.videoGridColumn = CommonConstants.VIDEO_GRID_COLUMNS[2]; + this.videoGridColumn = '1fr 1fr 1fr 1fr'; }) } else { this.getUIContext().animateTo({ - duration: HomeConstants.ANIMATION_DURATION + duration: 500 }, () => { - this.videoGridColumn = CommonConstants.VIDEO_GRID_COLUMNS[3]; + this.videoGridColumn = '1fr 1fr 1fr 1fr 1fr'; }) } } else { diff --git a/features/home/src/main/ets/view/exampleTest.ets b/features/home/src/main/ets/view/exampleTest.ets new file mode 100644 index 0000000..644bc58 --- /dev/null +++ b/features/home/src/main/ets/view/exampleTest.ets @@ -0,0 +1,52 @@ +/* + * 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 { window } from '@kit.ArkUI'; + +@Component +export struct ExampleTest { + private mainWindowClass?: window.Window; + @StorageLink('currentWidthBreakpoint') currentWidthBreakpoint: string = 'lg'; + + // [Start example_updateWidthBp] + updateWidthBp(): void { + let mainWindow: window.WindowProperties = this.mainWindowClass!.getWindowProperties(); + let windowWidth: number = mainWindow.windowRect.width; + let windowWidthVp = this.getUIContext().px2vp(windowWidth); + let widthBp: string = ''; + if (windowWidthVp < 320) { + widthBp = 'xs'; + } else if (windowWidthVp >= 320 && windowWidthVp < 600) { + widthBp = 'sm'; + } else if (windowWidthVp >= 600 && windowWidthVp < 840) { + widthBp = 'md'; + } else if (windowWidthVp >= 840 && windowWidthVp < 1440) { + widthBp = 'lg'; + } else { + widthBp = 'xl'; + } + AppStorage.setOrCreate('currentWidthBreakpoint', widthBp); + } + // [End example_updateWidthBp] + + build() { + Column() { + // [Start example_text_test] + Text('Test') + .fontSize(this.currentWidthBreakpoint === 'lg' ? '16fp' : '14fp') + // [End example_text_test] + } + } +} \ No newline at end of file diff --git a/features/videoDetail/src/main/ets/view/VideoPlayer.ets b/features/videoDetail/src/main/ets/view/VideoPlayer.ets index 53c6890..316a848 100644 --- a/features/videoDetail/src/main/ets/view/VideoPlayer.ets +++ b/features/videoDetail/src/main/ets/view/VideoPlayer.ets @@ -100,7 +100,6 @@ export struct VideoPlayer { .justifyContent(FlexAlign.Center) .height(this.isHalfFolded ? this.creaseRegion[0] : (this.isFullScreen ? CommonConstants.FULL_PERCENT : 'auto')) .width(CommonConstants.FULL_PERCENT) - // [StartExclude stack_aligncontent] // [StartExclude stack_isfullscreen] } .width(CommonConstants.FULL_PERCENT) @@ -120,7 +119,6 @@ export struct VideoPlayer { } }) ) - // [EndExclude stack_aligncontent] // [EndExclude stack_isfullscreen] Column() { // [StartExclude stack_isfullscreen] diff --git a/products/phone/src/main/ets/entryability/EntryAbility.ets b/products/phone/src/main/ets/entryability/EntryAbility.ets index 6b48177..2953f6b 100644 --- a/products/phone/src/main/ets/entryability/EntryAbility.ets +++ b/products/phone/src/main/ets/entryability/EntryAbility.ets @@ -22,6 +22,7 @@ import { display, window } from '@kit.ArkUI'; import { hilog } from '@kit.PerformanceAnalysisKit'; import { CommonConstants, WindowUtil } from '@ohos/commons'; +// [Start multi_entryAbility] export default class EntryAbility extends UIAbility { // [Start EntryAbility] private windowObj?: window.Window; @@ -33,6 +34,7 @@ export default class EntryAbility extends UIAbility { AppStorage.setOrCreate('windowWidth', windowSize.width); // [EndExclude EntryAbility] }; + // [StartExclude multi_entryAbility] // [StartExclude EntryAbility] onCreate(want: Want, launchParam: AbilityConstant.LaunchParam) { hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate'); @@ -41,6 +43,7 @@ export default class EntryAbility extends UIAbility { onDestroy() { hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onDestroy'); } + // [EndExclude multi_entryAbility] // [EndExclude EntryAbility] onWindowStageCreate(windowStage: window.WindowStage) { // [StartExclude EntryAbility] @@ -62,7 +65,8 @@ export default class EntryAbility extends UIAbility { AppStorage.setOrCreate('windowWidth', data.getWindowProperties().windowRect.width); this.windowObj.on('windowSizeChange', this.onWindowSizeChange); }); - // [c EntryAbility] + // [StartExclude EntryAbility] + // [StartExclude multi_entryAbility] windowStage.loadContent('pages/Index', (err, data) => { AppStorage.setOrCreate('uiContext', windowStage.getMainWindowSync().getUIContext()); if (err.code) { @@ -72,9 +76,11 @@ export default class EntryAbility extends UIAbility { hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? ''); }); // [EndExclude EntryAbility] + // [EndExclude multi_entryAbility] } // [End EntryAbility] + // [StartExclude EntryAbility] onWindowStageDestroy() { // Main window is destroyed, release UI related resources hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageDestroy'); @@ -121,4 +127,6 @@ export default class EntryAbility extends UIAbility { AppStorage.setOrCreate('videoGridColumn', videoGridColumn); } // [End update_width_bp] + // [EndExclude multi_entryAbility] } +// [End multi_entryAbility] -- Gitee