From 6029ebb938095ded0056313fa21a7b36bb6b0bf4 Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Fri, 4 Jul 2025 14:28:22 +0800 Subject: [PATCH 01/15] =?UTF-8?q?=E4=B8=80=E5=A4=9A=E5=88=86=E6=A0=8F?= =?UTF-8?q?=E6=8E=A7=E4=BB=B6har=E5=8C=85=E4=BB=A3=E7=A0=81=E5=9B=9E?= =?UTF-8?q?=E5=90=88=E5=8F=8A=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnslibrary/Index.ets | 5 +- .../src/main/ets/application/MailBox.ets | 109 ++++++++++++------ .../src/main/ets/application/PhotoAlbum.ets | 71 +++++++----- .../src/main/ets/application/Settings.ets | 17 +-- .../src/main/ets/common/CommonConstants.ets | 4 + .../src/main/ets/common/MailContent.ets | 16 ++- .../src/main/ets/common/MailNavigation.ets | 7 +- .../src/main/ets/common/MailSideBar.ets | 5 +- .../src/main/ets/common/PhotoContent.ets | 8 +- .../src/main/ets/common/PhotoSideBar.ets | 6 +- .../src/main/ets/common/WlanItem.ets | 11 +- .../src/main/ets/pages/MultiColumnsPage.ets | 14 +-- .../src/main/ets/utils/BreakpointSystem.ets | 3 +- .../src/main/ets/utils/WindowUtils.ets | 24 ++-- .../main/resources/base/element/color.json | 4 + .../main/resources/base/media/background.png | Bin 0 -> 57364 bytes .../main/resources/base/media/foreground.png | Bin 0 -> 12430 bytes .../resources/base/media/layered_image.json | 7 ++ .../main/ets/entryability/EntryAbility.ets | 8 +- .../src/main/ets/pages/Index.ets | 2 +- multicolumnssample/src/main/module.json5 | 4 +- 21 files changed, 201 insertions(+), 124 deletions(-) create mode 100644 multicolumnslibrary/src/main/resources/base/media/background.png create mode 100644 multicolumnslibrary/src/main/resources/base/media/foreground.png create mode 100644 multicolumnslibrary/src/main/resources/base/media/layered_image.json diff --git a/multicolumnslibrary/Index.ets b/multicolumnslibrary/Index.ets index 2fc7e9a..7b34d26 100644 --- a/multicolumnslibrary/Index.ets +++ b/multicolumnslibrary/Index.ets @@ -1,2 +1,3 @@ -export { MultiColumnsPage} from './src/main/ets/pages/MultiColumnsPage' -export { WindowUtil} from './src/main/ets/utils/WindowUtils' \ No newline at end of file +export { MultiColumnsPage } from './src/main/ets/pages/MultiColumnsPage'; + +export { WindowUtil } from './src/main/ets/utils/WindowUtils'; \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/application/MailBox.ets b/multicolumnslibrary/src/main/ets/application/MailBox.ets index 74e7e32..6dc691e 100644 --- a/multicolumnslibrary/src/main/ets/application/MailBox.ets +++ b/multicolumnslibrary/src/main/ets/application/MailBox.ets @@ -16,61 +16,92 @@ import { BreakpointType } from '../utils/BreakpointSystem'; import { MailNavigation } from '../common/MailNavigation'; import { MailSideBar } from '../common/MailSideBar'; - -let storage = LocalStorage.getShared(); +import { CommonConstants } from '../common/CommonConstants'; @Builder export function MailBoxBuilder() { MailBox(); } -@Entry(storage) +@Entry @Component struct MailBox { - @LocalStorageLink('currentBreakPoint') currentBreakPoint: string = 'md'; @State isFold: boolean = false; @State sideBarWidth: number = 304; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @StorageProp('isShowMailSideBar') isShowMailSideBar: boolean = this.currentBreakPoint === 'lg' ? true : false; + private pageStack: NavPathStack = new NavPathStack(); + + aboutToAppear(): void { + this.isShowMailSideBar = this.currentBreakPoint === 'lg' ? true : false; + } build() { NavDestination() { GridRow() { GridCol({ span: { sm: 12, md: 12, lg: 12 } }) { - SideBarContainer(SideBarContainerType.AUTO) { - // Area A - Column() { - MailSideBar() - } - .borderWidth({ right: 0.5 }) - .borderColor({ right: $r('sys.color.comp_divider') }) - .width('100%') - .height('100%') - .backgroundColor($r('sys.color.background_primary')) + Stack({ alignContent: Alignment.TopStart }) { + SideBarContainer(SideBarContainerType.AUTO) { + // Area A + Column() { + MailSideBar() + } + .borderWidth({ right: 0.5 }) + .borderColor({ right: $r('sys.color.comp_divider') }) + .width('100%') + .height('100%') + .backgroundColor($r('sys.color.background_primary')) - // Area B+C - Column() { - Stack() { - MailNavigation() - if (this.isFold && this.currentBreakPoint !== 'lg') { - Column().width('100%').height('100%').backgroundColor('#33000000') + // Area B+C + Column() { + Stack() { + MailNavigation() + if (this.isFold && this.currentBreakPoint !== 'lg') { + Column() + .width('100%') + .height('100%') + .backgroundColor($r('app.color.detail_background')) + } } - } - }.height('100%').width('100%') + }.height('100%').width('100%') + } + .divider({ color: $r('sys.color.comp_divider'), strokeWidth: 0 }) + .sideBarWidth(this.sideBarWidth) + .minSideBarWidth(240) + .minContentWidth(this.currentBreakPoint === 'sm' ? '100%' : 600) + .controlButton({ + left: new BreakpointType({ + sm: 16 + CommonConstants.BACK_SIZE, + md: 24 + CommonConstants.BACK_SIZE, + lg: 32 + CommonConstants.BACK_SIZE, + }).getValue(this.currentBreakPoint), + top: this.currentBreakPoint === 'lg' ? 16 : this.topRectHeight, + width: 24, + height: 24 + }) + .showSideBar(this.isShowMailSideBar) + .onChange((value: boolean) => { + this.isShowMailSideBar = value; + this.isFold = value; + }) + + Button({ type: ButtonType.Circle }) { + SymbolGlyph($r('sys.symbol.chevron_backward')) + .fontColor([$r('sys.color.icon_primary')]) + .fontSize($r('sys.float.Title_M')) + } + .margin({ + left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint), + top: this.currentBreakPoint === 'lg' ? 16 : this.topRectHeight + }) + .backgroundColor(Color.Transparent) + .height(24) + .aspectRatio(1) + .onClick(() => { + this.pageStack.pop(); + }) } - .divider({ color: $r('sys.color.comp_divider'), strokeWidth: 0 }) - .sideBarWidth(this.sideBarWidth) - .minSideBarWidth(240) - .minContentWidth(this.currentBreakPoint === 'sm' ? '100%' : 600) - .controlButton({ - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint), - top: px2vp(this.topRectHeight), - width: 24, - height: 24 - }) - .showSideBar(this.currentBreakPoint === 'lg') - .onChange((value: boolean) => { - this.isFold = value; - }) } } .onBreakpointChange((breakpoint: string) => { @@ -78,7 +109,9 @@ struct MailBox { }) } .hideTitleBar(true) - .padding({ top: px2vp(this.topRectHeight) }) + .onReady((context: NavDestinationContext) => { + this.pageStack = context.pathStack; + }) } } diff --git a/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets b/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets index b77623d..d6640ff 100644 --- a/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets +++ b/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets @@ -18,53 +18,72 @@ import { CommonConstants } from '../common/CommonConstants'; import { PhotoContent } from '../common/PhotoContent'; import { PhotoSideBar } from '../common/PhotoSideBar'; -let storage = LocalStorage.getShared(); - @Builder export function PhotoAlbumBuilder() { PhotoAlbum(); } -@Entry(storage) +@Entry @Component struct PhotoAlbum { - @State sideBarStatus: boolean = true; - @LocalStorageLink('currentBreakPoint') currentBreakPoint: string = 'sm'; - @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @State sideBarStatus: boolean = this.curBp !== CommonConstants.BREAK_POINT_SM; + private pageStack: NavPathStack = new NavPathStack(); build() { NavDestination() { GridRow() { GridCol({ span: { sm: 12, md: 12, lg: 12 } }) { - SideBarContainer(SideBarContainerType.AUTO) { - Column() { - PhotoSideBar() + Stack({ alignContent: Alignment.TopStart }) { + SideBarContainer(SideBarContainerType.AUTO) { + Column() { + PhotoSideBar() + } + .backgroundColor($r('sys.color.comp_background_primary')) + + Column() { + PhotoContent({ sideBarStatus: $sideBarStatus }) + } + .backgroundColor($r('sys.color.background_secondary')) } - .backgroundColor($r('sys.color.comp_background_primary')) + .divider({ strokeWidth: 0.5, color: $r('sys.color.comp_divider') }) + .controlButton({ + left: 16 + CommonConstants.BACK_SIZE, + top: this.curBp === 'lg' ? 16 : this.topRectHeight, + width: 24, + height: 24 + }) + .showSideBar(this.curBp !== CommonConstants.BREAK_POINT_SM) + .onChange((value: boolean) => { + this.sideBarStatus = value; + }) - Column() { - PhotoContent({ sideBarStatus: $sideBarStatus }) + Button({ type: ButtonType.Circle }) { + SymbolGlyph($r('sys.symbol.chevron_backward')) + .fontColor([$r('sys.color.icon_primary')]) + .fontSize($r('sys.float.Title_M')) } - .backgroundColor($r('sys.color.background_secondary')) + .margin({ + left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), + top: this.curBp === 'lg' ? 16 : this.topRectHeight, + }) + .backgroundColor(Color.Transparent) + .height(24) + .aspectRatio(1) + .onClick(() => { + this.pageStack.pop(); + }) } - .divider({ strokeWidth: 0.5, color: $r('sys.color.comp_divider') }) - .controlButton({ - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), - top: px2vp(this.topRectHeight), - width: 24, - height: 24 - }) - .onChange((value: boolean) => { - this.sideBarStatus = value; - }) } } .onBreakpointChange((breakpoint: string) => { - this.currentBreakPoint = breakpoint; + this.curBp = breakpoint; }) } .hideTitleBar(true) - .padding({ top: px2vp(this.topRectHeight), }) + .onReady((context: NavDestinationContext) => { + this.pageStack = context.pathStack; + }) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/application/Settings.ets b/multicolumnslibrary/src/main/ets/application/Settings.ets index d605785..612fa4a 100644 --- a/multicolumnslibrary/src/main/ets/application/Settings.ets +++ b/multicolumnslibrary/src/main/ets/application/Settings.ets @@ -17,19 +17,18 @@ import { BreakpointType } from '../utils/BreakpointSystem'; import { MainItem } from '../common/SettingItem'; import { WlanItem } from '../common/WlanItem'; -let storage = LocalStorage.getShared(); - @Builder export function SettingsBuilder() { Settings(); } -@Entry(storage) +@Entry @Component struct Settings { @State pathInfo: NavPathStack = new NavPathStack(); - @LocalStorageLink('currentBreakPoint') currentBreakPoint: string = 'md'; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; @Builder myRouter(name: string, param?: number | undefined) { @@ -137,6 +136,7 @@ struct Settings { .backgroundColor($r('sys.color.comp_background_primary')) .padding(4) } + .margin({ bottom: this.bottomRectHeight }) } .scrollBar(BarState.Off) .width('100%') @@ -148,6 +148,7 @@ struct Settings { } .navBarWidth(293) .title($r('app.string.settings')) + .titleMode(NavigationTitleMode.Mini) .backgroundColor($r('sys.color.background_secondary')) .width('100%') .height('100%') @@ -156,12 +157,14 @@ struct Settings { } .borderWidth({ right: 0.5 }) .borderColor({ right: $r('sys.color.comp_divider') }) - .backgroundColor($r('sys.color.background_secondary')) .onBreakpointChange((breakpoint: string) => { this.currentBreakPoint = breakpoint; }) } .hideTitleBar(true) - .padding({ top: px2vp(this.topRectHeight) }) + .padding({ + top: this.topRectHeight + }) + .backgroundColor($r('sys.color.background_secondary')) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets b/multicolumnslibrary/src/main/ets/common/CommonConstants.ets index 5b3ebea..9f358fd 100644 --- a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets +++ b/multicolumnslibrary/src/main/ets/common/CommonConstants.ets @@ -17,6 +17,10 @@ * Common constants for all features. */ export class CommonConstants { + /** + * BACK Button size. + */ + public static readonly BACK_SIZE: number = 48; /** * Index page padding top size. */ diff --git a/multicolumnslibrary/src/main/ets/common/MailContent.ets b/multicolumnslibrary/src/main/ets/common/MailContent.ets index aa560d5..eca6205 100644 --- a/multicolumnslibrary/src/main/ets/common/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/common/MailContent.ets @@ -26,9 +26,9 @@ export struct MailContent { new OperateTabs($r('sys.symbol.trash'), $r('app.string.delete')), new OperateTabs($r('sys.symbol.dot_grid_2x2'), $r('app.string.more')), ] - @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('bottomRectHeight') bottomRectHeight: number = 0; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; build() { NavDestination() { @@ -36,7 +36,7 @@ export struct MailContent { Column() { Text('HHHxx UXD') .fontSize(22) - .margin({ left: this.curBp === 'sm' ? 32 : 0 }) + .margin({ left: this.curBp === 'sm' ? 32 + CommonConstants.BACK_SIZE : 0 }) .fontWeight(FontWeight.Medium) .fontColor($r('sys.color.font_primary')) @@ -103,15 +103,13 @@ export struct MailContent { .justifyContent(FlexAlign.SpaceAround) .width('100%') .height(56) - .backgroundColor($r('sys.color.background_secondary')) } - .padding({ - bottom: px2vp(this.bottomRectHeight), top: px2vp(this.topRectHeight) - }) - .backgroundColor($r('sys.color.background_secondary')) .width('100%') .height('100%') } + .padding({ + bottom: this.bottomRectHeight, top: this.curBp === 'lg' ? 16 : this.topRectHeight + }) .backgroundColor($r('sys.color.background_secondary')) .width('100%') .height('100%') diff --git a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets index a7576f7..5cd37da 100644 --- a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets @@ -20,8 +20,8 @@ import { MailContent } from './MailContent'; export struct MailNavigation { @State pathInfo: NavPathStack = new NavPathStack(); @State mailList: string[] = ['1', '1', '1', '1', '1', '1']; - @LocalStorageProp('currentBreakPoint') currentBreakPoint: string = 'md'; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; @Builder myRouter() { @@ -40,8 +40,9 @@ export struct MailNavigation { .fontSize(24) .margin({ left: 24 }) } + .alignItems(VerticalAlign.Center) .height(56) - .padding({ top: px2vp(this.topRectHeight), right: 16 }) + .padding({ top: this.topRectHeight, right: 16 }) } } diff --git a/multicolumnslibrary/src/main/ets/common/MailSideBar.ets b/multicolumnslibrary/src/main/ets/common/MailSideBar.ets index 5a81679..e0ffe32 100644 --- a/multicolumnslibrary/src/main/ets/common/MailSideBar.ets +++ b/multicolumnslibrary/src/main/ets/common/MailSideBar.ets @@ -30,7 +30,8 @@ export struct MailSideBar { Column() { AccountInfo() MailStatusList() - }.width('100%') + } + .width('100%') } } @@ -40,7 +41,7 @@ struct AccountInfo { 'xxxxxxxxxxxxx', 'xxxxxxxxxxxxx', ] - @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; @Builder accountInfo() { diff --git a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets index 6c46b0e..1c4c174 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets @@ -31,8 +31,8 @@ export struct PhotoContent { ] @State columnsTemplate: string = '1fr 1fr 1fr'; @Link @Watch('onStateChange') sideBarStatus: boolean; - @StorageProp('currentBreakpoint') currentBreakPoint: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = CommonConstants.BREAK_POINT_SM; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; aboutToAppear() { if (this.sideBarStatus === true && this.currentBreakPoint === 'md') { @@ -72,7 +72,7 @@ export struct PhotoContent { Column() { Row() { Text($r('app.string.album')).fontSize(20).fontWeight(FontWeight.Medium) - .margin({ left: this.sideBarStatus ? 0 : 36 }) + .margin({ left: this.sideBarStatus ? 0 : 36 + CommonConstants.BACK_SIZE }) Row() { SymbolGlyph($r('sys.symbol.plus')) .fontSize(24) @@ -84,7 +84,7 @@ export struct PhotoContent { } } .justifyContent(FlexAlign.SpaceBetween) - .padding({ top: px2vp(this.topRectHeight) }) + .padding({ top: this.topRectHeight }) .height(56) .width('100%') diff --git a/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets b/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets index d787908..0d4be4f 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets +++ b/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets @@ -30,8 +30,8 @@ export struct PhotoSideBar { new PhotoType($r('app.string.pictureType'), 22), new PhotoType($r('app.string.hidden'), 1), ]; - @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; build() { Column() { @@ -112,7 +112,7 @@ export struct PhotoSideBar { } .width('100%').height('100%') .padding({ - top: px2vp(this.topRectHeight), + top: CommonConstants.BACK_SIZE, left: new BreakpointType({sm:16,md: 24,lg: 32}).getValue(this.curBp), right: new BreakpointType({sm:16,md: 24,lg: 32}).getValue(this.curBp) }) diff --git a/multicolumnslibrary/src/main/ets/common/WlanItem.ets b/multicolumnslibrary/src/main/ets/common/WlanItem.ets index 3c5db64..dd2bb6e 100644 --- a/multicolumnslibrary/src/main/ets/common/WlanItem.ets +++ b/multicolumnslibrary/src/main/ets/common/WlanItem.ets @@ -14,13 +14,15 @@ */ import { SubItem } from './SettingItem'; +import { router } from '@kit.ArkUI'; import { BreakpointType } from '../utils/BreakpointSystem'; @Component export struct WlanItem { @State netWorkStatus: Resource = $r('app.string.closed'); - @LocalStorageProp('currentBreakPoint') currentBreakPoint: string = 'md'; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; @Consume('pathStack') pageStack: NavPathStack; @Builder @@ -144,10 +146,12 @@ export struct WlanItem { ListItem() { SubItem({ itemDesc: $r('app.string.addNetWork'), isLinkAddress: true }) - }.width('100%') + } + .width('100%') .borderRadius(16) .backgroundColor($r('sys.color.comp_background_primary')) .padding({ top: 4, bottom: 4 }) + .margin({ bottom: this.bottomRectHeight }) } .scrollBar(BarState.Off) @@ -157,7 +161,6 @@ export struct WlanItem { .padding({ left: new BreakpointType({ sm: 16, md: 16, lg: 16 }).getValue(this.currentBreakPoint), right: new BreakpointType({ sm: 16, md: 16, lg: 16 }).getValue(this.currentBreakPoint), - top: px2vp(this.topRectHeight) }) .hideTitleBar(true) .title('WLAN') diff --git a/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets b/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets index 7aa4c73..85a74cd 100644 --- a/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets +++ b/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets @@ -19,9 +19,9 @@ import { CommonConstants, Route } from '../common/CommonConstants'; @Component export struct MultiColumnsPage { - @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('bottomRectHeight') bottomRectHeight: number = 0; - @StorageProp('topRectHeight') topRectHeight: number = 0; + @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; + @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; @Provide('pathStack') pathStack: NavPathStack = new NavPathStack(); private routes: Route[] = CommonConstants.ROUTES; @@ -48,8 +48,6 @@ export struct MultiColumnsPage { .backgroundColor($r('sys.color.comp_background_emphasize')) .onClick(() => { try { - hilog.info(0x0000, '1111111111', `Push url fail. Cause: ${item.to}`); - this.pathStack.pushPathByName(item.to, null) } catch (error) { hilog.error(0x0000, 'testTag', `Push url fail. Cause: ${(error as BusinessError).message}`); @@ -67,11 +65,11 @@ export struct MultiColumnsPage { .padding({ left: $r('sys.float.padding_level8'), right: $r('sys.float.padding_level8'), - top: CommonConstants.PADDING_TOP_INDEX + px2vp(this.topRectHeight), - bottom: CommonConstants.PADDING_BOTTOM_INDEX + px2vp(this.bottomRectHeight) + top: CommonConstants.PADDING_TOP_INDEX + this.topRectHeight, + bottom: CommonConstants.PADDING_BOTTOM_INDEX + this.bottomRectHeight }) } + .mode(NavigationMode.Stack) .hideTitleBar(true) - .padding({ top: this.topRectHeight }) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets b/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets index f1c8734..a74fea4 100644 --- a/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets +++ b/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets @@ -78,6 +78,7 @@ export class BreakpointSystem { public static getInstance(): BreakpointSystem { if (!BreakpointSystem.instance) { BreakpointSystem.instance = new BreakpointSystem(); + AppStorage.setOrCreate('multiColumnsBreakPoint', BreakpointTypeEnum.MD); } return BreakpointSystem.instance; } @@ -85,7 +86,7 @@ export class BreakpointSystem { public updateCurrentBreakpoint(breakpoint: BreakpointTypeEnum): void { if (this.currentBreakpoint !== breakpoint) { this.currentBreakpoint = breakpoint; - AppStorage.setOrCreate('currentBreakpoint', this.currentBreakpoint); + AppStorage.setOrCreate('multiColumnsBreakPoint', this.currentBreakpoint); } } diff --git a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets index e059b5d..9420211 100644 --- a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets +++ b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets @@ -49,22 +49,28 @@ export class WindowUtil { return; } BreakpointSystem.getInstance().updateWidthBp(data); - data.on('windowSizeChange', () => BreakpointSystem.getInstance().onWindowSizeChange(data)); - data.on('avoidAreaChange', (avoidAreaOption) => { - if (avoidAreaOption.type === window.AvoidAreaType.TYPE_SYSTEM || - avoidAreaOption.type === window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR) { - WindowUtil.setAvoidArea(avoidAreaOption.type, avoidAreaOption.area); - } - }); + try { + data.on('windowSizeChange', () => BreakpointSystem.getInstance().onWindowSizeChange(data)); + data.on('avoidAreaChange', (avoidAreaOption) => { + if (avoidAreaOption.type === window.AvoidAreaType.TYPE_SYSTEM || + avoidAreaOption.type === window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR) { + WindowUtil.setAvoidArea(avoidAreaOption.type, avoidAreaOption.area); + } + }); + } catch (e) { + const error = e as BusinessError; + hilog.error(0x0000, TAG, + `Register avoidAreaChange or windowSizeChange failed. code: ${error.code}, message: ${error.message}`); + } }) } // Get status bar height and indicator height. public static setAvoidArea(type: window.AvoidAreaType, area: window.AvoidArea) { if (type === window.AvoidAreaType.TYPE_SYSTEM) { - AppStorage.setOrCreate('topRectHeight', px2vp(area.topRect.height)); + AppStorage.setOrCreate('multiColumnsTopRectHeight', px2vp(area.topRect.height)); } else { - AppStorage.setOrCreate('bottomRectHeight', px2vp(area.bottomRect.height)); + AppStorage.setOrCreate('multiColumnsBottomRectHeight', px2vp(area.bottomRect.height)); } } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/resources/base/element/color.json b/multicolumnslibrary/src/main/resources/base/element/color.json index 3c71296..a8b9ce6 100644 --- a/multicolumnslibrary/src/main/resources/base/element/color.json +++ b/multicolumnslibrary/src/main/resources/base/element/color.json @@ -3,6 +3,10 @@ { "name": "start_window_background", "value": "#FFFFFF" + }, + { + "name": "detail_background", + "value": "#33000000" } ] } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/resources/base/media/background.png b/multicolumnslibrary/src/main/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..f939c9fa8cc8914832e602198745f592a0dfa34d GIT binary patch literal 57364 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 A4*&oF literal 0 HcmV?d00001 diff --git a/multicolumnslibrary/src/main/resources/base/media/foreground.png b/multicolumnslibrary/src/main/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..4483ddad1f079e1089d685bd204ee1cfe1d01902 GIT binary patch literal 12430 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 cSLciz6 { if (err.code) { hilog.error(0x0000, 'testTag', `Failed to load the content. Cause: ${err.message}`); return; } - WindowUtil.registerBreakPoint(windowStage) }); } diff --git a/multicolumnssample/src/main/ets/pages/Index.ets b/multicolumnssample/src/main/ets/pages/Index.ets index 07aa7f7..b668699 100644 --- a/multicolumnssample/src/main/ets/pages/Index.ets +++ b/multicolumnssample/src/main/ets/pages/Index.ets @@ -13,7 +13,7 @@ * limitations under the License. */ -import { MultiColumnsPage } from 'multicolumnslibrary' +import { MultiColumnsPage } from 'multicolumnslibrary'; @Entry @Component diff --git a/multicolumnssample/src/main/module.json5 b/multicolumnssample/src/main/module.json5 index 816e321..06dcdd5 100644 --- a/multicolumnssample/src/main/module.json5 +++ b/multicolumnssample/src/main/module.json5 @@ -17,11 +17,11 @@ "name": "MulticolumnssampleAbility", "srcEntry": "./ets/entryability/EntryAbility.ets", "description": "$string:EntryAbility_desc", - "icon": "$media:icon", + "icon": "$media:layered_image", "label": "$string:EntryAbility_label", "startWindowIcon": "$media:icon", "startWindowBackground": "$color:start_window_background", - "exported": true, + "exported": false, "skills": [ { "entities": [ -- Gitee From 2aab6ce00ece39d48365fd14b5152f552e1f79c2 Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Fri, 4 Jul 2025 17:36:52 +0800 Subject: [PATCH 02/15] =?UTF-8?q?=E9=81=BF=E8=AE=A9=E5=88=9D=E5=A7=8B?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnslibrary/src/main/ets/utils/WindowUtils.ets | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets index 9420211..6089262 100644 --- a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets +++ b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets @@ -48,8 +48,13 @@ export class WindowUtil { hilog.error(0x0000, TAG, `Failed to get main window: ${err.message}`); return; } - BreakpointSystem.getInstance().updateWidthBp(data); try { + BreakpointSystem.getInstance().updateWidthBp(data); + const systemAvoidArea: window.AvoidArea = data.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM); + const navIndicatorAvoidArea: window.AvoidArea = + data.getWindowAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR); + WindowUtil.setAvoidArea(window.AvoidAreaType.TYPE_SYSTEM, systemAvoidArea); + WindowUtil.setAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR, navIndicatorAvoidArea); data.on('windowSizeChange', () => BreakpointSystem.getInstance().onWindowSizeChange(data)); data.on('avoidAreaChange', (avoidAreaOption) => { if (avoidAreaOption.type === window.AvoidAreaType.TYPE_SYSTEM || -- Gitee From c044b11eba0c1ecca614022821ce6a069e2fa81c Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Mon, 7 Jul 2025 17:30:37 +0800 Subject: [PATCH 03/15] =?UTF-8?q?=E9=81=BF=E8=AE=A9=E5=92=8C=E6=96=AD?= =?UTF-8?q?=E7=82=B9=E9=80=82=E9=85=8D=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/main/ets/application/MailBox.ets | 11 ++++++----- .../src/main/ets/application/PhotoAlbum.ets | 4 ++-- .../src/main/ets/application/Settings.ets | 5 ++++- .../src/main/ets/common/MailContent.ets | 2 +- .../src/main/ets/common/MailNavigation.ets | 2 +- .../src/main/ets/common/PhotoContent.ets | 8 ++++---- 6 files changed, 18 insertions(+), 14 deletions(-) diff --git a/multicolumnslibrary/src/main/ets/application/MailBox.ets b/multicolumnslibrary/src/main/ets/application/MailBox.ets index 6dc691e..a5212f8 100644 --- a/multicolumnslibrary/src/main/ets/application/MailBox.ets +++ b/multicolumnslibrary/src/main/ets/application/MailBox.ets @@ -30,11 +30,12 @@ struct MailBox { @State sideBarWidth: number = 304; @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; - @StorageProp('isShowMailSideBar') isShowMailSideBar: boolean = this.currentBreakPoint === 'lg' ? true : false; + @StorageProp('isShowMailSideBar') isShowMailSideBar: boolean = + this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? true : false; private pageStack: NavPathStack = new NavPathStack(); aboutToAppear(): void { - this.isShowMailSideBar = this.currentBreakPoint === 'lg' ? true : false; + this.isShowMailSideBar = this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? true : false; } build() { @@ -57,7 +58,7 @@ struct MailBox { Column() { Stack() { MailNavigation() - if (this.isFold && this.currentBreakPoint !== 'lg') { + if (this.isFold && this.currentBreakPoint !== 'lg' && this.currentBreakPoint !== 'xl') { Column() .width('100%') .height('100%') @@ -76,7 +77,7 @@ struct MailBox { md: 24 + CommonConstants.BACK_SIZE, lg: 32 + CommonConstants.BACK_SIZE, }).getValue(this.currentBreakPoint), - top: this.currentBreakPoint === 'lg' ? 16 : this.topRectHeight, + top: this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? 16 : this.topRectHeight, width: 24, height: 24 }) @@ -93,7 +94,7 @@ struct MailBox { } .margin({ left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint), - top: this.currentBreakPoint === 'lg' ? 16 : this.topRectHeight + top: this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? 16 : this.topRectHeight }) .backgroundColor(Color.Transparent) .height(24) diff --git a/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets b/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets index d6640ff..34aba54 100644 --- a/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets +++ b/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets @@ -50,7 +50,7 @@ struct PhotoAlbum { .divider({ strokeWidth: 0.5, color: $r('sys.color.comp_divider') }) .controlButton({ left: 16 + CommonConstants.BACK_SIZE, - top: this.curBp === 'lg' ? 16 : this.topRectHeight, + top: this.curBp === 'lg' || this.curBp === 'xl' ? 16 : this.topRectHeight, width: 24, height: 24 }) @@ -66,7 +66,7 @@ struct PhotoAlbum { } .margin({ left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), - top: this.curBp === 'lg' ? 16 : this.topRectHeight, + top: this.curBp === 'lg' || this.curBp === 'xl' ? 16 : this.topRectHeight, }) .backgroundColor(Color.Transparent) .height(24) diff --git a/multicolumnslibrary/src/main/ets/application/Settings.ets b/multicolumnslibrary/src/main/ets/application/Settings.ets index 612fa4a..5430e4d 100644 --- a/multicolumnslibrary/src/main/ets/application/Settings.ets +++ b/multicolumnslibrary/src/main/ets/application/Settings.ets @@ -16,6 +16,7 @@ import { BreakpointType } from '../utils/BreakpointSystem'; import { MainItem } from '../common/SettingItem'; import { WlanItem } from '../common/WlanItem'; +import { CommonConstants } from '../common/CommonConstants'; @Builder export function SettingsBuilder() { @@ -136,7 +137,9 @@ struct Settings { .backgroundColor($r('sys.color.comp_background_primary')) .padding(4) } - .margin({ bottom: this.bottomRectHeight }) + .margin({ + bottom: this.bottomRectHeight === 0 ? CommonConstants.PADDING_BOTTOM_INDEX : this.bottomRectHeight + }) } .scrollBar(BarState.Off) .width('100%') diff --git a/multicolumnslibrary/src/main/ets/common/MailContent.ets b/multicolumnslibrary/src/main/ets/common/MailContent.ets index eca6205..60d73b7 100644 --- a/multicolumnslibrary/src/main/ets/common/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/common/MailContent.ets @@ -108,7 +108,7 @@ export struct MailContent { .height('100%') } .padding({ - bottom: this.bottomRectHeight, top: this.curBp === 'lg' ? 16 : this.topRectHeight + bottom: this.bottomRectHeight, top: this.curBp === 'lg' || this.curBp === 'xl' ? 16 : this.topRectHeight }) .backgroundColor($r('sys.color.background_secondary')) .width('100%') diff --git a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets index 5cd37da..9bfe661 100644 --- a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets @@ -121,7 +121,7 @@ export struct MailNavigation { right: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint) }) - if (this.currentBreakPoint !== 'lg') { + if (this.currentBreakPoint !== 'lg' && this.currentBreakPoint !== 'xl') { Image($r('app.media.ic_public_list_add_light')).width(48).height(48).position({ x: 240, y: 549 }) } } diff --git a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets index 1c4c174..4b8a554 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets @@ -37,9 +37,9 @@ export struct PhotoContent { aboutToAppear() { if (this.sideBarStatus === true && this.currentBreakPoint === 'md') { this.columnsTemplate = '1fr 1fr 1fr'; - } else if (this.sideBarStatus === true && this.currentBreakPoint === 'lg') { + } else if (this.sideBarStatus === true && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { this.columnsTemplate = '1fr 1fr 1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === false && this.currentBreakPoint === 'lg') { + } else if (this.sideBarStatus === false && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { this.columnsTemplate = '1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr'; } else if (this.sideBarStatus === false && this.currentBreakPoint === 'md') { this.columnsTemplate = '1fr 1fr 1fr 1fr'; @@ -54,9 +54,9 @@ export struct PhotoContent { animateTo({ duration: 300 }, () => { if (this.sideBarStatus === true && this.currentBreakPoint === 'md') { this.columnsTemplate = '1fr 1fr 1fr'; - } else if (this.sideBarStatus === true && this.currentBreakPoint === 'lg') { + } else if (this.sideBarStatus === true && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { this.columnsTemplate = '1fr 1fr 1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === false && this.currentBreakPoint === 'lg') { + } else if (this.sideBarStatus === false && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { this.columnsTemplate = '1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr'; } else if (this.sideBarStatus === false && this.currentBreakPoint === 'md') { this.columnsTemplate = '1fr 1fr 1fr 1fr'; -- Gitee From 56bd506193278680a9b86a4840dd35f9a0d969aa Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Mon, 7 Jul 2025 20:36:58 +0800 Subject: [PATCH 04/15] =?UTF-8?q?=E9=81=BF=E8=AE=A9=E5=92=8C=E6=96=AD?= =?UTF-8?q?=E7=82=B9=E9=80=82=E9=85=8D=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnslibrary/src/main/ets/application/MailBox.ets | 4 ++-- multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets | 4 ++-- multicolumnslibrary/src/main/ets/common/CommonConstants.ets | 4 ++++ multicolumnslibrary/src/main/ets/common/MailContent.ets | 3 ++- multicolumnslibrary/src/main/ets/common/MailNavigation.ets | 3 ++- multicolumnslibrary/src/main/ets/common/PhotoContent.ets | 2 +- 6 files changed, 13 insertions(+), 7 deletions(-) diff --git a/multicolumnslibrary/src/main/ets/application/MailBox.ets b/multicolumnslibrary/src/main/ets/application/MailBox.ets index a5212f8..54c504e 100644 --- a/multicolumnslibrary/src/main/ets/application/MailBox.ets +++ b/multicolumnslibrary/src/main/ets/application/MailBox.ets @@ -77,7 +77,7 @@ struct MailBox { md: 24 + CommonConstants.BACK_SIZE, lg: 32 + CommonConstants.BACK_SIZE, }).getValue(this.currentBreakPoint), - top: this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? 16 : this.topRectHeight, + top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, width: 24, height: 24 }) @@ -94,7 +94,7 @@ struct MailBox { } .margin({ left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint), - top: this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? 16 : this.topRectHeight + top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM }) .backgroundColor(Color.Transparent) .height(24) diff --git a/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets b/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets index 34aba54..6b9a862 100644 --- a/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets +++ b/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets @@ -50,7 +50,7 @@ struct PhotoAlbum { .divider({ strokeWidth: 0.5, color: $r('sys.color.comp_divider') }) .controlButton({ left: 16 + CommonConstants.BACK_SIZE, - top: this.curBp === 'lg' || this.curBp === 'xl' ? 16 : this.topRectHeight, + top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, width: 24, height: 24 }) @@ -66,7 +66,7 @@ struct PhotoAlbum { } .margin({ left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), - top: this.curBp === 'lg' || this.curBp === 'xl' ? 16 : this.topRectHeight, + top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, }) .backgroundColor(Color.Transparent) .height(24) diff --git a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets b/multicolumnslibrary/src/main/ets/common/CommonConstants.ets index 9f358fd..1a9fda3 100644 --- a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets +++ b/multicolumnslibrary/src/main/ets/common/CommonConstants.ets @@ -29,6 +29,10 @@ export class CommonConstants { * Index page padding bottom size. */ public static readonly PADDING_BOTTOM_INDEX: number = 16; + /** + * Custom padding top size. + */ + public static readonly PADDING_CUSTOM: number = 8; /** * Width the percentage of the 100. */ diff --git a/multicolumnslibrary/src/main/ets/common/MailContent.ets b/multicolumnslibrary/src/main/ets/common/MailContent.ets index 60d73b7..b36262d 100644 --- a/multicolumnslibrary/src/main/ets/common/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/common/MailContent.ets @@ -108,7 +108,8 @@ export struct MailContent { .height('100%') } .padding({ - bottom: this.bottomRectHeight, top: this.curBp === 'lg' || this.curBp === 'xl' ? 16 : this.topRectHeight + top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, + bottom: this.bottomRectHeight }) .backgroundColor($r('sys.color.background_secondary')) .width('100%') diff --git a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets index 9bfe661..6292a3f 100644 --- a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets @@ -14,6 +14,7 @@ */ import { BreakpointType } from '../utils/BreakpointSystem'; +import { CommonConstants } from './CommonConstants'; import { MailContent } from './MailContent'; @Component @@ -42,7 +43,7 @@ export struct MailNavigation { } .alignItems(VerticalAlign.Center) .height(56) - .padding({ top: this.topRectHeight, right: 16 }) + .padding({ top: this.topRectHeight + CommonConstants.PADDING_CUSTOM, right: 16 }) } } diff --git a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets index 4b8a554..5de681f 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets @@ -84,7 +84,7 @@ export struct PhotoContent { } } .justifyContent(FlexAlign.SpaceBetween) - .padding({ top: this.topRectHeight }) + .padding({ top: this.topRectHeight + CommonConstants.PADDING_CUSTOM }) .height(56) .width('100%') -- Gitee From a2f330d657ea5f86a2ecd68667174c88b3ee0a25 Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Tue, 8 Jul 2025 16:02:17 +0800 Subject: [PATCH 05/15] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=BC=80=E6=BA=90?= =?UTF-8?q?=E6=A8=A1=E6=9D=BF=E6=96=87=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnslibrary/CHANGELOG.md | 6 +++ multicolumnslibrary/LICENSE | 78 ++++++++++++++++++++++++++++ multicolumnslibrary/README.md | 48 +++++++++++++++++ multicolumnslibrary/oh-package.json5 | 7 +-- 4 files changed, 136 insertions(+), 3 deletions(-) create mode 100644 multicolumnslibrary/CHANGELOG.md create mode 100644 multicolumnslibrary/LICENSE create mode 100644 multicolumnslibrary/README.md diff --git a/multicolumnslibrary/CHANGELOG.md b/multicolumnslibrary/CHANGELOG.md new file mode 100644 index 0000000..b525b8c --- /dev/null +++ b/multicolumnslibrary/CHANGELOG.md @@ -0,0 +1,6 @@ +# 版本记录 +## 1.0.0（2025.07.08） + +--- +### Initial +- 初始版本 diff --git a/multicolumnslibrary/LICENSE b/multicolumnslibrary/LICENSE new file mode 100644 index 0000000..338e5b0 --- /dev/null +++ b/multicolumnslibrary/LICENSE @@ -0,0 +1,78 @@ + Copyright (c) 2024 Huawei Device Co., Ltd. All rights reserved. + + 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. + +Apache License, Version 2.0 +TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION + +1. Definitions. + +"License" shall mean the terms and conditions for use, reproduction, and distribution as defined by Sections 1 through 9 of this document. + +"Licensor" shall mean the copyright owner or entity authorized by the copyright owner that is granting the License. + +"Legal Entity" shall mean the union of the acting entity and all other entities that control, are controlled by, or are under common control with that entity. For the purposes of this definition, "control" means (i) the power, direct or indirect, to cause the direction or management of such entity, whether by contract or otherwise, or (ii) ownership of fifty percent (50%) or more of the outstanding shares, or (iii) beneficial ownership of such entity. + +"You" (or "Your") shall mean an individual or Legal Entity exercising permissions granted by this License. + +"Source" form shall mean the preferred form for making modifications, including but not limited to software source code, documentation source, and configuration files. + +"Object" form shall mean any form resulting from mechanical transformation or translation of a Source form, including but not limited to compiled object code, generated documentation, and conversions to other media types. + +"Work" shall mean the work of authorship, whether in Source or Object form, made available under the License, as indicated by a copyright notice that is included in or attached to the work (an example is provided in the Appendix below). + +"Derivative Works" shall mean any work, whether in Source or Object form, that is based on (or derived from) the Work and for which the editorial revisions, annotations, elaborations, or other modifications represent, as a whole, an original work of authorship. For the purposes of this License, Derivative Works shall not include works that remain separable from, or merely link (or bind by name) to the interfaces of, the Work and Derivative Works thereof. + +"Contribution" shall mean any work of authorship, including the original version of the Work and any modifications or additions to that Work or Derivative Works thereof, that is intentionally submitted to Licensor for inclusion in the Work by the copyright owner or by an individual or Legal Entity authorized to submit on behalf of the copyright owner. For the purposes of this definition, "submitted" means any form of electronic, verbal, or written communication sent to the Licensor or its representatives, including but not limited to communication on electronic mailing lists, source code control systems, and issue tracking systems that are managed by, or on behalf of, the Licensor for the purpose of discussing and improving the Work, but excluding communication that is conspicuously marked or otherwise designated in writing by the copyright owner as "Not a Contribution." + +"Contributor" shall mean Licensor and any individual or Legal Entity on behalf of whom a Contribution has been received by Licensor and subsequently incorporated within the Work. + +2. Grant of Copyright License. + +Subject to the terms and conditions of this License, each Contributor hereby grants to You a perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable copyright license to reproduce, prepare Derivative Works of, publicly display, publicly perform, sublicense, and distribute the Work and such Derivative Works in Source or Object form. + +3. Grant of Patent License. + +Subject to the terms and conditions of this License, each Contributor hereby grants to You a perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable (except as stated in this section) patent license to make, have made, use, offer to sell, sell, import, and otherwise transfer the Work, where such license applies only to those patent claims licensable by such Contributor that are necessarily infringed by their Contribution(s) alone or by combination of their Contribution(s) with the Work to which such Contribution(s) was submitted. If You institute patent litigation against any entity (including a cross-claim or counterclaim in a lawsuit) alleging that the Work or a Contribution incorporated within the Work constitutes direct or contributory patent infringement, then any patent licenses granted to You under this License for that Work shall terminate as of the date such litigation is filed. + +4. Redistribution. + +You may reproduce and distribute copies of the Work or Derivative Works thereof in any medium, with or without modifications, and in Source or Object form, provided that You meet the following conditions: +1.You must give any other recipients of the Work or Derivative Works a copy of this License; and +2.You must cause any modified files to carry prominent notices stating that You changed the files; and +3.You must retain, in the Source form of any Derivative Works that You distribute, all copyright, patent, trademark, and attribution notices from the Source form of the Work, excluding those notices that do not pertain to any part of the Derivative Works; and +4.If the Work includes a "NOTICE" text file as part of its distribution, then any Derivative Works that You distribute must include a readable copy of the attribution notices contained within such NOTICE file, excluding those notices that do not pertain to any part of the Derivative Works, in at least one of the following places: within a NOTICE text file distributed as part of the Derivative Works; within the Source form or documentation, if provided along with the Derivative Works; or, within a display generated by the Derivative Works, if and wherever such third-party notices normally appear. The contents of the NOTICE file are for informational purposes only and do not modify the License. You may add Your own attribution notices within Derivative Works that You distribute, alongside or as an addendum to the NOTICE text from the Work, provided that such additional attribution notices cannot be construed as modifying the License. + +You may add Your own copyright statement to Your modifications and may provide additional or different license terms and conditions for use, reproduction, or distribution of Your modifications, or for any such Derivative Works as a whole, provided Your use, reproduction, and distribution of the Work otherwise complies with the conditions stated in this License. + +5. Submission of Contributions. + +Unless You explicitly state otherwise, any Contribution intentionally submitted for inclusion in the Work by You to the Licensor shall be under the terms and conditions of this License, without any additional terms or conditions. Notwithstanding the above, nothing herein shall supersede or modify the terms of any separate license agreement you may have executed with Licensor regarding such Contributions. + +6. Trademarks. + +This License does not grant permission to use the trade names, trademarks, service marks, or product names of the Licensor, except as required for reasonable and customary use in describing the origin of the Work and reproducing the content of the NOTICE file. + +7. Disclaimer of Warranty. + +Unless required by applicable law or agreed to in writing, Licensor provides the Work (and each Contributor provides its Contributions) on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied, including, without limitation, any warranties or conditions of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A PARTICULAR PURPOSE. You are solely responsible for determining the appropriateness of using or redistributing the Work and assume any risks associated with Your exercise of permissions under this License. + +8. Limitation of Liability. + +In no event and under no legal theory, whether in tort (including negligence), contract, or otherwise, unless required by applicable law (such as deliberate and grossly negligent acts) or agreed to in writing, shall any Contributor be liable to You for damages, including any direct, indirect, special, incidental, or consequential damages of any character arising as a result of this License or out of the use or inability to use the Work (including but not limited to damages for loss of goodwill, work stoppage, computer failure or malfunction, or any and all other commercial damages or losses), even if such Contributor has been advised of the possibility of such damages. + +9. Accepting Warranty or Additional Liability. + +While redistributing the Work or Derivative Works thereof, You may choose to offer, and charge a fee for, acceptance of support, warranty, indemnity, or other liability obligations and/or rights consistent with this License. However, in accepting such obligations, You may act only on Your own behalf and on Your sole responsibility, not on behalf of any other Contributor, and only if You agree to indemnify, defend, and hold each Contributor harmless for any liability incurred by, or claims asserted against, such Contributor by reason of your accepting any such warranty or additional liability. + +END OF TERMS AND CONDITIONS \ No newline at end of file diff --git a/multicolumnslibrary/README.md b/multicolumnslibrary/README.md new file mode 100644 index 0000000..1ddbdf7 --- /dev/null +++ b/multicolumnslibrary/README.md @@ -0,0 +1,48 @@ +## 多设备旅行订票界面 + +### 介绍 + +本示例分别展示了多场景下，一多分栏控件的响应式变化效果。 + +本示例分别用到了SideBarContainer组件与Navigation组件，对应使用场景如下： + +A+B+C：即SideBarContainer组件组合Navigation组件 +A+C：SideBarContainer组件 +B+C：Navigation组件 + +### 下载安装 + +使用ohpm安装依赖 + +``` +ohpm install @ohos_samples/multicolumnslibrary +``` + +或者按需在模块中修改oh-package.json5 + +``` +{ + "dependencies": { + "@ohos_samples/multicolumnslibrary": "^1.0.0" + } +} +``` + +### 使用说明 + +``` +import { MultiColumnsPage, WindowUtil } from '@ohos_samples/multicolumnslibrary'; +``` +按需在文件中使用导出模块即可，其中MultiColumnsPage是整个sample的入口页面。WindowUtil封装了沉浸式、设备断点判断、避让区域计算等窗口能力。示例如下： +``` +// Page.ets +import { MultiColumnsPage } from '@ohos_samples/multicolumnslibrary'; +Stack() { + MultiColumnsPage() +} + +// EntryAbility.ets +import { WindowUtil } from '@ohos_samples/multicolumnslibrary'; +WindowUtil.requestFullScreen(windowStage); +WindowUtil.registerBreakPoint(windowStage); +``` \ No newline at end of file diff --git a/multicolumnslibrary/oh-package.json5 b/multicolumnslibrary/oh-package.json5 index e7446f1..57b1a44 100644 --- a/multicolumnslibrary/oh-package.json5 +++ b/multicolumnslibrary/oh-package.json5 @@ -1,9 +1,10 @@ { - "name": "multicolumnslibrary", + "name": "@ohos_samples/multicolumnslibrary", "version": "1.0.0", - "description": "Please describe the basic information.", + "description": "This sample shows the responsive change effect of the multi-column control in various scenarios.", "main": "Index.ets", - "author": "", + "author": "@ohos_samples", "license": "Apache-2.0", + "repository": "https://gitee.com/harmonyos_samples/multi-columns/tree/br_release_hmos/", "dependencies": {} } -- Gitee From c56ae166304a474e7f8d5ae8f5dcf320ec39c92f Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Tue, 8 Jul 2025 16:17:07 +0800 Subject: [PATCH 06/15] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=BC=80=E6=BA=90?= =?UTF-8?q?=E6=A8=A1=E6=9D=BF=E6=96=87=E4=BB=B6=E5=8F=8Akey=E5=80=BC?= =?UTF-8?q?=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnslibrary/README.md | 2 +- multicolumnslibrary/src/main/ets/common/WlanItem.ets | 2 +- multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/multicolumnslibrary/README.md b/multicolumnslibrary/README.md index 1ddbdf7..cbe6d82 100644 --- a/multicolumnslibrary/README.md +++ b/multicolumnslibrary/README.md @@ -1,4 +1,4 @@ -## 多设备旅行订票界面 +## 多设备分栏控件 ### 介绍 diff --git a/multicolumnslibrary/src/main/ets/common/WlanItem.ets b/multicolumnslibrary/src/main/ets/common/WlanItem.ets index dd2bb6e..f49027b 100644 --- a/multicolumnslibrary/src/main/ets/common/WlanItem.ets +++ b/multicolumnslibrary/src/main/ets/common/WlanItem.ets @@ -23,7 +23,7 @@ export struct WlanItem { @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; - @Consume('pathStack') pageStack: NavPathStack; + @Consume('multiColumnsPathStack') pageStack: NavPathStack; @Builder CustomDivider() { diff --git a/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets b/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets index 85a74cd..f4303b7 100644 --- a/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets +++ b/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets @@ -22,7 +22,7 @@ export struct MultiColumnsPage { @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; - @Provide('pathStack') pathStack: NavPathStack = new NavPathStack(); + @Provide('multiColumnsPathStack') pathStack: NavPathStack = new NavPathStack(); private routes: Route[] = CommonConstants.ROUTES; build() { -- Gitee From 4d57ca08f378d0e1ec40fd9d7800edcfe24cbb17 Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Wed, 9 Jul 2025 16:47:11 +0800 Subject: [PATCH 07/15] =?UTF-8?q?=E5=88=86=E6=A0=8F=E6=8E=A7=E4=BB=B6har?= =?UTF-8?q?=E8=A7=84=E8=8C=83=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 23 ++++++++++----- README_EN.md | 29 ++++++++++++------- multicolumnslibrary/CHANGELOG.md | 2 +- multicolumnslibrary/Index.ets | 4 +-- multicolumnslibrary/README.md | 10 +++---- multicolumnslibrary/obfuscation-rules.txt | 4 +-- .../src/main/ets/MultiColumnController.ets | 22 ++++++++++++++ .../src/main/ets/common/CommonConstants.ets | 9 ++++++ .../src/main/ets/common/MailContent.ets | 6 ++-- .../src/main/ets/common/MailNavigation.ets | 4 +-- .../src/main/ets/common/MailSideBar.ets | 2 +- .../src/main/ets/common/PhotoContent.ets | 4 +-- .../src/main/ets/common/PhotoSideBar.ets | 8 ++--- .../src/main/ets/common/WlanItem.ets | 10 +++---- .../{application => component}/MailBox.ets | 7 ++--- .../{pages => component}/MultiColumnsPage.ets | 10 +++---- .../{application => component}/PhotoAlbum.ets | 7 ++--- .../{application => component}/Settings.ets | 9 +++--- .../src/main/ets/utils/BreakpointSystem.ets | 5 ++-- .../src/main/ets/utils/WindowUtils.ets | 28 ++++++++++++++---- .../resources/base/profile/route_map.json | 6 ++-- .../main/ets/entryability/EntryAbility.ets | 8 ++--- multicolumnssample/src/main/module.json5 | 2 +- 23 files changed, 138 insertions(+), 81 deletions(-) create mode 100644 multicolumnslibrary/src/main/ets/MultiColumnController.ets rename multicolumnslibrary/src/main/ets/{application => component}/MailBox.ets (95%) rename multicolumnslibrary/src/main/ets/{pages => component}/MultiColumnsPage.ets (87%) rename multicolumnslibrary/src/main/ets/{application => component}/PhotoAlbum.ets (93%) rename multicolumnslibrary/src/main/ets/{application => component}/Settings.ets (95%) diff --git a/README.md b/README.md index d94b08a..397c079 100644 --- a/README.md +++ b/README.md @@ -23,9 +23,11 @@ ### 工程目录 ``` -├──entry/src/main/ets // 代码区 -│ ├──application +multicolumnslibrary +├──src/main/ets // 代码区 +│ ├──component │ │ ├──MailBox.ets // 邮箱 +│ │ ├──MultiColumnsPage.ets // 首页 │ │ ├──PhotoAlbum.ets // 图库 │ │ └──Settings.ets // 设置 │ ├──common @@ -36,15 +38,20 @@ │ │ ├──PhotoContent.ets // 图库详情 │ │ ├──PhotoSideBar.ets // 图库侧边栏 │ │ ├──SettingItem.ets // setting设置项 -│ │ └──WlanItem.ets // Wlan详情页 -│ ├──entryability -│ │ └──EntryAbility.ets +│ │ └──WlanItem.ets // Wlan详情页 │ ├──model │ │ └──dataType.ets // 侧边栏菜单数据类型 +│ └──utils +│ ├──BreakpointSystem.ets // 断点 +│ └──WindowUtils.ets // 窗口工具 +└──src/main/resources // 应用资源目录 +multicolumnssample +├──src/main/ets // 代码区 +│ ├──entryability +│ │ └──EntryAbility.ets │ └──pages -│ └──Index.ets // 首页 -└──entry/src/main/resources // 应用资源目录 - +│ └──Index.ets // 入口页面 +└──src/main/resources // 应用资源目录 ``` ### 具体实现 diff --git a/README_EN.md b/README_EN.md index e812111..da747d5 100644 --- a/README_EN.md +++ b/README_EN.md @@ -24,11 +24,13 @@ Below are the preview effects. ## Project Directory ``` -├──entry/src/main/ets // Code area -│ ├──application -│ │ ├──MailBox.ets // Mailbox -│ │ ├──PhotoAlbum.ets // Photo album -│ │ └──Settings.ets // Settings +multicolumnslibrary +├──src/main/ets // Code area +│ ├──component +│ │ ├──MailBox.ets // Mailbox component +│ │ ├──MultiColumnsPage.ets // Home component +│ │ ├──PhotoAlbum.ets // Photo album component +│ │ └──Settings.ets // Settings component │ ├──common │ │ ├──BreakpointSystem.ets // Breakpoint system │ │ ├──MailContent.ets // Mail content @@ -37,15 +39,20 @@ Below are the preview effects. │ │ ├──PhotoContent.ets // Photo details │ │ ├──PhotoSideBar.ets // Photo sidebar │ │ ├──SettingItem.ets // Setting item -│ │ └──WlanItem.ets // WLAN details page -│ ├──entryability -│ │ └──EntryAbility.ets +│ │ └──WlanItem.ets // WLAN details page │ ├──model │ │ └──dataType.ets // Sidebar menu data type +│ └──utils +│ ├──BreakpointSystem.ets // BreakpointSystem util +│ └──WindowUtils.ets // Window util +└──src/main/resources // App resource directory +multicolumnssample +├──src/main/ets // Code area +│ ├──entryability +│ │ └──EntryAbility.ets │ └──pages -│ └──Index.ets // Home page -└──entry/src/main/resources // App resource directory - +│ └──Index.ets // Entry page +└──src/main/resources // App resource directory ``` ### How to Implement diff --git a/multicolumnslibrary/CHANGELOG.md b/multicolumnslibrary/CHANGELOG.md index b525b8c..10f7f3f 100644 --- a/multicolumnslibrary/CHANGELOG.md +++ b/multicolumnslibrary/CHANGELOG.md @@ -1,5 +1,5 @@ # 版本记录 -## 1.0.0（2025.07.08） +## 1.0.0（2025.07.10） --- ### Initial diff --git a/multicolumnslibrary/Index.ets b/multicolumnslibrary/Index.ets index 7b34d26..475396a 100644 --- a/multicolumnslibrary/Index.ets +++ b/multicolumnslibrary/Index.ets @@ -1,3 +1,3 @@ -export { MultiColumnsPage } from './src/main/ets/pages/MultiColumnsPage'; +export { MultiColumnsPage } from './src/main/ets/component/MultiColumnsPage'; -export { WindowUtil } from './src/main/ets/utils/WindowUtils'; \ No newline at end of file +export { MultiColumnController } from './src/main/ets/MultiColumnController'; \ No newline at end of file diff --git a/multicolumnslibrary/README.md b/multicolumnslibrary/README.md index cbe6d82..6433a08 100644 --- a/multicolumnslibrary/README.md +++ b/multicolumnslibrary/README.md @@ -31,9 +31,9 @@ ohpm install @ohos_samples/multicolumnslibrary ### 使用说明 ``` -import { MultiColumnsPage, WindowUtil } from '@ohos_samples/multicolumnslibrary'; +import { MultiColumnsPage, MultiColumnController } from '@ohos_samples/multicolumnslibrary'; ``` -按需在文件中使用导出模块即可，其中MultiColumnsPage是整个sample的入口页面。WindowUtil封装了沉浸式、设备断点判断、避让区域计算等窗口能力。示例如下： +按需在文件中使用导出模块即可，其中MultiColumnsPage是整个sample的入口页面。MultiColumnController初始化了沉浸式、设备断点判断、避让区域计算等窗口能力。示例如下： ``` // Page.ets import { MultiColumnsPage } from '@ohos_samples/multicolumnslibrary'; @@ -42,7 +42,7 @@ Stack() { } // EntryAbility.ets -import { WindowUtil } from '@ohos_samples/multicolumnslibrary'; -WindowUtil.requestFullScreen(windowStage); -WindowUtil.registerBreakPoint(windowStage); +import { MultiColumnController } from '@ohos_samples/multicolumnslibrary'; +// onWindowStageCreate回调里的loadContent方法里初始化 +MultiColumnController.initWindowConfig(windowStage); ``` \ No newline at end of file diff --git a/multicolumnslibrary/obfuscation-rules.txt b/multicolumnslibrary/obfuscation-rules.txt index 272efb6..d59018f 100644 --- a/multicolumnslibrary/obfuscation-rules.txt +++ b/multicolumnslibrary/obfuscation-rules.txt @@ -17,7 +17,7 @@ # -keep-property-name: specifies property names that you want to keep # -keep-global-name: specifies names that you want to keep in the global scope --enable-property-obfuscation +#-enable-property-obfuscation -enable-toplevel-obfuscation --enable-filename-obfuscation +#-enable-filename-obfuscation -enable-export-obfuscation \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/MultiColumnController.ets b/multicolumnslibrary/src/main/ets/MultiColumnController.ets new file mode 100644 index 0000000..328e810 --- /dev/null +++ b/multicolumnslibrary/src/main/ets/MultiColumnController.ets @@ -0,0 +1,22 @@ +/* + * Copyright (c) 2024 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'; +import { WindowUtil } from './utils/WindowUtils'; + +export class MultiColumnController { + public static initWindowConfig(windowStage: window.WindowStage): void { + WindowUtil.initialize(windowStage); + } +} \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets b/multicolumnslibrary/src/main/ets/common/CommonConstants.ets index 1a9fda3..4423e16 100644 --- a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets +++ b/multicolumnslibrary/src/main/ets/common/CommonConstants.ets @@ -45,6 +45,15 @@ export class CommonConstants { * Breakpoint sm. */ public static readonly BREAK_POINT_SM: string = 'sm'; + /** + * AppStorage key + */ + public static readonly KEY_PREFIX_COLUMNS: string = 'multiColumns'; + public static readonly KEY_BREAKPOINT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'BreakPoint'; + public static readonly KEY_TOP_RECT_HEIGHT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'TopRectHeight'; + public static readonly KEY_BOTTOM_RECT_HEIGHT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'BottomRectHeight'; + public static readonly KEY_PATH_STACK: string = CommonConstants.KEY_PREFIX_COLUMNS + 'PathStack'; + public static readonly KEY_UI_CONTEXT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'UIContext'; /** * Routes */ diff --git a/multicolumnslibrary/src/main/ets/common/MailContent.ets b/multicolumnslibrary/src/main/ets/common/MailContent.ets index b36262d..2f99953 100644 --- a/multicolumnslibrary/src/main/ets/common/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/common/MailContent.ets @@ -26,9 +26,9 @@ export struct MailContent { new OperateTabs($r('sys.symbol.trash'), $r('app.string.delete')), new OperateTabs($r('sys.symbol.dot_grid_2x2'), $r('app.string.more')), ] - @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; build() { NavDestination() { diff --git a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets index 6292a3f..a014c3f 100644 --- a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets @@ -21,8 +21,8 @@ import { MailContent } from './MailContent'; export struct MailNavigation { @State pathInfo: NavPathStack = new NavPathStack(); @State mailList: string[] = ['1', '1', '1', '1', '1', '1']; - @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; @Builder myRouter() { diff --git a/multicolumnslibrary/src/main/ets/common/MailSideBar.ets b/multicolumnslibrary/src/main/ets/common/MailSideBar.ets index e0ffe32..cb6175f 100644 --- a/multicolumnslibrary/src/main/ets/common/MailSideBar.ets +++ b/multicolumnslibrary/src/main/ets/common/MailSideBar.ets @@ -41,7 +41,7 @@ struct AccountInfo { 'xxxxxxxxxxxxx', 'xxxxxxxxxxxxx', ] - @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; @Builder accountInfo() { diff --git a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets index 5de681f..37a849c 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets @@ -31,8 +31,8 @@ export struct PhotoContent { ] @State columnsTemplate: string = '1fr 1fr 1fr'; @Link @Watch('onStateChange') sideBarStatus: boolean; - @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = CommonConstants.BREAK_POINT_SM; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; aboutToAppear() { if (this.sideBarStatus === true && this.currentBreakPoint === 'md') { diff --git a/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets b/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets index 0d4be4f..9d0518d 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets +++ b/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets @@ -30,8 +30,8 @@ export struct PhotoSideBar { new PhotoType($r('app.string.pictureType'), 22), new PhotoType($r('app.string.hidden'), 1), ]; - @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; build() { Column() { @@ -113,8 +113,8 @@ export struct PhotoSideBar { .width('100%').height('100%') .padding({ top: CommonConstants.BACK_SIZE, - left: new BreakpointType({sm:16,md: 24,lg: 32}).getValue(this.curBp), - right: new BreakpointType({sm:16,md: 24,lg: 32}).getValue(this.curBp) + left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), + right: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp) }) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/WlanItem.ets b/multicolumnslibrary/src/main/ets/common/WlanItem.ets index f49027b..d594eb5 100644 --- a/multicolumnslibrary/src/main/ets/common/WlanItem.ets +++ b/multicolumnslibrary/src/main/ets/common/WlanItem.ets @@ -14,16 +14,16 @@ */ import { SubItem } from './SettingItem'; -import { router } from '@kit.ArkUI'; import { BreakpointType } from '../utils/BreakpointSystem'; +import { CommonConstants } from './CommonConstants'; @Component export struct WlanItem { @State netWorkStatus: Resource = $r('app.string.closed'); - @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; - @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; - @Consume('multiColumnsPathStack') pageStack: NavPathStack; + @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; + @Consume(CommonConstants.KEY_PATH_STACK) pageStack: NavPathStack; @Builder CustomDivider() { diff --git a/multicolumnslibrary/src/main/ets/application/MailBox.ets b/multicolumnslibrary/src/main/ets/component/MailBox.ets similarity index 95% rename from multicolumnslibrary/src/main/ets/application/MailBox.ets rename to multicolumnslibrary/src/main/ets/component/MailBox.ets index 54c504e..6238f5c 100644 --- a/multicolumnslibrary/src/main/ets/application/MailBox.ets +++ b/multicolumnslibrary/src/main/ets/component/MailBox.ets @@ -23,13 +23,12 @@ export function MailBoxBuilder() { MailBox(); } -@Entry @Component -struct MailBox { +export struct MailBox { @State isFold: boolean = false; @State sideBarWidth: number = 304; - @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; @StorageProp('isShowMailSideBar') isShowMailSideBar: boolean = this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? true : false; private pageStack: NavPathStack = new NavPathStack(); diff --git a/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets b/multicolumnslibrary/src/main/ets/component/MultiColumnsPage.ets similarity index 87% rename from multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets rename to multicolumnslibrary/src/main/ets/component/MultiColumnsPage.ets index f4303b7..b4dacde 100644 --- a/multicolumnslibrary/src/main/ets/pages/MultiColumnsPage.ets +++ b/multicolumnslibrary/src/main/ets/component/MultiColumnsPage.ets @@ -19,10 +19,10 @@ import { CommonConstants, Route } from '../common/CommonConstants'; @Component export struct MultiColumnsPage { - @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; - @Provide('multiColumnsPathStack') pathStack: NavPathStack = new NavPathStack(); + @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; + @Provide(CommonConstants.KEY_PATH_STACK) pathStack: NavPathStack = new NavPathStack(); private routes: Route[] = CommonConstants.ROUTES; build() { @@ -48,7 +48,7 @@ export struct MultiColumnsPage { .backgroundColor($r('sys.color.comp_background_emphasize')) .onClick(() => { try { - this.pathStack.pushPathByName(item.to, null) + this.pathStack.pushPathByName(item.to, null); } catch (error) { hilog.error(0x0000, 'testTag', `Push url fail. Cause: ${(error as BusinessError).message}`); } diff --git a/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets b/multicolumnslibrary/src/main/ets/component/PhotoAlbum.ets similarity index 93% rename from multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets rename to multicolumnslibrary/src/main/ets/component/PhotoAlbum.ets index 6b9a862..45254cb 100644 --- a/multicolumnslibrary/src/main/ets/application/PhotoAlbum.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoAlbum.ets @@ -23,11 +23,10 @@ export function PhotoAlbumBuilder() { PhotoAlbum(); } -@Entry @Component -struct PhotoAlbum { - @StorageProp('multiColumnsBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; +export struct PhotoAlbum { + @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; @State sideBarStatus: boolean = this.curBp !== CommonConstants.BREAK_POINT_SM; private pageStack: NavPathStack = new NavPathStack(); diff --git a/multicolumnslibrary/src/main/ets/application/Settings.ets b/multicolumnslibrary/src/main/ets/component/Settings.ets similarity index 95% rename from multicolumnslibrary/src/main/ets/application/Settings.ets rename to multicolumnslibrary/src/main/ets/component/Settings.ets index 5430e4d..df44d11 100644 --- a/multicolumnslibrary/src/main/ets/application/Settings.ets +++ b/multicolumnslibrary/src/main/ets/component/Settings.ets @@ -23,13 +23,12 @@ export function SettingsBuilder() { Settings(); } -@Entry @Component -struct Settings { +export struct Settings { @State pathInfo: NavPathStack = new NavPathStack(); - @StorageProp('multiColumnsBreakPoint') currentBreakPoint: string = 'md'; - @StorageProp('multiColumnsTopRectHeight') topRectHeight: number = 0; - @StorageProp('multiColumnsBottomRectHeight') bottomRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; + @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; @Builder myRouter(name: string, param?: number | undefined) { diff --git a/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets b/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets index a74fea4..7d924f4 100644 --- a/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets +++ b/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets @@ -16,6 +16,7 @@ import { window } from '@kit.ArkUI'; import type { BusinessError } from '@kit.BasicServicesKit'; import { hilog } from '@kit.PerformanceAnalysisKit'; +import { CommonConstants } from '../common/CommonConstants'; const TAG: string = '[BreakpointSystem]'; @@ -78,7 +79,7 @@ export class BreakpointSystem { public static getInstance(): BreakpointSystem { if (!BreakpointSystem.instance) { BreakpointSystem.instance = new BreakpointSystem(); - AppStorage.setOrCreate('multiColumnsBreakPoint', BreakpointTypeEnum.MD); + AppStorage.setOrCreate(CommonConstants.KEY_BREAKPOINT, BreakpointTypeEnum.MD); } return BreakpointSystem.instance; } @@ -86,7 +87,7 @@ export class BreakpointSystem { public updateCurrentBreakpoint(breakpoint: BreakpointTypeEnum): void { if (this.currentBreakpoint !== breakpoint) { this.currentBreakpoint = breakpoint; - AppStorage.setOrCreate('multiColumnsBreakPoint', this.currentBreakpoint); + AppStorage.setOrCreate(CommonConstants.KEY_BREAKPOINT, this.currentBreakpoint); } } diff --git a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets index 6089262..bfc1935 100644 --- a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets +++ b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets @@ -17,10 +17,23 @@ import { window } from '@kit.ArkUI'; import type { BusinessError } from '@kit.BasicServicesKit'; import { BreakpointSystem } from './BreakpointSystem'; import { hilog } from '@kit.PerformanceAnalysisKit'; +import { CommonConstants } from '../common/CommonConstants'; const TAG: string = '[WindowUtil]'; export class WindowUtil { + public static initialize(windowStage: window.WindowStage) { + try { + const uiContext: UIContext = windowStage.getMainWindowSync()?.getUIContext(); + AppStorage.setOrCreate(CommonConstants.KEY_UI_CONTEXT, uiContext); + WindowUtil.requestFullScreen(windowStage); + WindowUtil.registerBreakPoint(windowStage); + } catch (err) { + const error = err as BusinessError; + hilog.error(0x0000, TAG, `Initialize failed. Cause code: ${error.code}, message: ${error.message}`); + } + } + public static requestFullScreen(windowStage: window.WindowStage): void { windowStage.getMainWindow((err: BusinessError, data: window.Window) => { if (err.code) { @@ -36,8 +49,10 @@ export class WindowUtil { hilog.info(0x0000, TAG, `Failed to set the window layout to full-screen mode. Cause: ${err.code}, ${err.message}`); }); - } catch { - hilog.error(0x0000, TAG, 'Failed to set the window layout to full-screen mode. '); + } catch (err) { + const error = err as BusinessError; + hilog.error(0x0000, TAG, + `Failed to set the window layout to full-screen mode.Cause code: ${error.code}, message: ${error.message}.`); } }); } @@ -62,8 +77,8 @@ export class WindowUtil { WindowUtil.setAvoidArea(avoidAreaOption.type, avoidAreaOption.area); } }); - } catch (e) { - const error = e as BusinessError; + } catch (err) { + const error = err as BusinessError; hilog.error(0x0000, TAG, `Register avoidAreaChange or windowSizeChange failed. code: ${error.code}, message: ${error.message}`); } @@ -72,10 +87,11 @@ export class WindowUtil { // Get status bar height and indicator height. public static setAvoidArea(type: window.AvoidAreaType, area: window.AvoidArea) { + const context = AppStorage.get(CommonConstants.KEY_UI_CONTEXT); if (type === window.AvoidAreaType.TYPE_SYSTEM) { - AppStorage.setOrCreate('multiColumnsTopRectHeight', px2vp(area.topRect.height)); + AppStorage.setOrCreate(CommonConstants.KEY_TOP_RECT_HEIGHT, context?.px2vp(area.topRect.height)); } else { - AppStorage.setOrCreate('multiColumnsBottomRectHeight', px2vp(area.bottomRect.height)); + AppStorage.setOrCreate(CommonConstants.KEY_BOTTOM_RECT_HEIGHT, context?.px2vp(area.bottomRect.height)); } } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/resources/base/profile/route_map.json b/multicolumnslibrary/src/main/resources/base/profile/route_map.json index d7fe417..27697df 100644 --- a/multicolumnslibrary/src/main/resources/base/profile/route_map.json +++ b/multicolumnslibrary/src/main/resources/base/profile/route_map.json @@ -2,7 +2,7 @@ "routerMap": [ { "name": "MailBox", - "pageSourceFile": "src/main/ets/application/MailBox.ets", + "pageSourceFile": "src/main/ets/component/MailBox.ets", "buildFunction": "MailBoxBuilder", "data": { "description": "this is MailBox" @@ -10,7 +10,7 @@ }, { "name": "PhotoAlbum", - "pageSourceFile": "src/main/ets/application/PhotoAlbum.ets", + "pageSourceFile": "src/main/ets/component/PhotoAlbum.ets", "buildFunction": "PhotoAlbumBuilder", "data": { "description": "this is PhotoAlbum" @@ -18,7 +18,7 @@ }, { "name": "Settings", - "pageSourceFile": "src/main/ets/application/Settings.ets", + "pageSourceFile": "src/main/ets/component/Settings.ets", "buildFunction": "SettingsBuilder", "data": { "description": "this is Settings" diff --git a/multicolumnssample/src/main/ets/entryability/EntryAbility.ets b/multicolumnssample/src/main/ets/entryability/EntryAbility.ets index 4b98c34..49e2ae4 100644 --- a/multicolumnssample/src/main/ets/entryability/EntryAbility.ets +++ b/multicolumnssample/src/main/ets/entryability/EntryAbility.ets @@ -13,16 +13,15 @@ * limitations under the License. */ -import { ConfigurationConstant, UIAbility } from '@kit.AbilityKit'; +import { UIAbility } from '@kit.AbilityKit'; import { window } from '@kit.ArkUI'; import { hilog } from '@kit.PerformanceAnalysisKit'; import { BusinessError } from '@kit.BasicServicesKit'; -import { WindowUtil } from 'multicolumnslibrary'; +import { MultiColumnController } from 'multicolumnslibrary'; export default class EntryAbility extends UIAbility { onCreate(): void { hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate'); - this.context.getApplicationContext().setColorMode(ConfigurationConstant.ColorMode.COLOR_MODE_NOT_SET); } onDestroy(): void { @@ -32,13 +31,12 @@ export default class EntryAbility extends UIAbility { onWindowStageCreate(windowStage: window.WindowStage): void { // Main window is created, set main page for this ability hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate'); - WindowUtil.requestFullScreen(windowStage); - WindowUtil.registerBreakPoint(windowStage); windowStage.loadContent('pages/Index', (err: BusinessError) => { if (err.code) { hilog.error(0x0000, 'testTag', `Failed to load the content. Cause: ${err.message}`); return; } + MultiColumnController.initWindowConfig(windowStage); }); } diff --git a/multicolumnssample/src/main/module.json5 b/multicolumnssample/src/main/module.json5 index 06dcdd5..1fcb880 100644 --- a/multicolumnssample/src/main/module.json5 +++ b/multicolumnssample/src/main/module.json5 @@ -21,7 +21,7 @@ "label": "$string:EntryAbility_label", "startWindowIcon": "$media:icon", "startWindowBackground": "$color:start_window_background", - "exported": false, + "exported": true, "skills": [ { "entities": [ -- Gitee From 97035f254558c0ff2163e173636c1fe87b7ed130 Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Wed, 9 Jul 2025 17:02:23 +0800 Subject: [PATCH 08/15] =?UTF-8?q?=E5=88=86=E6=A0=8F=E6=8E=A7=E4=BB=B6har?= =?UTF-8?q?=E8=A7=84=E8=8C=83=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnssample/obfuscation-rules.txt | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/multicolumnssample/obfuscation-rules.txt b/multicolumnssample/obfuscation-rules.txt index a1dfa0b..835187d 100644 --- a/multicolumnssample/obfuscation-rules.txt +++ b/multicolumnssample/obfuscation-rules.txt @@ -16,7 +16,7 @@ # Keep options: # -keep-property-name: specifies property names that you want to keep # -keep-global-name: specifies names that you want to keep in the global scope --enable-property-obfuscation +#-enable-property-obfuscation -enable-toplevel-obfuscation --enable-filename-obfuscation +#-enable-filename-obfuscation -enable-export-obfuscation \ No newline at end of file -- Gitee From dee04be2b6d6dc03f108c6ff4f107cfece2a725b Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Thu, 10 Jul 2025 15:10:06 +0800 Subject: [PATCH 09/15] =?UTF-8?q?=E8=A7=84=E8=8C=83=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 15 ++++++++------- README_EN.md | 15 ++++++++------- multicolumnslibrary/Index.ets | 2 +- .../{MailBox.ets => MailBoxComponent.ets} | 4 ++-- ...iColumnsPage.ets => MultiColumnsComponent.ets} | 2 +- .../{PhotoAlbum.ets => PhotoAlbumComponent.ets} | 4 ++-- .../{Settings.ets => SettingsComponent.ets} | 4 ++-- .../main/resources/base/profile/route_map.json | 6 +++--- multicolumnssample/oh-package.json5 | 2 +- .../src/main/ets/entryability/EntryAbility.ets | 2 +- multicolumnssample/src/main/ets/pages/Index.ets | 2 +- 11 files changed, 30 insertions(+), 28 deletions(-) rename multicolumnslibrary/src/main/ets/component/{MailBox.ets => MailBoxComponent.ets} (98%) rename multicolumnslibrary/src/main/ets/component/{MultiColumnsPage.ets => MultiColumnsComponent.ets} (98%) rename multicolumnslibrary/src/main/ets/component/{PhotoAlbum.ets => PhotoAlbumComponent.ets} (98%) rename multicolumnslibrary/src/main/ets/component/{Settings.ets => SettingsComponent.ets} (99%) diff --git a/README.md b/README.md index 397c079..4c172d8 100644 --- a/README.md +++ b/README.md @@ -26,10 +26,10 @@ multicolumnslibrary ├──src/main/ets // 代码区 │ ├──component -│ │ ├──MailBox.ets // 邮箱 -│ │ ├──MultiColumnsPage.ets // 首页 -│ │ ├──PhotoAlbum.ets // 图库 -│ │ └──Settings.ets // 设置 +│ │ ├──MailBoxComponent.ets // 邮箱 +│ │ ├──MultiColumnsComponent.ets // 首页 +│ │ ├──PhotoAlbumComponent.ets // 图库 +│ │ └──SettingsComponent.ets // 设置 │ ├──common │ │ ├──BreakpointSystem.ets // 媒体查询 │ │ ├──MailContent.ets // 邮箱详情 @@ -41,9 +41,10 @@ multicolumnslibrary │ │ └──WlanItem.ets // Wlan详情页 │ ├──model │ │ └──dataType.ets // 侧边栏菜单数据类型 -│ └──utils -│ ├──BreakpointSystem.ets // 断点 -│ └──WindowUtils.ets // 窗口工具 +│ ├──utils +│ │ ├──BreakpointSystem.ets // 断点 +│ │ └──WindowUtils.ets // 窗口工具 +│ └──MultiColumnController.ets // 能力控制器 └──src/main/resources // 应用资源目录 multicolumnssample ├──src/main/ets // 代码区 diff --git a/README_EN.md b/README_EN.md index da747d5..cf0854c 100644 --- a/README_EN.md +++ b/README_EN.md @@ -27,10 +27,10 @@ Below are the preview effects. multicolumnslibrary ├──src/main/ets // Code area │ ├──component -│ │ ├──MailBox.ets // Mailbox component -│ │ ├──MultiColumnsPage.ets // Home component -│ │ ├──PhotoAlbum.ets // Photo album component -│ │ └──Settings.ets // Settings component +│ │ ├──MailBoxComponent.ets // Mailbox component +│ │ ├──MultiColumnsComponent.ets // Home component +│ │ ├──PhotoAlbumComponent.ets // Photo album component +│ │ └──SettingsComponent.ets // Settings component │ ├──common │ │ ├──BreakpointSystem.ets // Breakpoint system │ │ ├──MailContent.ets // Mail content @@ -42,9 +42,10 @@ multicolumnslibrary │ │ └──WlanItem.ets // WLAN details page │ ├──model │ │ └──dataType.ets // Sidebar menu data type -│ └──utils -│ ├──BreakpointSystem.ets // BreakpointSystem util -│ └──WindowUtils.ets // Window util +│ ├──utils +│ │ ├──BreakpointSystem.ets // BreakpointSystem util +│ │ └──WindowUtils.ets // Window util +│ └──MultiColumnController.ets └──src/main/resources // App resource directory multicolumnssample ├──src/main/ets // Code area diff --git a/multicolumnslibrary/Index.ets b/multicolumnslibrary/Index.ets index 475396a..c8e200a 100644 --- a/multicolumnslibrary/Index.ets +++ b/multicolumnslibrary/Index.ets @@ -1,3 +1,3 @@ -export { MultiColumnsPage } from './src/main/ets/component/MultiColumnsPage'; +export { MultiColumnsComponent as MultiColumnsPage } from './src/main/ets/component/MultiColumnsComponent'; export { MultiColumnController } from './src/main/ets/MultiColumnController'; \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/component/MailBox.ets b/multicolumnslibrary/src/main/ets/component/MailBoxComponent.ets similarity index 98% rename from multicolumnslibrary/src/main/ets/component/MailBox.ets rename to multicolumnslibrary/src/main/ets/component/MailBoxComponent.ets index 6238f5c..3c4b100 100644 --- a/multicolumnslibrary/src/main/ets/component/MailBox.ets +++ b/multicolumnslibrary/src/main/ets/component/MailBoxComponent.ets @@ -20,11 +20,11 @@ import { CommonConstants } from '../common/CommonConstants'; @Builder export function MailBoxBuilder() { - MailBox(); + MailBoxComponent(); } @Component -export struct MailBox { +export struct MailBoxComponent { @State isFold: boolean = false; @State sideBarWidth: number = 304; @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; diff --git a/multicolumnslibrary/src/main/ets/component/MultiColumnsPage.ets b/multicolumnslibrary/src/main/ets/component/MultiColumnsComponent.ets similarity index 98% rename from multicolumnslibrary/src/main/ets/component/MultiColumnsPage.ets rename to multicolumnslibrary/src/main/ets/component/MultiColumnsComponent.ets index b4dacde..e759494 100644 --- a/multicolumnslibrary/src/main/ets/component/MultiColumnsPage.ets +++ b/multicolumnslibrary/src/main/ets/component/MultiColumnsComponent.ets @@ -18,7 +18,7 @@ import { BusinessError } from '@kit.BasicServicesKit'; import { CommonConstants, Route } from '../common/CommonConstants'; @Component -export struct MultiColumnsPage { +export struct MultiColumnsComponent { @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; diff --git a/multicolumnslibrary/src/main/ets/component/PhotoAlbum.ets b/multicolumnslibrary/src/main/ets/component/PhotoAlbumComponent.ets similarity index 98% rename from multicolumnslibrary/src/main/ets/component/PhotoAlbum.ets rename to multicolumnslibrary/src/main/ets/component/PhotoAlbumComponent.ets index 45254cb..081e4f5 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoAlbum.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoAlbumComponent.ets @@ -20,11 +20,11 @@ import { PhotoSideBar } from '../common/PhotoSideBar'; @Builder export function PhotoAlbumBuilder() { - PhotoAlbum(); + PhotoAlbumComponent(); } @Component -export struct PhotoAlbum { +export struct PhotoAlbumComponent { @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; @State sideBarStatus: boolean = this.curBp !== CommonConstants.BREAK_POINT_SM; diff --git a/multicolumnslibrary/src/main/ets/component/Settings.ets b/multicolumnslibrary/src/main/ets/component/SettingsComponent.ets similarity index 99% rename from multicolumnslibrary/src/main/ets/component/Settings.ets rename to multicolumnslibrary/src/main/ets/component/SettingsComponent.ets index df44d11..4a5da2b 100644 --- a/multicolumnslibrary/src/main/ets/component/Settings.ets +++ b/multicolumnslibrary/src/main/ets/component/SettingsComponent.ets @@ -20,11 +20,11 @@ import { CommonConstants } from '../common/CommonConstants'; @Builder export function SettingsBuilder() { - Settings(); + SettingsComponent(); } @Component -export struct Settings { +export struct SettingsComponent { @State pathInfo: NavPathStack = new NavPathStack(); @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; diff --git a/multicolumnslibrary/src/main/resources/base/profile/route_map.json b/multicolumnslibrary/src/main/resources/base/profile/route_map.json index 27697df..883c791 100644 --- a/multicolumnslibrary/src/main/resources/base/profile/route_map.json +++ b/multicolumnslibrary/src/main/resources/base/profile/route_map.json @@ -2,7 +2,7 @@ "routerMap": [ { "name": "MailBox", - "pageSourceFile": "src/main/ets/component/MailBox.ets", + "pageSourceFile": "src/main/ets/component/MailBoxComponent.ets", "buildFunction": "MailBoxBuilder", "data": { "description": "this is MailBox" @@ -10,7 +10,7 @@ }, { "name": "PhotoAlbum", - "pageSourceFile": "src/main/ets/component/PhotoAlbum.ets", + "pageSourceFile": "src/main/ets/component/PhotoAlbumComponent.ets", "buildFunction": "PhotoAlbumBuilder", "data": { "description": "this is PhotoAlbum" @@ -18,7 +18,7 @@ }, { "name": "Settings", - "pageSourceFile": "src/main/ets/component/Settings.ets", + "pageSourceFile": "src/main/ets/component/SettingsComponent.ets", "buildFunction": "SettingsBuilder", "data": { "description": "this is Settings" diff --git a/multicolumnssample/oh-package.json5 b/multicolumnssample/oh-package.json5 index 6a0600f..c44c365 100644 --- a/multicolumnssample/oh-package.json5 +++ b/multicolumnssample/oh-package.json5 @@ -7,6 +7,6 @@ "main": "", "version": "1.0.0", "dependencies": { - "multicolumnslibrary": "file:../multicolumnslibrary" + "@ohos_samples/multicolumnslibrary": "file:../multicolumnslibrary" } } \ No newline at end of file diff --git a/multicolumnssample/src/main/ets/entryability/EntryAbility.ets b/multicolumnssample/src/main/ets/entryability/EntryAbility.ets index 49e2ae4..7b1575d 100644 --- a/multicolumnssample/src/main/ets/entryability/EntryAbility.ets +++ b/multicolumnssample/src/main/ets/entryability/EntryAbility.ets @@ -17,7 +17,7 @@ import { UIAbility } from '@kit.AbilityKit'; import { window } from '@kit.ArkUI'; import { hilog } from '@kit.PerformanceAnalysisKit'; import { BusinessError } from '@kit.BasicServicesKit'; -import { MultiColumnController } from 'multicolumnslibrary'; +import { MultiColumnController } from '@ohos_samples/multicolumnslibrary'; export default class EntryAbility extends UIAbility { onCreate(): void { diff --git a/multicolumnssample/src/main/ets/pages/Index.ets b/multicolumnssample/src/main/ets/pages/Index.ets index b668699..862b54f 100644 --- a/multicolumnssample/src/main/ets/pages/Index.ets +++ b/multicolumnssample/src/main/ets/pages/Index.ets @@ -13,7 +13,7 @@ * limitations under the License. */ -import { MultiColumnsPage } from 'multicolumnslibrary'; +import { MultiColumnsPage } from '@ohos_samples/multicolumnslibrary'; @Entry @Component -- Gitee From c63eff7dba3e0144a32b13ab81ad028cc6391e4f Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Thu, 10 Jul 2025 15:58:24 +0800 Subject: [PATCH 10/15] =?UTF-8?q?=E8=A7=84=E8=8C=83=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnslibrary/Index.ets | 2 +- multicolumnslibrary/README.md | 8 ++++---- .../src/main/ets/common/MailNavigation.ets | 2 +- multicolumnslibrary/src/main/ets/common/PhotoContent.ets | 2 +- multicolumnslibrary/src/main/ets/utils/WindowUtils.ets | 2 +- multicolumnssample/src/main/ets/pages/Index.ets | 4 ++-- 6 files changed, 10 insertions(+), 10 deletions(-) diff --git a/multicolumnslibrary/Index.ets b/multicolumnslibrary/Index.ets index c8e200a..72f59b9 100644 --- a/multicolumnslibrary/Index.ets +++ b/multicolumnslibrary/Index.ets @@ -1,3 +1,3 @@ -export { MultiColumnsComponent as MultiColumnsPage } from './src/main/ets/component/MultiColumnsComponent'; +export { MultiColumnsComponent } from './src/main/ets/component/MultiColumnsComponent'; export { MultiColumnController } from './src/main/ets/MultiColumnController'; \ No newline at end of file diff --git a/multicolumnslibrary/README.md b/multicolumnslibrary/README.md index 6433a08..348bad6 100644 --- a/multicolumnslibrary/README.md +++ b/multicolumnslibrary/README.md @@ -31,14 +31,14 @@ ohpm install @ohos_samples/multicolumnslibrary ### 使用说明 ``` -import { MultiColumnsPage, MultiColumnController } from '@ohos_samples/multicolumnslibrary'; +import { MultiColumnsComponent, MultiColumnController } from '@ohos_samples/multicolumnslibrary'; ``` -按需在文件中使用导出模块即可，其中MultiColumnsPage是整个sample的入口页面。MultiColumnController初始化了沉浸式、设备断点判断、避让区域计算等窗口能力。示例如下： +按需在文件中使用导出模块即可，其MultiColumnsComponent是整个sample的入口页面组件。MultiColumnController初始化了沉浸式、设备断点判断、避让区域计算等窗口能力。示例如下： ``` // Page.ets -import { MultiColumnsPage } from '@ohos_samples/multicolumnslibrary'; +import { MultiColumnsComponent } from '@ohos_samples/multicolumnslibrary'; Stack() { - MultiColumnsPage() + MultiColumnsComponent() } // EntryAbility.ets diff --git a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets index a014c3f..760698d 100644 --- a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/common/MailNavigation.ets @@ -127,7 +127,7 @@ export struct MailNavigation { } } } - .navBarWidth(new BreakpointType({ sm: 321, md: 321, lg: 390 }).getValue(this.currentBreakPoint) as number | Length) + .navBarWidth(new BreakpointType({ sm: 321, md: 321, lg: 390 }).getValue(this.currentBreakPoint)) .navDestination(this.myRouter) .menus(this.NavigationMenus) .width('100%') diff --git a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets index 37a849c..c615f64 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/common/PhotoContent.ets @@ -51,7 +51,7 @@ export struct PhotoContent { } onStateChange() { - animateTo({ duration: 300 }, () => { + this.getUIContext().animateTo({ duration: 300 }, () => { if (this.sideBarStatus === true && this.currentBreakPoint === 'md') { this.columnsTemplate = '1fr 1fr 1fr'; } else if (this.sideBarStatus === true && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { diff --git a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets index bfc1935..403600e 100644 --- a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets +++ b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets @@ -15,8 +15,8 @@ import { window } from '@kit.ArkUI'; import type { BusinessError } from '@kit.BasicServicesKit'; -import { BreakpointSystem } from './BreakpointSystem'; import { hilog } from '@kit.PerformanceAnalysisKit'; +import { BreakpointSystem } from './BreakpointSystem'; import { CommonConstants } from '../common/CommonConstants'; const TAG: string = '[WindowUtil]'; diff --git a/multicolumnssample/src/main/ets/pages/Index.ets b/multicolumnssample/src/main/ets/pages/Index.ets index 862b54f..caf669c 100644 --- a/multicolumnssample/src/main/ets/pages/Index.ets +++ b/multicolumnssample/src/main/ets/pages/Index.ets @@ -13,14 +13,14 @@ * limitations under the License. */ -import { MultiColumnsPage } from '@ohos_samples/multicolumnslibrary'; +import { MultiColumnsComponent } from '@ohos_samples/multicolumnslibrary'; @Entry @Component struct Index { build() { Stack() { - MultiColumnsPage() + MultiColumnsComponent() } } } \ No newline at end of file -- Gitee From 58abbca18501e6fffbc73ca1f034937f0d9c8708 Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Fri, 11 Jul 2025 15:47:05 +0800 Subject: [PATCH 11/15] =?UTF-8?q?=E8=A7=84=E8=8C=83=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 15 +-- README_EN.md | 13 +-- multicolumnslibrary/CHANGELOG.md | 2 +- multicolumnslibrary/Index.ets | 2 +- multicolumnslibrary/README.md | 8 +- .../src/main/ets/common/CommonConstants.ets | 52 +++++++++- .../ets/{common => component}/MailContent.ets | 58 +++++++---- .../{common => component}/MailNavigation.ets | 89 +++++++++++------ .../ets/{common => component}/MailSideBar.ets | 80 ++++++++------- .../{common => component}/PhotoContent.ets | 47 ++++++--- .../{common => component}/PhotoSideBar.ets | 48 +++++---- .../ets/{common => component}/SettingItem.ets | 64 ++++++------ .../ets/{common => component}/WlanItem.ets | 59 ++++++----- .../MailBoxView.ets} | 41 ++++---- .../MultiColumnsView.ets} | 2 +- .../PhotoAlbumView.ets} | 33 ++++--- .../SettingsView.ets} | 46 ++++----- .../main/resources/base/element/color.json | 4 + .../main/resources/base/element/float.json | 92 ++++++++++++++++++ .../main/resources/base/element/string.json | 12 --- .../resources/base/profile/route_map.json | 6 +- .../main/resources/en_US/element/string.json | 12 --- .../main/resources/zh_CN/element/string.json | 12 --- .../src/main/ets/pages/Index.ets | 4 +- .../main/resources/base/element/color.json | 8 ++ .../main/resources/base/element/string.json | 16 +++ .../main/resources/base/media/background.png | Bin .../main/resources/base/media/foreground.png | Bin .../resources/base/media/layered_image.json | 0 .../main/resources/base/media/startIcon.png | Bin 0 -> 6790 bytes .../main/resources/en_US/element/string.json | 16 +++ .../main/resources/zh_CN/element/string.json | 16 +++ 32 files changed, 558 insertions(+), 299 deletions(-) rename multicolumnslibrary/src/main/ets/{common => component}/MailContent.ets (65%) rename multicolumnslibrary/src/main/ets/{common => component}/MailNavigation.ets (50%) rename multicolumnslibrary/src/main/ets/{common => component}/MailSideBar.ets (60%) rename multicolumnslibrary/src/main/ets/{common => component}/PhotoContent.ets (73%) rename multicolumnslibrary/src/main/ets/{common => component}/PhotoSideBar.ets (69%) rename multicolumnslibrary/src/main/ets/{common => component}/SettingItem.ets (60%) rename multicolumnslibrary/src/main/ets/{common => component}/WlanItem.ets (70%) rename multicolumnslibrary/src/main/ets/{component/MailBoxComponent.ets => view/MailBoxView.ets} (73%) rename multicolumnslibrary/src/main/ets/{component/MultiColumnsComponent.ets => view/MultiColumnsView.ets} (98%) rename multicolumnslibrary/src/main/ets/{component/PhotoAlbumComponent.ets => view/PhotoAlbumView.ets} (71%) rename multicolumnslibrary/src/main/ets/{component/SettingsComponent.ets => view/SettingsView.ets} (79%) create mode 100644 multicolumnssample/src/main/resources/base/element/color.json create mode 100644 multicolumnssample/src/main/resources/base/element/string.json rename {multicolumnslibrary => multicolumnssample}/src/main/resources/base/media/background.png (100%) rename {multicolumnslibrary => multicolumnssample}/src/main/resources/base/media/foreground.png (100%) rename {multicolumnslibrary => multicolumnssample}/src/main/resources/base/media/layered_image.json (100%) create mode 100644 multicolumnssample/src/main/resources/base/media/startIcon.png create mode 100644 multicolumnssample/src/main/resources/en_US/element/string.json create mode 100644 multicolumnssample/src/main/resources/zh_CN/element/string.json diff --git a/README.md b/README.md index 4c172d8..263d0f8 100644 --- a/README.md +++ b/README.md @@ -25,25 +25,26 @@ ``` multicolumnslibrary ├──src/main/ets // 代码区 -│ ├──component -│ │ ├──MailBoxComponent.ets // 邮箱 -│ │ ├──MultiColumnsComponent.ets // 首页 -│ │ ├──PhotoAlbumComponent.ets // 图库 -│ │ └──SettingsComponent.ets // 设置 │ ├──common -│ │ ├──BreakpointSystem.ets // 媒体查询 +│ │ └──CommonConstants.ets +│ ├──component │ │ ├──MailContent.ets // 邮箱详情 │ │ ├──MailNavigation.ets // 邮箱导航 │ │ ├──MailSideBar.ets // 邮箱侧边栏 │ │ ├──PhotoContent.ets // 图库详情 │ │ ├──PhotoSideBar.ets // 图库侧边栏 │ │ ├──SettingItem.ets // setting设置项 -│ │ └──WlanItem.ets // Wlan详情页 +│ │ └──WlanItem.ets // Wlan详情页 │ ├──model │ │ └──dataType.ets // 侧边栏菜单数据类型 │ ├──utils │ │ ├──BreakpointSystem.ets // 断点 │ │ └──WindowUtils.ets // 窗口工具 +│ ├──view +│ │ ├──MailBoxView.ets // 邮箱 +│ │ ├──MultiColumnsView.ets // 首页 +│ │ ├──PhotoAlbumView.ets // 图库 +│ │ └──SettingsView.ets // 设置 │ └──MultiColumnController.ets // 能力控制器 └──src/main/resources // 应用资源目录 multicolumnssample diff --git a/README_EN.md b/README_EN.md index cf0854c..aff6dbe 100644 --- a/README_EN.md +++ b/README_EN.md @@ -26,13 +26,9 @@ Below are the preview effects. ``` multicolumnslibrary ├──src/main/ets // Code area -│ ├──component -│ │ ├──MailBoxComponent.ets // Mailbox component -│ │ ├──MultiColumnsComponent.ets // Home component -│ │ ├──PhotoAlbumComponent.ets // Photo album component -│ │ └──SettingsComponent.ets // Settings component │ ├──common -│ │ ├──BreakpointSystem.ets // Breakpoint system +│ │ └──CommonConstants.ets +│ ├──component │ │ ├──MailContent.ets // Mail content │ │ ├──MailNavigation.ets // Mailbox navigation │ │ ├──MailSideBar.ets // Sidebar of the mailbox @@ -45,6 +41,11 @@ multicolumnslibrary │ ├──utils │ │ ├──BreakpointSystem.ets // BreakpointSystem util │ │ └──WindowUtils.ets // Window util +│ ├──view +│ │ ├──MailBoxView.ets // Mailbox +│ │ ├──MultiColumnsView.ets // Home +│ │ ├──PhotoAlbumView.ets // Photo +│ │ └──SettingsView.ets // Settings │ └──MultiColumnController.ets └──src/main/resources // App resource directory multicolumnssample diff --git a/multicolumnslibrary/CHANGELOG.md b/multicolumnslibrary/CHANGELOG.md index 10f7f3f..addaa8c 100644 --- a/multicolumnslibrary/CHANGELOG.md +++ b/multicolumnslibrary/CHANGELOG.md @@ -1,5 +1,5 @@ # 版本记录 -## 1.0.0（2025.07.10） +## 1.0.0（2025.07.11） --- ### Initial diff --git a/multicolumnslibrary/Index.ets b/multicolumnslibrary/Index.ets index 72f59b9..ea7a239 100644 --- a/multicolumnslibrary/Index.ets +++ b/multicolumnslibrary/Index.ets @@ -1,3 +1,3 @@ -export { MultiColumnsComponent } from './src/main/ets/component/MultiColumnsComponent'; +export { MultiColumnsView } from './src/main/ets/view/MultiColumnsView'; export { MultiColumnController } from './src/main/ets/MultiColumnController'; \ No newline at end of file diff --git a/multicolumnslibrary/README.md b/multicolumnslibrary/README.md index 348bad6..3e79d3e 100644 --- a/multicolumnslibrary/README.md +++ b/multicolumnslibrary/README.md @@ -31,14 +31,14 @@ ohpm install @ohos_samples/multicolumnslibrary ### 使用说明 ``` -import { MultiColumnsComponent, MultiColumnController } from '@ohos_samples/multicolumnslibrary'; +import { MultiColumnsView, MultiColumnController } from '@ohos_samples/multicolumnslibrary'; ``` -按需在文件中使用导出模块即可，其MultiColumnsComponent是整个sample的入口页面组件。MultiColumnController初始化了沉浸式、设备断点判断、避让区域计算等窗口能力。示例如下： +按需在文件中使用导出模块即可，其MultiColumnsView是整个sample的入口页面组件。MultiColumnController初始化了沉浸式、设备断点判断、避让区域计算等窗口能力。示例如下： ``` // Page.ets -import { MultiColumnsComponent } from '@ohos_samples/multicolumnslibrary'; +import { MultiColumnsView } from '@ohos_samples/multicolumnslibrary'; Stack() { - MultiColumnsComponent() + MultiColumnsView() } // EntryAbility.ets diff --git a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets b/multicolumnslibrary/src/main/ets/common/CommonConstants.ets index 4423e16..67090a5 100644 --- a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets +++ b/multicolumnslibrary/src/main/ets/common/CommonConstants.ets @@ -29,10 +29,38 @@ export class CommonConstants { * Index page padding bottom size. */ public static readonly PADDING_BOTTOM_INDEX: number = 16; + /** + * image size. + */ + public static readonly IMAGE_SIZE_SMALL: number = 24; + /** + * Grid space. + */ + public static readonly GRID_SPACE: number = 12; + /** + * List space. + */ + public static readonly LIST_SPACE: number = 20; /** * Custom padding top size. */ public static readonly PADDING_CUSTOM: number = 8; + /** + * Custom padding size 16. + */ + public static readonly PADDING_16: number = 16; + /** + * Custom padding size 24. + */ + public static readonly PADDING_24: number = 24; + /** + * Custom padding size 32. + */ + public static readonly PADDING_32: number = 32; + /** + * album title padding left. + */ + public static readonly ALBUMS_PADDING_LEFT: number = 36; /** * Width the percentage of the 100. */ @@ -45,13 +73,33 @@ export class CommonConstants { * Breakpoint sm. */ public static readonly BREAK_POINT_SM: string = 'sm'; + /** + * Breakpoint sm navBarWidth. + */ + public static readonly NAV_BAR_WIDTH_SM: number = 321; + /** + * Breakpoint md navBarWidth. + */ + public static readonly NAV_BAR_WIDTH_MD: number = 321; + /** + * Breakpoint lg navBarWidth. + */ + public static readonly NAV_BAR_WIDTH_LG: number = 390; + /** + * Breakpoint lg navBarWidth. + */ + public static readonly SIDE_BAR_WIDTH_MIN: number = 240; + /** + * Breakpoint lg navBarWidth. + */ + public static readonly SIDE_BAR_WIDTH_CONTENT_MIN: number = 600; /** * AppStorage key */ public static readonly KEY_PREFIX_COLUMNS: string = 'multiColumns'; public static readonly KEY_BREAKPOINT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'BreakPoint'; - public static readonly KEY_TOP_RECT_HEIGHT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'TopRectHeight'; - public static readonly KEY_BOTTOM_RECT_HEIGHT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'BottomRectHeight'; + public static readonly KEY_TOP_RECT_HEIGHT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'StatusBarHeight'; + public static readonly KEY_BOTTOM_RECT_HEIGHT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'NavIndicatorHeight'; public static readonly KEY_PATH_STACK: string = CommonConstants.KEY_PREFIX_COLUMNS + 'PathStack'; public static readonly KEY_UI_CONTEXT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'UIContext'; /** diff --git a/multicolumnslibrary/src/main/ets/common/MailContent.ets b/multicolumnslibrary/src/main/ets/component/MailContent.ets similarity index 65% rename from multicolumnslibrary/src/main/ets/common/MailContent.ets rename to multicolumnslibrary/src/main/ets/component/MailContent.ets index 2f99953..9a042ae 100644 --- a/multicolumnslibrary/src/main/ets/common/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/component/MailContent.ets @@ -15,7 +15,7 @@ import { OperateTabs } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from './CommonConstants'; +import { CommonConstants } from '../common/CommonConstants'; @Component export struct MailContent { @@ -35,53 +35,69 @@ export struct MailContent { Column() { Column() { Text('HHHxx UXD') - .fontSize(22) - .margin({ left: this.curBp === 'sm' ? 32 + CommonConstants.BACK_SIZE : 0 }) + .fontSize($r('sys.float.Title_M')) + .margin({ left: this.curBp === 'sm' ? CommonConstants.PADDING_32 + CommonConstants.BACK_SIZE : 0 }) .fontWeight(FontWeight.Medium) .fontColor($r('sys.color.font_primary')) Row() { Text($r('app.string.recUser')) - .fontSize(14) + .fontSize($r('sys.float.Body_M')) .fontWeight(FontWeight.Regular) .fontColor($r('sys.color.font_primary')) Text($r('app.string.mailDesc')) - .padding({ left: 12 }) - .fontSize(16) + .padding({ left: $r('sys.float.padding_level6') }) + .fontSize($r('sys.float.Body_L')) .fontWeight(FontWeight.Medium) .fontColor($r('sys.color.font_primary')) Blank() SymbolGlyph($r('sys.symbol.chevron_down')) - .fontSize(24) + .fontSize($r('sys.float.Title_M')) .fontColor([$r('sys.color.icon_secondary')]) } .width('100%') - .height(48) + .height($r('app.float.item_height_48')) - Text('PostMaster').fontSize(20).fontColor($r('sys.color.font_primary')).lineHeight(23) - Text('09:42').margin({ top: 2 }).fontColor($r('sys.color.font_tertiary')) + Text('PostMaster') + .fontSize($r('sys.float.Title_S')) + .fontColor($r('sys.color.font_primary')) + .lineHeight($r('app.float.line_height_23')) + Text('09:42') + .margin({ top: $r('sys.float.padding_level1') }) + .fontColor($r('sys.color.font_tertiary')) Scroll() { Column() { Text($r('app.string.textData')).fancyText() Text($r('app.string.bodyTextPartOne')).fancyText() Text('').fancyText() - Image($r('app.media.orange')).width('100%').height(166).borderRadius(10) + Image($r('app.media.orange')) + .width('100%') + .height($r('app.float.content_image_height')) + .borderRadius($r('sys.float.corner_radius_level5')) Text('').fancyText() Text($r('app.string.bodyTextPartTwo')).fancyText() Text($r('app.string.bodyTextPartThree')).fancyText() } .alignItems(HorizontalAlign.Center) } - .margin({ top: 20 }) + .margin({ top: $r('sys.float.padding_level10') }) .layoutWeight(1) .width('100%') .scrollBar(BarState.Off) } .layoutWeight(1) .padding({ - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), - right: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), + left: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.curBp), + right: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16'), + }).getValue(this.curBp), }) .alignItems(HorizontalAlign.Start) @@ -90,11 +106,11 @@ export struct MailContent { Column() { SymbolGlyph(item.src) .fontColor([$r('sys.color.ohos_id_color_text_secondary')]) - .fontSize(24) + .fontSize($r('sys.float.Title_M')) Text(item.name) .fontColor($r('sys.color.ohos_id_color_text_secondary')) - .fontSize(10) - .lineHeight(12) + .fontSize($r('sys.float.Caption_M')) + .lineHeight($r('app.float.line_height_12')) } }, (item: OperateTabs, index: number) => { return index + JSON.stringify(item); @@ -102,13 +118,13 @@ export struct MailContent { } .justifyContent(FlexAlign.SpaceAround) .width('100%') - .height(56) + .height($r('app.float.item_height')) } .width('100%') .height('100%') } .padding({ - top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, + top: this.topRectHeight === 0 ? CommonConstants.PADDING_16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, bottom: this.bottomRectHeight }) .backgroundColor($r('sys.color.background_secondary')) @@ -121,7 +137,7 @@ export struct MailContent { @Extend(Text) function fancyText() { .fontColor($r('sys.color.font_primary')) - .fontSize(16) + .fontSize($r('sys.float.Body_L')) .fontWeight(FontWeight.Regular) - .lineHeight(25) + .lineHeight($r('app.float.line_height_25')) } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets similarity index 50% rename from multicolumnslibrary/src/main/ets/common/MailNavigation.ets rename to multicolumnslibrary/src/main/ets/component/MailNavigation.ets index 760698d..a54e04e 100644 --- a/multicolumnslibrary/src/main/ets/common/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets @@ -14,7 +14,7 @@ */ import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from './CommonConstants'; +import { CommonConstants } from '../common/CommonConstants'; import { MailContent } from './MailContent'; @Component @@ -35,15 +35,15 @@ export struct MailNavigation { Row() { SymbolGlyph($r('sys.symbol.plus')) .fontColor([$r('sys.color.icon_primary')]) - .fontSize(24) + .fontSize($r('sys.float.Title_M')) SymbolGlyph($r('sys.symbol.dot_grid_2x2')) .fontColor([$r('sys.color.icon_primary')]) - .fontSize(24) - .margin({ left: 24 }) + .fontSize($r('sys.float.Title_M')) + .margin({ left: $r('sys.float.padding_level12') }) } .alignItems(VerticalAlign.Center) - .height(56) - .padding({ top: this.topRectHeight + CommonConstants.PADDING_CUSTOM, right: 16 }) + .height($r('app.float.item_height')) + .padding({ top: this.topRectHeight + CommonConstants.PADDING_CUSTOM, right: CommonConstants.PADDING_16 }) } } @@ -52,20 +52,28 @@ export struct MailNavigation { Column() { Text($r('app.string.recvBox')) .fontColor($r('sys.color.font_primary')) - .fontSize(30) + .fontSize($r('sys.float.Title_L')) .fontWeight(FontWeight.Medium) Text('xxxxxxxxxxxxx') .fontColor($r('sys.color.font_tertiary')) - .fontSize(14) - .margin({ top: 4, left: 2 }) + .fontSize($r('sys.float.Subtitle_S')) + .margin({ top: $r('sys.float.padding_level2'), left: $r('sys.float.padding_level1') }) } .alignItems(HorizontalAlign.Start) .height(140) .width('100%') .padding({ top: 80, - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint), - right: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint) + left: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.currentBreakPoint), + right: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.currentBreakPoint), }) } @@ -83,33 +91,43 @@ export struct MailNavigation { ListItem() { Column() { Row() { - Text($r('app.string.nonSense')).fontSize(16).lineHeight(22).fontColor('#1818a') + Text($r('app.string.nonSense')) + .fontSize($r('sys.float.Body_L')) + .lineHeight($r('app.float.line_height_22')) + .fontColor($r('app.color.text_color')) Blank() - Text('4/12').fontSize(12).opacity(0.6) + Text('4/12') + .fontSize($r('sys.float.Body_S')) + .opacity(0.6) }.width('100%') Column() { - Text($r('app.string.textPartOne')).lineHeight(19).fontSize(14).fontColor('#1818a') + Text($r('app.string.textPartOne')) + .lineHeight($r('app.float.line_height_19')) + .fontSize($r('sys.float.Body_M')) + .fontColor($r('app.color.text_color')) Text($r('app.string.textPartTwo')) - .fontSize(14) - .fontColor('#1818a') + .fontSize($r('sys.float.Body_M')) + .fontColor($r('app.color.text_color')) .opacity(0.6) - .lineHeight(19) + .lineHeight($r('app.float.line_height_19')) } - .width('100%').alignItems(HorizontalAlign.Start) + .width('100%') + .alignItems(HorizontalAlign.Start) } - .height(96).justifyContent(FlexAlign.Center) + .height($r('app.float.mail_mail_height')) + .justifyContent(FlexAlign.Center) } - .padding({ left: 12, right: 12 }) + .padding({ left: $r('sys.float.padding_level6'), right: $r('sys.float.padding_level6') }) .backgroundColor(index === 2 ? '#19254ff7' : '') - .borderRadius(10) + .borderRadius($r('sys.float.corner_radius_level5')) }, (item: string) => item.toString()) } .scrollBar(BarState.Off) .divider({ strokeWidth: 0.5, - startMargin: 12, - endMargin: 12, + startMargin: $r('sys.float.padding_level6'), + endMargin: $r('sys.float.padding_level6'), color: $r('sys.color.comp_divider') }) .height('100%') @@ -118,20 +136,35 @@ export struct MailNavigation { } .height('100%').width('100%') .padding({ - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint), - right: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint) + left: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.currentBreakPoint), + right: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.currentBreakPoint), }) if (this.currentBreakPoint !== 'lg' && this.currentBreakPoint !== 'xl') { - Image($r('app.media.ic_public_list_add_light')).width(48).height(48).position({ x: 240, y: 549 }) + Image($r('app.media.ic_public_list_add_light')) + .width($r('app.float.image_size_48')) + .height($r('app.float.image_size_48')) + .position({ x: 240, y: 549 }) } } } - .navBarWidth(new BreakpointType({ sm: 321, md: 321, lg: 390 }).getValue(this.currentBreakPoint)) + .navBarWidth(new BreakpointType({ + sm: CommonConstants.NAV_BAR_WIDTH_SM, + md: CommonConstants.NAV_BAR_WIDTH_MD, + lg: CommonConstants.NAV_BAR_WIDTH_LG + }).getValue(this.currentBreakPoint)) .navDestination(this.myRouter) .menus(this.NavigationMenus) .width('100%') - .title({ builder: this.NavigationTitle, height: 162 }) + .title({ builder: this.NavigationTitle, height: $r('app.float.mail_title_height') }) .hideBackButton(true) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/MailSideBar.ets b/multicolumnslibrary/src/main/ets/component/MailSideBar.ets similarity index 60% rename from multicolumnslibrary/src/main/ets/common/MailSideBar.ets rename to multicolumnslibrary/src/main/ets/component/MailSideBar.ets index cb6175f..053b4c1 100644 --- a/multicolumnslibrary/src/main/ets/common/MailSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/MailSideBar.ets @@ -14,13 +14,13 @@ */ import { MailType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from './CommonConstants'; +import { CommonConstants } from '../common/CommonConstants'; @Extend(Text) function textStyle() { .backgroundColor('#254ff7') .fontColor('#fff') - .fontSize(10) + .fontSize($r('sys.float.Caption_M')) .textAlign(TextAlign.Center) } @@ -48,19 +48,19 @@ struct AccountInfo { Column() { Row() { Text($r('app.string.account')) - .fontSize(16) + .fontSize($r('sys.float.Body_L')) .fontColor($r('sys.color.font_primary')) .fontWeight(FontWeight.Medium) Blank() Text($r('app.string.addAccount')) - .fontSize(16) + .fontSize($r('sys.float.Body_L')) .fontColor($r('sys.color.brand')) .fontWeight(FontWeight.Medium) } .width('100%') - .height(48) + .height($r('app.float.item_height_48')) } - .margin({ top: 78 }) + .margin({ top: $r('app.float.mail_account_margin_top') }) } build() { @@ -71,27 +71,28 @@ struct AccountInfo { ListItem() { Row() { Text() - .width(12) - .height(12) - .borderRadius(8) + .width($r('app.float.tag_circle_size')) + .height($r('app.float.tag_circle_size')) + .borderRadius($r('sys.float.corner_radius_level4')) .backgroundColor(index === 0 ? '#61cfbe' : '#fec700') Text(item) - .fontSize(16) + .fontSize($r('sys.float.Body_L')) .fontColor($r('sys.color.font_primary')) - .margin({ left: 13 }) + .margin({ left: $r('sys.float.padding_level6') }) Blank() if (index === 0) { SymbolGlyph($r('sys.symbol.checkmark')) - .fontSize(18) + .fontSize($r('sys.float.Subtitle_L')) .fontColor([$r('sys.color.brand')]) } else { Text('9') - .width(18) - .height(18) - .borderRadius(18) + .width($r('app.float.text_circle_size')) + .height($r('app.float.text_circle_size')) + .borderRadius($r('sys.float.corner_radius_level9')) .textStyle() } - }.width('100%').height(56) + }.width('100%') + .height($r('app.float.item_height')) } }, (item: string) => item.toString()) } @@ -100,8 +101,16 @@ struct AccountInfo { .divider({ strokeWidth: 0.5, color: $r('sys.color.comp_divider') }) } .padding({ - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), - right: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp) + left: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.curBp), + right: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.curBp), }) } } @@ -119,17 +128,17 @@ struct MailStatusList { accountInfo() { Row() { Text($r('app.string.account')) - .fontSize(14) + .fontSize($r('sys.float.Body_M')) .fontColor($r('sys.color.font_tertiary')) Text($r('app.string.addAccount')) - .fontSize(14) + .fontSize($r('sys.float.Body_M')) .fontColor($r('sys.color.brand')) } .backgroundColor(Color.Red) .justifyContent(FlexAlign.SpaceBetween) .width('100%') - .height(48) + .height($r('app.float.item_height_48')) } build() { @@ -142,34 +151,37 @@ struct MailStatusList { ListItem() { Row() { Image(item.src) - .width(24) - .height(24) + .width($r('app.float.button_height_small')) + .height($r('app.float.button_height_small')) Text(item.type) - .fontSize(16) - .margin({ left: 16 }) + .fontSize($r('sys.float.Body_L')) + .margin({ left: $r('sys.float.padding_level8') }) .fontColor(index === 0 ? '#000' : '#e5000000') .fontWeight(FontWeight.Medium) Blank() if (index === this.mailState.length - 1) { - Image($r('app.media.ic_settings_arrow')).width(12).height(24).rotate({ angle: 90 }) + Image($r('app.media.ic_settings_arrow')) + .width($r('app.float.button_height_small')) + .height($r('app.float.button_height_small')) + .rotate({ angle: 90 }) } else { Text(item.num.toString()) - .fontColor('#18181a') - .fontSize(14) + .fontColor($r('app.color.text_color')) + .fontSize($r('sys.float.Body_M')) } }.width('100%') - }.padding({ left: 14, right: 24 }) - .height(56) + }.padding({ left: $r('sys.float.padding_level8'), right: $r('sys.float.padding_level12') }) + .height($r('app.float.item_height')) .backgroundColor(index === 0 ? '#19254ff7' : '') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) }, (item: MailType, index: number) => { return index + JSON.stringify(item); }) } .width('100%') .height('100%') - .padding({ left: 7, right: 7 }) - .margin({ top: 8 }) - .divider({ strokeWidth: 1, startMargin: 12, endMargin: 12 }) + .padding({ left: $r('sys.float.padding_level4'), right: $r('sys.float.padding_level4') }) + .margin({ top: $r('sys.float.padding_level4') }) + .divider({ strokeWidth: 1, startMargin: $r('sys.float.padding_level6'), endMargin: $r('sys.float.padding_level6') }) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets b/multicolumnslibrary/src/main/ets/component/PhotoContent.ets similarity index 73% rename from multicolumnslibrary/src/main/ets/common/PhotoContent.ets rename to multicolumnslibrary/src/main/ets/component/PhotoContent.ets index c615f64..05e83dc 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoContent.ets @@ -15,7 +15,7 @@ import { PhotoType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from './CommonConstants'; +import { CommonConstants } from '../common/CommonConstants'; @Component export struct PhotoContent { @@ -71,32 +71,41 @@ export struct PhotoContent { build() { Column() { Row() { - Text($r('app.string.album')).fontSize(20).fontWeight(FontWeight.Medium) - .margin({ left: this.sideBarStatus ? 0 : 36 + CommonConstants.BACK_SIZE }) + Text($r('app.string.album')) + .fontSize($r('sys.float.Title_S')) + .fontWeight(FontWeight.Medium) + .margin({ left: this.sideBarStatus ? 0 : CommonConstants.ALBUMS_PADDING_LEFT + CommonConstants.BACK_SIZE }) Row() { SymbolGlyph($r('sys.symbol.plus')) - .fontSize(24) + .fontSize($r('sys.float.Title_M')) .fontColor([$r('sys.color.font_primary')]) .margin({ right: $r('sys.float.padding_level4') }) SymbolGlyph($r('sys.symbol.dot_grid_2x2')) - .fontSize(24) + .fontSize($r('sys.float.Title_M')) .fontColor([$r('sys.color.font_primary')]) } } .justifyContent(FlexAlign.SpaceBetween) .padding({ top: this.topRectHeight + CommonConstants.PADDING_CUSTOM }) - .height(56) + .height($r('app.float.item_height')) .width('100%') Grid() { ForEach(this.photoList, (item: PhotoType) => { GridItem() { Column() { - Image(item.src).width('100%').aspectRatio(1).borderRadius(12) + Image(item.src).width('100%').aspectRatio(1).borderRadius($r('sys.float.corner_radius_level6')) Column() { - Text(item.name).margin({ top: 8 }).fontSize(14).fontWeight(FontWeight.Regular) - Text(item.count.toString()).fontSize(12).fontWeight(FontWeight.Regular) - }.width('100%').alignItems(HorizontalAlign.Start).padding({ left: 8, right: 8 }) + Text(item.name) + .margin({ top: $r('sys.float.padding_level4') }) + .fontSize($r('sys.float.Body_M')) + .fontWeight(FontWeight.Regular) + Text(item.count.toString()).fontSize($r('sys.float.Body_S')) + .fontWeight(FontWeight.Regular) + } + .width('100%') + .alignItems(HorizontalAlign.Start) + .padding({ left: $r('sys.float.padding_level4'), right: $r('sys.float.padding_level4') }) } } }, (item: PhotoType, index: number) => { @@ -106,13 +115,21 @@ export struct PhotoContent { .height('85%') .scrollBar(BarState.Off) .columnsTemplate(this.columnsTemplate) - .columnsGap(22) - .rowsGap(17) - .margin({ top: 24 }) + .columnsGap($r('app.float.albums_image_column_gap')) + .rowsGap($r('app.float.albums_image_row_gap')) + .margin({ top: $r('sys.float.padding_level12') }) } .padding({ - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint), - right: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint) + left: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.currentBreakPoint), + right: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.currentBreakPoint) }) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets similarity index 69% rename from multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets rename to multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets index 9d0518d..ef0216f 100644 --- a/multicolumnslibrary/src/main/ets/common/PhotoSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets @@ -15,7 +15,7 @@ import { PhotoType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from './CommonConstants'; +import { CommonConstants } from '../common/CommonConstants'; @Component export struct PhotoSideBar { @@ -45,40 +45,40 @@ export struct PhotoSideBar { ListItem() { Row() { SymbolGlyph($r('sys.symbol.picture_2')) - .fontSize(24) + .fontSize($r('sys.float.Title_M')) .fontColor([$r('sys.color.icon_primary')]) .aspectRatio(1) Text($r('app.string.photo')) .fontColor($r('sys.color.font_primary')) - .fontSize(16) + .fontSize($r('sys.float.Body_L')) .fontWeight(FontWeight.Medium) .opacity(0.9) - .height(48) - .margin({ left: 8 }) + .height($r('app.float.item_height_48')) + .margin({ left: $r('sys.float.padding_level4') }) } - .padding({ left: 8 }).width('100%') + .padding({ left: $r('sys.float.padding_level4') }).width('100%') } ListItem() { Row() { SymbolGlyph($r('sys.symbol.picture_2_fill')) - .fontSize(24) + .fontSize($r('sys.float.Title_M')) .fontColor([$r('sys.color.brand')]) .aspectRatio(1) Text($r('app.string.album')) - .fontSize(16) + .fontSize($r('sys.float.Body_L')) .fontWeight(FontWeight.Medium) .opacity(0.9) - .height(48) - .margin({ left: 8 }) + .height($r('app.float.item_height_48')) + .margin({ left: $r('sys.float.padding_level4') }) .fontColor($r('sys.color.brand')) Blank() SymbolGlyph($r('sys.symbol.checkmark')) .fontColor([$r('sys.color.brand')]) - .fontSize(24) - }.padding({ left: 8, right: 8 }).width('100%') + .fontSize($r('sys.float.Title_M')) + }.padding({ left: $r('sys.float.padding_level4'), right: $r('sys.float.padding_level4') }).width('100%') .backgroundColor('#19254ff7') - .borderRadius(10) + .borderRadius($r('sys.float.corner_radius_level5')) } ForEach(this.photoList, (item: PhotoType, index: number | undefined) => { @@ -86,22 +86,22 @@ export struct PhotoSideBar { Row() { Text(item.name) .fontColor($r('sys.color.font_secondary')) - .fontSize(14) + .fontSize($r('sys.float.Body_M')) .fontWeight(FontWeight.Medium) - .height(48) + .height($r('app.float.item_height_48')) Blank() if (index === this.photoList.length - 1) { SymbolGlyph($r('sys.symbol.lock')) - .fontSize(18) + .fontSize($r('sys.float.Subtitle_L')) .fontColor([$r('sys.color.font_secondary')]) } else { Text(item.count.toString()) - .fontSize(14) + .fontSize($r('sys.float.Body_M')) .fontWeight(FontWeight.Regular) .fontColor($r('sys.color.font_secondary')) } } - .padding({ left: 14, right: 14 }) + .padding({ left: $r('sys.float.corner_radius_level7'), right: $r('sys.float.corner_radius_level7') }) .width('100%') } }, (item: PhotoType, index: number) => { @@ -113,8 +113,16 @@ export struct PhotoSideBar { .width('100%').height('100%') .padding({ top: CommonConstants.BACK_SIZE, - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), - right: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp) + left: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.curBp), + right: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.curBp), }) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/SettingItem.ets b/multicolumnslibrary/src/main/ets/component/SettingItem.ets similarity index 60% rename from multicolumnslibrary/src/main/ets/common/SettingItem.ets rename to multicolumnslibrary/src/main/ets/component/SettingItem.ets index e53a4dc..a8e2f36 100644 --- a/multicolumnslibrary/src/main/ets/common/SettingItem.ets +++ b/multicolumnslibrary/src/main/ets/component/SettingItem.ets @@ -22,38 +22,41 @@ export struct MainItem { build() { Row() { - Image(this.src).width(32).aspectRatio(1) - + Image(this.src) + .width($r('app.float.image_size_32')) + .aspectRatio(1) if (this.isUserItem) { Column() { - Text($r('app.string.userInfo')).fontSize(16).fontWeight(FontWeight.Medium) + Text($r('app.string.userInfo')) + .fontSize($r('sys.float.Body_L')) + .fontWeight(FontWeight.Medium) Text($r('app.string.aboutUserInfo')) - .fontSize(14) + .fontSize($r('sys.float.Body_M')) .fontWeight(FontWeight.Regular) .opacity(0.6) .maxLines(1) .textOverflow({ overflow: TextOverflow.Ellipsis }) - }.alignItems(HorizontalAlign.Start).margin({ left: 12 }).flexShrink(1) + }.alignItems(HorizontalAlign.Start).margin({ left: $r('sys.float.padding_level6') }).flexShrink(1) } else { Text(this.itemDesc) - .fontSize(16) - .lineHeight(22) + .fontSize($r('sys.float.Body_L')) + .lineHeight($r('app.float.line_height_22')) .fontWeight(FontWeight.Medium) .fontFamily('HarmonyHeiTi') .fontColor($r('sys.color.ohos_id_color_text_primary')) .align(Alignment.Start) - .margin({ left: 16 }) + .margin({ left: $r('sys.float.padding_level8') }) } Blank() Image($r('app.media.ic_settings_arrow')) - .width(12) - .height(24) + .width($r('app.float.right_icon_width')) + .height($r('app.float.button_height_small')) .fillColor($r('sys.color.ohos_id_color_fourth')) - .margin({ left: 4 }) - }.padding({ left: 12, right: 12 }) - .height(56) - .borderRadius(20) + .margin({ left: $r('sys.float.padding_level2') }) + }.padding({ left: $r('sys.float.padding_level6'), right: $r('sys.float.padding_level6') }) + .height($r('app.float.item_height')) + .borderRadius($r('sys.float.corner_radius_level10')) .width('100%') } } @@ -72,8 +75,8 @@ export struct SubItem { Row() { Column() { Text(this.itemDesc) - .fontSize(16) - .lineHeight(22) + .fontSize($r('sys.float.Body_L')) + .lineHeight($r('app.float.line_height_22')) .fontWeight(FontWeight.Medium) .fontFamily('HarmonyHeiTi') .fontColor(this.isLinkAddress ? $r('sys.color.brand') : $r('sys.color.font_primary')) @@ -81,8 +84,9 @@ export struct SubItem { if (this.content) { Text(this.content) .fontWeight(FontWeight.Regular) - .fontSize(14) - .fontColor($r('sys.color.font_tertiary')).margin({ top: 1.5 }) + .fontSize($r('sys.float.Body_M')) + .fontColor($r('sys.color.font_tertiary')) + .margin({ top: $r('sys.float.padding_level1') }) } }.alignItems(HorizontalAlign.Start) @@ -91,30 +95,32 @@ export struct SubItem { if (this.isShowButton) { Toggle({ type: ToggleType.Switch, isOn: true }) .id('ToggleSwitch') - .width(36) - .height(20) + .width($r('app.float.setting_toggle_width')) + .height($r('app.float.setting_toggle_height')) .selectedColor($r('sys.color.brand')) } else if (this.isShowRightArrow) { if (this.itemStatusDesc) { - Text(this.itemStatusDesc).fontWeight(FontWeight.Regular).fontSize(14) + Text(this.itemStatusDesc) + .fontWeight(FontWeight.Regular) + .fontSize($r('sys.float.Body_M')) } Image($r('app.media.ic_settings_arrow')) - .width(12) - .height(24) + .width($r('app.float.right_icon_width')) + .height($r('app.float.button_height_small')) .fillColor($r('sys.color.ohos_id_color_fourth')) .margin({ - left: 4 + left: $r('sys.float.padding_level2') }) } else { Image(this.src) - .width(24) - .height(24) + .width($r('app.float.button_height_small')) + .height($r('app.float.button_height_small')) .fillColor($r('sys.color.ohos_id_color_primary')) } } - .height(56) - .borderRadius(20) + .height($r('app.float.item_height')) + .borderRadius($r('sys.float.corner_radius_level10')) .width('100%') - .padding({ left: 12, right: 12 }) + .padding({ left: $r('sys.float.padding_level6'), right: $r('sys.float.padding_level6') }) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/common/WlanItem.ets b/multicolumnslibrary/src/main/ets/component/WlanItem.ets similarity index 70% rename from multicolumnslibrary/src/main/ets/common/WlanItem.ets rename to multicolumnslibrary/src/main/ets/component/WlanItem.ets index d594eb5..33f1da4 100644 --- a/multicolumnslibrary/src/main/ets/common/WlanItem.ets +++ b/multicolumnslibrary/src/main/ets/component/WlanItem.ets @@ -14,8 +14,7 @@ */ import { SubItem } from './SettingItem'; -import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from './CommonConstants'; +import { CommonConstants } from '../common/CommonConstants'; @Component export struct WlanItem { @@ -30,7 +29,7 @@ export struct WlanItem { Divider() .strokeWidth('1px') .color($r('sys.color.ohos_id_color_list_separator')) - .margin({ left: 8, right: 8 }) + .margin({ left: $r('sys.float.padding_level4'), right: $r('sys.float.padding_level4') }) } build() { @@ -42,31 +41,31 @@ export struct WlanItem { .fontColor([$r('sys.color.icon_primary')]) .fontSize($r('sys.float.Title_M')) } - .height(40) + .height($r('app.float.button_height')) .aspectRatio(1) .backgroundColor($r('sys.color.comp_background_tertiary')) .onClick(() => { - this.pageStack.pop() + this.pageStack.pop(); }) } Text('WLAN') .margin({ left: $r('sys.float.padding_level4') }) - .font({ size: 20, weight: 700 }) + .font({ size: $r('sys.float.Title_S'), weight: FontWeight.Bold }) .fontColor($r('sys.color.font_primary')) } .width('100%') - .height(56) + .height($r('app.float.item_height')) .zIndex(2) - List({ space: 20 }) { + List({ space: CommonConstants.LIST_SPACE }) { ListItem() { SubItem({ itemDesc: $r('app.string.WLAN'), isShowButton: true }) } .width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) - .margin({ top: 16 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) + .margin({ top: $r('sys.float.padding_level8') }) ListItem() { SubItem({ @@ -75,35 +74,35 @@ export struct WlanItem { itemStatusDesc: this.netWorkStatus }) }.width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) ListItem() { SubItem({ itemDesc: $r('app.string.moreWLANSettings'), isShowRightArrow: true }) }.width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) ListItem() { Column() { Text($r('app.string.wlanConnected')) - .fontSize(12) + .fontSize($r('sys.float.Body_S')) .fontColor($r('sys.color.font_secondary')) .width('100%') - .padding({ left: 12 }) + .padding({ left: $r('sys.float.padding_level6') }) SubItem({ itemDesc: $r('app.string.wifiName'), content: $r('app.string.connected'), src: $r('app.media.wlan2'), isLinkAddress: true }) - .margin({ top: 8 }) + .margin({ top: $r('sys.float.padding_level4') }) .width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) } } @@ -111,10 +110,10 @@ export struct WlanItem { Column() { Row() { Text($r('app.string.wlanUseful')) - .fontSize(14) + .fontSize($r('sys.float.Body_M')) .fontColor($r('sys.color.font_secondary')) .width('100%') - .padding({ left: 12 }) + .padding({ left: $r('sys.float.padding_level6') }) } Column() { @@ -137,10 +136,10 @@ export struct WlanItem { }) } .width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) - .margin({ top: 8 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) + .margin({ top: $r('sys.float.padding_level4') }) } } @@ -148,9 +147,9 @@ export struct WlanItem { SubItem({ itemDesc: $r('app.string.addNetWork'), isLinkAddress: true }) } .width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) .margin({ bottom: this.bottomRectHeight }) } @@ -159,11 +158,11 @@ export struct WlanItem { .height('92%') } .padding({ - left: new BreakpointType({ sm: 16, md: 16, lg: 16 }).getValue(this.currentBreakPoint), - right: new BreakpointType({ sm: 16, md: 16, lg: 16 }).getValue(this.currentBreakPoint), + left: $r('sys.float.padding_level8'), + right: $r('sys.float.padding_level8'), }) .hideTitleBar(true) - .title('WLAN') + .title($r('app.string.WLAN')) .hideTitleBar(true) .backgroundColor($r('sys.color.background_secondary')) } diff --git a/multicolumnslibrary/src/main/ets/component/MailBoxComponent.ets b/multicolumnslibrary/src/main/ets/view/MailBoxView.ets similarity index 73% rename from multicolumnslibrary/src/main/ets/component/MailBoxComponent.ets rename to multicolumnslibrary/src/main/ets/view/MailBoxView.ets index 3c4b100..babc3fc 100644 --- a/multicolumnslibrary/src/main/ets/component/MailBoxComponent.ets +++ b/multicolumnslibrary/src/main/ets/view/MailBoxView.ets @@ -14,17 +14,17 @@ */ import { BreakpointType } from '../utils/BreakpointSystem'; -import { MailNavigation } from '../common/MailNavigation'; -import { MailSideBar } from '../common/MailSideBar'; +import { MailNavigation } from '../component/MailNavigation'; +import { MailSideBar } from '../component/MailSideBar'; import { CommonConstants } from '../common/CommonConstants'; @Builder export function MailBoxBuilder() { - MailBoxComponent(); + MailBoxView(); } @Component -export struct MailBoxComponent { +export struct MailBoxView { @State isFold: boolean = false; @State sideBarWidth: number = 304; @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; @@ -40,7 +40,7 @@ export struct MailBoxComponent { build() { NavDestination() { GridRow() { - GridCol({ span: { sm: 12, md: 12, lg: 12 } }) { + GridCol({ span: CommonConstants.GRID_SPACE }) { Stack({ alignContent: Alignment.TopStart }) { SideBarContainer(SideBarContainerType.AUTO) { // Area A @@ -68,17 +68,18 @@ export struct MailBoxComponent { } .divider({ color: $r('sys.color.comp_divider'), strokeWidth: 0 }) .sideBarWidth(this.sideBarWidth) - .minSideBarWidth(240) - .minContentWidth(this.currentBreakPoint === 'sm' ? '100%' : 600) + .minSideBarWidth(CommonConstants.SIDE_BAR_WIDTH_MIN) + .minContentWidth(this.currentBreakPoint === 'sm' ? '100%' : CommonConstants.SIDE_BAR_WIDTH_CONTENT_MIN) .controlButton({ left: new BreakpointType({ - sm: 16 + CommonConstants.BACK_SIZE, - md: 24 + CommonConstants.BACK_SIZE, - lg: 32 + CommonConstants.BACK_SIZE, + sm: CommonConstants.PADDING_16 + CommonConstants.BACK_SIZE, + md: CommonConstants.PADDING_24 + CommonConstants.BACK_SIZE, + lg: CommonConstants.PADDING_32 + CommonConstants.BACK_SIZE, }).getValue(this.currentBreakPoint), - top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, - width: 24, - height: 24 + top: this.topRectHeight === 0 ? CommonConstants.PADDING_16 : + this.topRectHeight + CommonConstants.PADDING_CUSTOM, + width: CommonConstants.IMAGE_SIZE_SMALL, + height: CommonConstants.IMAGE_SIZE_SMALL }) .showSideBar(this.isShowMailSideBar) .onChange((value: boolean) => { @@ -92,11 +93,16 @@ export struct MailBoxComponent { .fontSize($r('sys.float.Title_M')) } .margin({ - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.currentBreakPoint), - top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM + left: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.currentBreakPoint), + top: this.topRectHeight === 0 ? CommonConstants.PADDING_16 : + this.topRectHeight + CommonConstants.PADDING_CUSTOM }) .backgroundColor(Color.Transparent) - .height(24) + .height($r('app.float.button_height_small')) .aspectRatio(1) .onClick(() => { this.pageStack.pop(); @@ -104,9 +110,6 @@ export struct MailBoxComponent { } } } - .onBreakpointChange((breakpoint: string) => { - this.currentBreakPoint = breakpoint; - }) } .hideTitleBar(true) .onReady((context: NavDestinationContext) => { diff --git a/multicolumnslibrary/src/main/ets/component/MultiColumnsComponent.ets b/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets similarity index 98% rename from multicolumnslibrary/src/main/ets/component/MultiColumnsComponent.ets rename to multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets index e759494..8997896 100644 --- a/multicolumnslibrary/src/main/ets/component/MultiColumnsComponent.ets +++ b/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets @@ -18,7 +18,7 @@ import { BusinessError } from '@kit.BasicServicesKit'; import { CommonConstants, Route } from '../common/CommonConstants'; @Component -export struct MultiColumnsComponent { +export struct MultiColumnsView { @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; diff --git a/multicolumnslibrary/src/main/ets/component/PhotoAlbumComponent.ets b/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets similarity index 71% rename from multicolumnslibrary/src/main/ets/component/PhotoAlbumComponent.ets rename to multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets index 081e4f5..529a644 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoAlbumComponent.ets +++ b/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets @@ -15,16 +15,16 @@ import { BreakpointType } from '../utils/BreakpointSystem'; import { CommonConstants } from '../common/CommonConstants'; -import { PhotoContent } from '../common/PhotoContent'; -import { PhotoSideBar } from '../common/PhotoSideBar'; +import { PhotoContent } from '../component/PhotoContent'; +import { PhotoSideBar } from '../component/PhotoSideBar'; @Builder export function PhotoAlbumBuilder() { - PhotoAlbumComponent(); + PhotoAlbumView(); } @Component -export struct PhotoAlbumComponent { +export struct PhotoAlbumView { @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; @State sideBarStatus: boolean = this.curBp !== CommonConstants.BREAK_POINT_SM; @@ -33,7 +33,7 @@ export struct PhotoAlbumComponent { build() { NavDestination() { GridRow() { - GridCol({ span: { sm: 12, md: 12, lg: 12 } }) { + GridCol({ span: CommonConstants.GRID_SPACE }) { Stack({ alignContent: Alignment.TopStart }) { SideBarContainer(SideBarContainerType.AUTO) { Column() { @@ -48,10 +48,11 @@ export struct PhotoAlbumComponent { } .divider({ strokeWidth: 0.5, color: $r('sys.color.comp_divider') }) .controlButton({ - left: 16 + CommonConstants.BACK_SIZE, - top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, - width: 24, - height: 24 + left: CommonConstants.PADDING_16 + CommonConstants.BACK_SIZE, + top: this.topRectHeight === 0 ? CommonConstants.PADDING_16 : + this.topRectHeight + CommonConstants.PADDING_CUSTOM, + width: CommonConstants.IMAGE_SIZE_SMALL, + height: CommonConstants.IMAGE_SIZE_SMALL }) .showSideBar(this.curBp !== CommonConstants.BREAK_POINT_SM) .onChange((value: boolean) => { @@ -64,11 +65,16 @@ export struct PhotoAlbumComponent { .fontSize($r('sys.float.Title_M')) } .margin({ - left: new BreakpointType({ sm: 16, md: 24, lg: 32 }).getValue(this.curBp), - top: this.topRectHeight === 0 ? 16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, + left: new BreakpointType({ + sm: $r('sys.float.padding_level8'), + md: $r('sys.float.padding_level12'), + lg: $r('sys.float.padding_level16') + }).getValue(this.curBp), + top: this.topRectHeight === 0 ? $r('sys.float.padding_level8') : + this.topRectHeight + CommonConstants.PADDING_CUSTOM, }) .backgroundColor(Color.Transparent) - .height(24) + .height($r('app.float.button_height_small')) .aspectRatio(1) .onClick(() => { this.pageStack.pop(); @@ -76,9 +82,6 @@ export struct PhotoAlbumComponent { } } } - .onBreakpointChange((breakpoint: string) => { - this.curBp = breakpoint; - }) } .hideTitleBar(true) .onReady((context: NavDestinationContext) => { diff --git a/multicolumnslibrary/src/main/ets/component/SettingsComponent.ets b/multicolumnslibrary/src/main/ets/view/SettingsView.ets similarity index 79% rename from multicolumnslibrary/src/main/ets/component/SettingsComponent.ets rename to multicolumnslibrary/src/main/ets/view/SettingsView.ets index 4a5da2b..3c2c8ef 100644 --- a/multicolumnslibrary/src/main/ets/component/SettingsComponent.ets +++ b/multicolumnslibrary/src/main/ets/view/SettingsView.ets @@ -13,18 +13,17 @@ * limitations under the License. */ -import { BreakpointType } from '../utils/BreakpointSystem'; -import { MainItem } from '../common/SettingItem'; -import { WlanItem } from '../common/WlanItem'; +import { MainItem } from '../component/SettingItem'; +import { WlanItem } from '../component/WlanItem'; import { CommonConstants } from '../common/CommonConstants'; @Builder export function SettingsBuilder() { - SettingsComponent(); + SettingsView(); } @Component -export struct SettingsComponent { +export struct SettingsView { @State pathInfo: NavPathStack = new NavPathStack(); @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; @@ -40,7 +39,7 @@ export struct SettingsComponent { Divider() .strokeWidth(0.5) .color($r('sys.color.ohos_id_color_list_separator')) - .margin({ left: 8, right: 8 }) + .margin({ left: $r('sys.float.padding_level4'), right: $r('sys.float.padding_level4') }) } aboutToAppear() { @@ -50,21 +49,21 @@ export struct SettingsComponent { build() { NavDestination() { GridRow() { - GridCol({ span: { sm: 12, md: 12, lg: 12 } }) { + GridCol({ span: CommonConstants.GRID_SPACE }) { Navigation(this.pathInfo) { - List({ space: 12 }) { + List({ space: CommonConstants.GRID_SPACE }) { ListItem() { Search({ placeholder: $r('app.string.search') }) .backgroundColor($r('sys.color.comp_background_primary')) - .margin({ top: 16 }) + .margin({ top: $r('sys.float.padding_level8') }) } .width('100%') ListItem() { MainItem({ isUserItem: true, src: $r('app.media.ic_mine_normal') }) .backgroundColor($r('sys.color.comp_background_primary')) - .borderRadius(16) - .padding({ top: 12, bottom: 12 }) + .borderRadius($r('sys.float.corner_radius_level8')) + .padding({ top: $r('sys.float.padding_level6'), bottom: $r('sys.float.padding_level6') }) } ListItem() { @@ -88,9 +87,9 @@ export struct SettingsComponent { src: $r('app.media.ic_settings_more_connections') }) }.width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) } ListItem() { @@ -102,9 +101,9 @@ export struct SettingsComponent { src: $r('app.media.displayAndBrightness') }) }.width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) } ListItem() { @@ -119,9 +118,9 @@ export struct SettingsComponent { this.CustomDivider() MainItem({ itemDesc: $r('app.string.privacy'), src: $r('app.media.privacy') }) }.width('100%') - .borderRadius(24) + .borderRadius($r('sys.float.corner_radius_level12')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding({ top: 4, bottom: 4 }) + .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) } ListItem() { @@ -132,9 +131,9 @@ export struct SettingsComponent { this.CustomDivider() MainItem({ itemDesc: $r('app.string.aboutDevice'), src: $r('app.media.aboutDevice') }) }.width('100%') - .borderRadius(16) + .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) - .padding(4) + .padding($r('sys.float.padding_level2')) } .margin({ bottom: this.bottomRectHeight === 0 ? CommonConstants.PADDING_BOTTOM_INDEX : this.bottomRectHeight @@ -144,11 +143,11 @@ export struct SettingsComponent { .width('100%') .height('100%') .padding({ - left: new BreakpointType({ sm: 16, md: 16, lg: 16 }).getValue(this.currentBreakPoint), - right: new BreakpointType({ sm: 16, md: 16, lg: 16 }).getValue(this.currentBreakPoint) + left: $r('sys.float.padding_level8'), + right: $r('sys.float.padding_level8') }) } - .navBarWidth(293) + .navBarWidth($r('app.float.setting_navBar_width')) .title($r('app.string.settings')) .titleMode(NavigationTitleMode.Mini) .backgroundColor($r('sys.color.background_secondary')) @@ -159,9 +158,6 @@ export struct SettingsComponent { } .borderWidth({ right: 0.5 }) .borderColor({ right: $r('sys.color.comp_divider') }) - .onBreakpointChange((breakpoint: string) => { - this.currentBreakPoint = breakpoint; - }) } .hideTitleBar(true) .padding({ diff --git a/multicolumnslibrary/src/main/resources/base/element/color.json b/multicolumnslibrary/src/main/resources/base/element/color.json index a8b9ce6..433d659 100644 --- a/multicolumnslibrary/src/main/resources/base/element/color.json +++ b/multicolumnslibrary/src/main/resources/base/element/color.json @@ -7,6 +7,10 @@ { "name": "detail_background", "value": "#33000000" + }, + { + "name": "text_color", + "value": "#18181a" } ] } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/resources/base/element/float.json b/multicolumnslibrary/src/main/resources/base/element/float.json index 6d2c7b4..38a147f 100644 --- a/multicolumnslibrary/src/main/resources/base/element/float.json +++ b/multicolumnslibrary/src/main/resources/base/element/float.json @@ -7,6 +7,98 @@ { "name": "button_height", "value": "40vp" + }, + { + "name": "button_height_small", + "value": "24vp" + }, + { + "name": "image_size", + "value": "24vp" + }, + { + "name": "image_size_32", + "value": "32vp" + }, + { + "name": "image_size_48", + "value": "48vp" + }, + { + "name": "right_icon_width", + "value": "12vp" + }, + { + "name": "tag_circle_size", + "value": "12vp" + }, + { + "name": "text_circle_size", + "value": "18vp" + }, + { + "name": "setting_toggle_width", + "value": "36vp" + }, + { + "name": "setting_toggle_height", + "value": "20vp" + }, + { + "name": "item_height", + "value": "56vp" + }, + { + "name": "item_height_48", + "value": "48vp" + }, + { + "name": "mail_account_margin_top", + "value": "78vp" + }, + { + "name": "mail_mail_height", + "value": "96vp" + }, + { + "name": "mail_title_height", + "value": "162vp" + }, + { + "name": "content_image_height", + "value": "166vp" + }, + { + "name": "albums_image_column_gap", + "value": "22vp" + }, + { + "name": "albums_image_row_gap", + "value": "17vp" + }, + { + "name": "setting_navBar_width", + "value": "293vp" + }, + { + "name": "line_height_12", + "value": "12fp" + }, + { + "name": "line_height_19", + "value": "19fp" + }, + { + "name": "line_height_22", + "value": "22fp" + }, + { + "name": "line_height_23", + "value": "23fp" + }, + { + "name": "line_height_25", + "value": "25fp" } ] } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/resources/base/element/string.json b/multicolumnslibrary/src/main/resources/base/element/string.json index cc78618..798f767 100644 --- a/multicolumnslibrary/src/main/resources/base/element/string.json +++ b/multicolumnslibrary/src/main/resources/base/element/string.json @@ -1,17 +1,5 @@ { "string": [ - { - "name": "module_desc", - "value": "module description" - }, - { - "name": "EntryAbility_desc", - "value": "description" - }, - { - "name": "EntryAbility_label", - "value": "MultiColumns" - }, { "name": "account", "value": "Account" diff --git a/multicolumnslibrary/src/main/resources/base/profile/route_map.json b/multicolumnslibrary/src/main/resources/base/profile/route_map.json index 883c791..0ff59e9 100644 --- a/multicolumnslibrary/src/main/resources/base/profile/route_map.json +++ b/multicolumnslibrary/src/main/resources/base/profile/route_map.json @@ -2,7 +2,7 @@ "routerMap": [ { "name": "MailBox", - "pageSourceFile": "src/main/ets/component/MailBoxComponent.ets", + "pageSourceFile": "src/main/ets/view/MailBoxView.ets", "buildFunction": "MailBoxBuilder", "data": { "description": "this is MailBox" @@ -10,7 +10,7 @@ }, { "name": "PhotoAlbum", - "pageSourceFile": "src/main/ets/component/PhotoAlbumComponent.ets", + "pageSourceFile": "src/main/ets/view/PhotoAlbumView.ets", "buildFunction": "PhotoAlbumBuilder", "data": { "description": "this is PhotoAlbum" @@ -18,7 +18,7 @@ }, { "name": "Settings", - "pageSourceFile": "src/main/ets/component/SettingsComponent.ets", + "pageSourceFile": "src/main/ets/view/SettingsView.ets", "buildFunction": "SettingsBuilder", "data": { "description": "this is Settings" diff --git a/multicolumnslibrary/src/main/resources/en_US/element/string.json b/multicolumnslibrary/src/main/resources/en_US/element/string.json index cc78618..798f767 100644 --- a/multicolumnslibrary/src/main/resources/en_US/element/string.json +++ b/multicolumnslibrary/src/main/resources/en_US/element/string.json @@ -1,17 +1,5 @@ { "string": [ - { - "name": "module_desc", - "value": "module description" - }, - { - "name": "EntryAbility_desc", - "value": "description" - }, - { - "name": "EntryAbility_label", - "value": "MultiColumns" - }, { "name": "account", "value": "Account" diff --git a/multicolumnslibrary/src/main/resources/zh_CN/element/string.json b/multicolumnslibrary/src/main/resources/zh_CN/element/string.json index 8cfea63..50e74fd 100644 --- a/multicolumnslibrary/src/main/resources/zh_CN/element/string.json +++ b/multicolumnslibrary/src/main/resources/zh_CN/element/string.json @@ -1,17 +1,5 @@ { "string": [ - { - "name": "module_desc", - "value": "模块描述" - }, - { - "name": "EntryAbility_desc", - "value": "description" - }, - { - "name": "EntryAbility_label", - "value": "MultiColumns" - }, { "name": "account", "value": "账户" diff --git a/multicolumnssample/src/main/ets/pages/Index.ets b/multicolumnssample/src/main/ets/pages/Index.ets index caf669c..69c3d6a 100644 --- a/multicolumnssample/src/main/ets/pages/Index.ets +++ b/multicolumnssample/src/main/ets/pages/Index.ets @@ -13,14 +13,14 @@ * limitations under the License. */ -import { MultiColumnsComponent } from '@ohos_samples/multicolumnslibrary'; +import { MultiColumnsView } from '@ohos_samples/multicolumnslibrary'; @Entry @Component struct Index { build() { Stack() { - MultiColumnsComponent() + MultiColumnsView() } } } \ No newline at end of file diff --git a/multicolumnssample/src/main/resources/base/element/color.json b/multicolumnssample/src/main/resources/base/element/color.json new file mode 100644 index 0000000..3c71296 --- /dev/null +++ b/multicolumnssample/src/main/resources/base/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#FFFFFF" + } + ] +} \ No newline at end of file diff --git a/multicolumnssample/src/main/resources/base/element/string.json b/multicolumnssample/src/main/resources/base/element/string.json new file mode 100644 index 0000000..b32df04 --- /dev/null +++ b/multicolumnssample/src/main/resources/base/element/string.json @@ -0,0 +1,16 @@ +{ + "string": [ + { + "name": "module_desc", + "value": "module description" + }, + { + "name": "EntryAbility_desc", + "value": "description" + }, + { + "name": "EntryAbility_label", + "value": "MultiColumns" + } + ] +} \ No newline at end of file diff --git a/multicolumnslibrary/src/main/resources/base/media/background.png b/multicolumnssample/src/main/resources/base/media/background.png similarity index 100% rename from multicolumnslibrary/src/main/resources/base/media/background.png rename to multicolumnssample/src/main/resources/base/media/background.png diff --git a/multicolumnslibrary/src/main/resources/base/media/foreground.png b/multicolumnssample/src/main/resources/base/media/foreground.png similarity index 100% rename from multicolumnslibrary/src/main/resources/base/media/foreground.png rename to multicolumnssample/src/main/resources/base/media/foreground.png diff --git a/multicolumnslibrary/src/main/resources/base/media/layered_image.json b/multicolumnssample/src/main/resources/base/media/layered_image.json similarity index 100% rename from multicolumnslibrary/src/main/resources/base/media/layered_image.json rename to multicolumnssample/src/main/resources/base/media/layered_image.json diff --git a/multicolumnssample/src/main/resources/base/media/startIcon.png b/multicolumnssample/src/main/resources/base/media/startIcon.png new file mode 100644 index 0000000000000000000000000000000000000000..ce307a8827bd75456441ceb57d530e4c8d45d36c GIT binary patch literal 6790 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 Date: Fri, 11 Jul 2025 17:56:05 +0800 Subject: [PATCH 12/15] =?UTF-8?q?=E8=A7=84=E8=8C=83=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/main/ets/component/MailContent.ets | 6 +++--- .../src/main/ets/component/MailNavigation.ets | 13 ++++++------- .../src/main/ets/component/PhotoSideBar.ets | 3 ++- .../src/main/ets/component/WlanItem.ets | 2 +- .../src/main/resources/base/element/float.json | 8 ++++++++ .../src/main/resources/base/element/string.json | 16 ++++++++++++++++ .../src/main/resources/en_US/element/string.json | 16 ++++++++++++++++ .../src/main/resources/zh_CN/element/string.json | 16 ++++++++++++++++ 8 files changed, 68 insertions(+), 12 deletions(-) diff --git a/multicolumnslibrary/src/main/ets/component/MailContent.ets b/multicolumnslibrary/src/main/ets/component/MailContent.ets index 9a042ae..78bdb7f 100644 --- a/multicolumnslibrary/src/main/ets/component/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/component/MailContent.ets @@ -34,7 +34,7 @@ export struct MailContent { NavDestination() { Column() { Column() { - Text('HHHxx UXD') + Text($r('app.string.mailDetailTitle')) .fontSize($r('sys.float.Title_M')) .margin({ left: this.curBp === 'sm' ? CommonConstants.PADDING_32 + CommonConstants.BACK_SIZE : 0 }) .fontWeight(FontWeight.Medium) @@ -58,11 +58,11 @@ export struct MailContent { .width('100%') .height($r('app.float.item_height_48')) - Text('PostMaster') + Text($r('app.string.postMaster')) .fontSize($r('sys.float.Title_S')) .fontColor($r('sys.color.font_primary')) .lineHeight($r('app.float.line_height_23')) - Text('09:42') + Text($r('app.string.postTime')) .margin({ top: $r('sys.float.padding_level1') }) .fontColor($r('sys.color.font_tertiary')) diff --git a/multicolumnslibrary/src/main/ets/component/MailNavigation.ets b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets index a54e04e..1bc8b82 100644 --- a/multicolumnslibrary/src/main/ets/component/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets @@ -54,16 +54,16 @@ export struct MailNavigation { .fontColor($r('sys.color.font_primary')) .fontSize($r('sys.float.Title_L')) .fontWeight(FontWeight.Medium) - Text('xxxxxxxxxxxxx') + Text($r('app.string.inboxSubtitle')) .fontColor($r('sys.color.font_tertiary')) .fontSize($r('sys.float.Subtitle_S')) .margin({ top: $r('sys.float.padding_level2'), left: $r('sys.float.padding_level1') }) } .alignItems(HorizontalAlign.Start) - .height(140) + .height($r('app.float.mail_inbox_height')) .width('100%') .padding({ - top: 80, + top: $r('app.float.mail_inbox_margin_top'), left: new BreakpointType({ sm: $r('sys.float.padding_level8'), md: $r('sys.float.padding_level12'), @@ -94,7 +94,7 @@ export struct MailNavigation { Text($r('app.string.nonSense')) .fontSize($r('sys.float.Body_L')) .lineHeight($r('app.float.line_height_22')) - .fontColor($r('app.color.text_color')) + .fontColor($r('sys.color.font_primary')) Blank() Text('4/12') .fontSize($r('sys.float.Body_S')) @@ -105,11 +105,10 @@ export struct MailNavigation { Text($r('app.string.textPartOne')) .lineHeight($r('app.float.line_height_19')) .fontSize($r('sys.float.Body_M')) - .fontColor($r('app.color.text_color')) + .fontColor($r('sys.color.font_primary')) Text($r('app.string.textPartTwo')) .fontSize($r('sys.float.Body_M')) - .fontColor($r('app.color.text_color')) - .opacity(0.6) + .fontColor($r('sys.color.font_tertiary')) .lineHeight($r('app.float.line_height_19')) } .width('100%') diff --git a/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets index ef0216f..2a29c4b 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets @@ -56,7 +56,8 @@ export struct PhotoSideBar { .height($r('app.float.item_height_48')) .margin({ left: $r('sys.float.padding_level4') }) } - .padding({ left: $r('sys.float.padding_level4') }).width('100%') + .width('100%') + .padding({ left: $r('sys.float.padding_level4') }) } ListItem() { diff --git a/multicolumnslibrary/src/main/ets/component/WlanItem.ets b/multicolumnslibrary/src/main/ets/component/WlanItem.ets index 33f1da4..bf46a26 100644 --- a/multicolumnslibrary/src/main/ets/component/WlanItem.ets +++ b/multicolumnslibrary/src/main/ets/component/WlanItem.ets @@ -48,7 +48,7 @@ export struct WlanItem { this.pageStack.pop(); }) } - Text('WLAN') + Text($r('app.string.WLAN')) .margin({ left: $r('sys.float.padding_level4') }) .font({ size: $r('sys.float.Title_S'), weight: FontWeight.Bold }) .fontColor($r('sys.color.font_primary')) diff --git a/multicolumnslibrary/src/main/resources/base/element/float.json b/multicolumnslibrary/src/main/resources/base/element/float.json index 38a147f..506c8e9 100644 --- a/multicolumnslibrary/src/main/resources/base/element/float.json +++ b/multicolumnslibrary/src/main/resources/base/element/float.json @@ -56,6 +56,14 @@ "name": "mail_account_margin_top", "value": "78vp" }, + { + "name": "mail_inbox_height", + "value": "140vp" + }, + { + "name": "mail_inbox_margin_top", + "value": "80vp" + }, { "name": "mail_mail_height", "value": "96vp" diff --git a/multicolumnslibrary/src/main/resources/base/element/string.json b/multicolumnslibrary/src/main/resources/base/element/string.json index 798f767..6a7c9bc 100644 --- a/multicolumnslibrary/src/main/resources/base/element/string.json +++ b/multicolumnslibrary/src/main/resources/base/element/string.json @@ -20,6 +20,22 @@ "name": "recvBox", "value": "Inbox" }, + { + "name": "inboxSubtitle", + "value": "xxxxxxxxxxxxx" + }, + { + "name": "mailDetailTitle", + "value": "HHHxx UXD" + }, + { + "name": "postMaster", + "value": "PostMaster" + }, + { + "name": "postTime", + "value": "09:42" + }, { "name": "album", "value": "Albums" diff --git a/multicolumnslibrary/src/main/resources/en_US/element/string.json b/multicolumnslibrary/src/main/resources/en_US/element/string.json index 798f767..f94236c 100644 --- a/multicolumnslibrary/src/main/resources/en_US/element/string.json +++ b/multicolumnslibrary/src/main/resources/en_US/element/string.json @@ -12,6 +12,22 @@ "name": "recUser", "value": "Recipient：" }, + { + "name": "inboxSubtitle", + "value": "xxxxxxxxxxxxx" + }, + { + "name": "mailDetailTitle", + "value": "HHHxx UXD" + }, + { + "name": "postMaster", + "value": "PostMaster" + }, + { + "name": "postTime", + "value": "09:42" + }, { "name": "nonSense", "value": "xxxx" diff --git a/multicolumnslibrary/src/main/resources/zh_CN/element/string.json b/multicolumnslibrary/src/main/resources/zh_CN/element/string.json index 50e74fd..885c08a 100644 --- a/multicolumnslibrary/src/main/resources/zh_CN/element/string.json +++ b/multicolumnslibrary/src/main/resources/zh_CN/element/string.json @@ -20,6 +20,22 @@ "name": "recvBox", "value": "收件箱" }, + { + "name": "inboxSubtitle", + "value": "xxxxxxxxxxxxx" + }, + { + "name": "mailDetailTitle", + "value": "HHHxx UXD" + }, + { + "name": "postMaster", + "value": "PostMaster" + }, + { + "name": "postTime", + "value": "09:42" + }, { "name": "album", "value": "相册" -- Gitee From 9ccdc7046e850be788c812cbf9b8a7d3e080c66c Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Mon, 14 Jul 2025 15:10:15 +0800 Subject: [PATCH 13/15] =?UTF-8?q?=E5=91=BD=E5=90=8D=E5=8F=8A=E8=A7=84?= =?UTF-8?q?=E8=8C=83=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnslibrary/README.md | 2 +- .../{CommonConstants.ets => Constants.ets} | 12 ++++---- .../src/main/ets/component/MailContent.ets | 14 ++++----- .../src/main/ets/component/MailNavigation.ets | 24 ++++++++------- .../src/main/ets/component/MailSideBar.ets | 10 +++---- .../src/main/ets/component/PhotoContent.ets | 10 +++---- .../src/main/ets/component/PhotoSideBar.ets | 10 +++---- .../src/main/ets/component/WlanItem.ets | 14 ++++----- .../src/main/ets/utils/BreakpointSystem.ets | 6 ++-- .../src/main/ets/utils/WindowUtils.ets | 12 ++++---- .../src/main/ets/view/MailBoxView.ets | 30 +++++++++---------- .../src/main/ets/view/MultiColumnsView.ets | 22 +++++++------- .../src/main/ets/view/PhotoAlbumView.ets | 26 ++++++++-------- .../src/main/ets/view/SettingsView.ets | 26 ++++++++-------- .../main/resources/base/element/color.json | 12 ++++++++ 15 files changed, 122 insertions(+), 108 deletions(-) rename multicolumnslibrary/src/main/ets/common/{CommonConstants.ets => Constants.ets} (84%) diff --git a/multicolumnslibrary/README.md b/multicolumnslibrary/README.md index 3e79d3e..e94a006 100644 --- a/multicolumnslibrary/README.md +++ b/multicolumnslibrary/README.md @@ -35,7 +35,7 @@ import { MultiColumnsView, MultiColumnController } from '@ohos_samples/multicolu ``` 按需在文件中使用导出模块即可，其MultiColumnsView是整个sample的入口页面组件。MultiColumnController初始化了沉浸式、设备断点判断、避让区域计算等窗口能力。示例如下： ``` -// Page.ets +// Index.ets import { MultiColumnsView } from '@ohos_samples/multicolumnslibrary'; Stack() { MultiColumnsView() diff --git a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets b/multicolumnslibrary/src/main/ets/common/Constants.ets similarity index 84% rename from multicolumnslibrary/src/main/ets/common/CommonConstants.ets rename to multicolumnslibrary/src/main/ets/common/Constants.ets index 67090a5..2e7bdd5 100644 --- a/multicolumnslibrary/src/main/ets/common/CommonConstants.ets +++ b/multicolumnslibrary/src/main/ets/common/Constants.ets @@ -16,7 +16,7 @@ /** * Common constants for all features. */ -export class CommonConstants { +export class Constants { /** * BACK Button size. */ @@ -97,11 +97,11 @@ export class CommonConstants { * AppStorage key */ public static readonly KEY_PREFIX_COLUMNS: string = 'multiColumns'; - public static readonly KEY_BREAKPOINT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'BreakPoint'; - public static readonly KEY_TOP_RECT_HEIGHT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'StatusBarHeight'; - public static readonly KEY_BOTTOM_RECT_HEIGHT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'NavIndicatorHeight'; - public static readonly KEY_PATH_STACK: string = CommonConstants.KEY_PREFIX_COLUMNS + 'PathStack'; - public static readonly KEY_UI_CONTEXT: string = CommonConstants.KEY_PREFIX_COLUMNS + 'UIContext'; + public static readonly KEY_BREAKPOINT: string = Constants.KEY_PREFIX_COLUMNS + 'BreakPoint'; + public static readonly KEY_STATUS_BAR_HEIGHT: string = Constants.KEY_PREFIX_COLUMNS + 'StatusBarHeight'; + public static readonly KEY_NAV_INDICATOR_HEIGHT: string = Constants.KEY_PREFIX_COLUMNS + 'NavIndicatorHeight'; + public static readonly KEY_PATH_STACK: string = Constants.KEY_PREFIX_COLUMNS + 'PathStack'; + public static readonly KEY_UI_CONTEXT: string = Constants.KEY_PREFIX_COLUMNS + 'UIContext'; /** * Routes */ diff --git a/multicolumnslibrary/src/main/ets/component/MailContent.ets b/multicolumnslibrary/src/main/ets/component/MailContent.ets index 78bdb7f..0ce2e11 100644 --- a/multicolumnslibrary/src/main/ets/component/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/component/MailContent.ets @@ -15,7 +15,7 @@ import { OperateTabs } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; @Component export struct MailContent { @@ -26,9 +26,9 @@ export struct MailContent { new OperateTabs($r('sys.symbol.trash'), $r('app.string.delete')), new OperateTabs($r('sys.symbol.dot_grid_2x2'), $r('app.string.more')), ] - @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_NAV_INDICATOR_HEIGHT) navIndicatorHeight: number = 0; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; build() { NavDestination() { @@ -36,7 +36,7 @@ export struct MailContent { Column() { Text($r('app.string.mailDetailTitle')) .fontSize($r('sys.float.Title_M')) - .margin({ left: this.curBp === 'sm' ? CommonConstants.PADDING_32 + CommonConstants.BACK_SIZE : 0 }) + .margin({ left: this.curBp === 'sm' ? Constants.PADDING_32 + Constants.BACK_SIZE : 0 }) .fontWeight(FontWeight.Medium) .fontColor($r('sys.color.font_primary')) @@ -124,8 +124,8 @@ export struct MailContent { .height('100%') } .padding({ - top: this.topRectHeight === 0 ? CommonConstants.PADDING_16 : this.topRectHeight + CommonConstants.PADDING_CUSTOM, - bottom: this.bottomRectHeight + top: this.statusBarHeight === 0 ? Constants.PADDING_16 : this.statusBarHeight + Constants.PADDING_CUSTOM, + bottom: this.navIndicatorHeight, }) .backgroundColor($r('sys.color.background_secondary')) .width('100%') diff --git a/multicolumnslibrary/src/main/ets/component/MailNavigation.ets b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets index 1bc8b82..fe422eb 100644 --- a/multicolumnslibrary/src/main/ets/component/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets @@ -14,19 +14,21 @@ */ import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; import { MailContent } from './MailContent'; @Component export struct MailNavigation { @State pathInfo: NavPathStack = new NavPathStack(); @State mailList: string[] = ['1', '1', '1', '1', '1', '1']; - @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; @Builder - myRouter() { - MailContent() + myRouter(name: string) { + if (name === 'mailContent') { + MailContent() + } } @Builder @@ -43,7 +45,7 @@ export struct MailNavigation { } .alignItems(VerticalAlign.Center) .height($r('app.float.item_height')) - .padding({ top: this.topRectHeight + CommonConstants.PADDING_CUSTOM, right: CommonConstants.PADDING_16 }) + .padding({ top: this.statusBarHeight + Constants.PADDING_CUSTOM, right: Constants.PADDING_16 }) } } @@ -78,7 +80,7 @@ export struct MailNavigation { } aboutToAppear() { - this.pathInfo.pushPath({ name: 'one' }) + this.pathInfo.pushPath({ name: 'mailContent' }) } build() { @@ -118,7 +120,7 @@ export struct MailNavigation { .justifyContent(FlexAlign.Center) } .padding({ left: $r('sys.float.padding_level6'), right: $r('sys.float.padding_level6') }) - .backgroundColor(index === 2 ? '#19254ff7' : '') + .backgroundColor(index === 2 ? $r('app.color.item_selected_color') : undefined) .borderRadius($r('sys.float.corner_radius_level5')) }, (item: string) => item.toString()) } @@ -156,9 +158,9 @@ export struct MailNavigation { } } .navBarWidth(new BreakpointType({ - sm: CommonConstants.NAV_BAR_WIDTH_SM, - md: CommonConstants.NAV_BAR_WIDTH_MD, - lg: CommonConstants.NAV_BAR_WIDTH_LG + sm: Constants.NAV_BAR_WIDTH_SM, + md: Constants.NAV_BAR_WIDTH_MD, + lg: Constants.NAV_BAR_WIDTH_LG }).getValue(this.currentBreakPoint)) .navDestination(this.myRouter) .menus(this.NavigationMenus) diff --git a/multicolumnslibrary/src/main/ets/component/MailSideBar.ets b/multicolumnslibrary/src/main/ets/component/MailSideBar.ets index 053b4c1..8122cc0 100644 --- a/multicolumnslibrary/src/main/ets/component/MailSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/MailSideBar.ets @@ -14,12 +14,12 @@ */ import { MailType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; @Extend(Text) function textStyle() { - .backgroundColor('#254ff7') - .fontColor('#fff') + .backgroundColor($r('app.color.mail_side_bg_color')) + .fontColor($r('app.color.mail_side_font_color')) .fontSize($r('sys.float.Caption_M')) .textAlign(TextAlign.Center) } @@ -41,7 +41,7 @@ struct AccountInfo { 'xxxxxxxxxxxxx', 'xxxxxxxxxxxxx', ] - @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; @Builder accountInfo() { @@ -172,7 +172,7 @@ struct MailStatusList { }.width('100%') }.padding({ left: $r('sys.float.padding_level8'), right: $r('sys.float.padding_level12') }) .height($r('app.float.item_height')) - .backgroundColor(index === 0 ? '#19254ff7' : '') + .backgroundColor(index === 0 ? $r('app.color.item_selected_color') : undefined) .borderRadius($r('sys.float.corner_radius_level8')) }, (item: MailType, index: number) => { return index + JSON.stringify(item); diff --git a/multicolumnslibrary/src/main/ets/component/PhotoContent.ets b/multicolumnslibrary/src/main/ets/component/PhotoContent.ets index 05e83dc..93df942 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoContent.ets @@ -15,7 +15,7 @@ import { PhotoType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; @Component export struct PhotoContent { @@ -31,8 +31,8 @@ export struct PhotoContent { ] @State columnsTemplate: string = '1fr 1fr 1fr'; @Link @Watch('onStateChange') sideBarStatus: boolean; - @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = CommonConstants.BREAK_POINT_SM; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; aboutToAppear() { if (this.sideBarStatus === true && this.currentBreakPoint === 'md') { @@ -74,7 +74,7 @@ export struct PhotoContent { Text($r('app.string.album')) .fontSize($r('sys.float.Title_S')) .fontWeight(FontWeight.Medium) - .margin({ left: this.sideBarStatus ? 0 : CommonConstants.ALBUMS_PADDING_LEFT + CommonConstants.BACK_SIZE }) + .margin({ left: this.sideBarStatus ? 0 : Constants.ALBUMS_PADDING_LEFT + Constants.BACK_SIZE }) Row() { SymbolGlyph($r('sys.symbol.plus')) .fontSize($r('sys.float.Title_M')) @@ -86,7 +86,7 @@ export struct PhotoContent { } } .justifyContent(FlexAlign.SpaceBetween) - .padding({ top: this.topRectHeight + CommonConstants.PADDING_CUSTOM }) + .padding({ top: this.statusBarHeight + Constants.PADDING_CUSTOM }) .height($r('app.float.item_height')) .width('100%') diff --git a/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets index 2a29c4b..67d6eec 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets @@ -15,7 +15,7 @@ import { PhotoType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; @Component export struct PhotoSideBar { @@ -30,8 +30,8 @@ export struct PhotoSideBar { new PhotoType($r('app.string.pictureType'), 22), new PhotoType($r('app.string.hidden'), 1), ]; - @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; build() { Column() { @@ -78,7 +78,7 @@ export struct PhotoSideBar { .fontColor([$r('sys.color.brand')]) .fontSize($r('sys.float.Title_M')) }.padding({ left: $r('sys.float.padding_level4'), right: $r('sys.float.padding_level4') }).width('100%') - .backgroundColor('#19254ff7') + .backgroundColor($r('app.color.item_selected_color')) .borderRadius($r('sys.float.corner_radius_level5')) } @@ -113,7 +113,7 @@ export struct PhotoSideBar { } .width('100%').height('100%') .padding({ - top: CommonConstants.BACK_SIZE, + top: Constants.BACK_SIZE, left: new BreakpointType({ sm: $r('sys.float.padding_level8'), md: $r('sys.float.padding_level12'), diff --git a/multicolumnslibrary/src/main/ets/component/WlanItem.ets b/multicolumnslibrary/src/main/ets/component/WlanItem.ets index bf46a26..6ccc8d3 100644 --- a/multicolumnslibrary/src/main/ets/component/WlanItem.ets +++ b/multicolumnslibrary/src/main/ets/component/WlanItem.ets @@ -14,15 +14,15 @@ */ import { SubItem } from './SettingItem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; @Component export struct WlanItem { @State netWorkStatus: Resource = $r('app.string.closed'); - @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; - @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; - @Consume(CommonConstants.KEY_PATH_STACK) pageStack: NavPathStack; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; + @StorageProp(Constants.KEY_NAV_INDICATOR_HEIGHT) navIndicatorHeight: number = 0; + @Consume(Constants.KEY_PATH_STACK) pageStack: NavPathStack; @Builder CustomDivider() { @@ -57,7 +57,7 @@ export struct WlanItem { .height($r('app.float.item_height')) .zIndex(2) - List({ space: CommonConstants.LIST_SPACE }) { + List({ space: Constants.LIST_SPACE }) { ListItem() { SubItem({ itemDesc: $r('app.string.WLAN'), isShowButton: true }) } @@ -150,7 +150,7 @@ export struct WlanItem { .borderRadius($r('sys.float.corner_radius_level8')) .backgroundColor($r('sys.color.comp_background_primary')) .padding({ top: $r('sys.float.padding_level2'), bottom: $r('sys.float.padding_level2') }) - .margin({ bottom: this.bottomRectHeight }) + .margin({ bottom: this.navIndicatorHeight }) } .scrollBar(BarState.Off) diff --git a/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets b/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets index 7d924f4..49904a9 100644 --- a/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets +++ b/multicolumnslibrary/src/main/ets/utils/BreakpointSystem.ets @@ -16,7 +16,7 @@ import { window } from '@kit.ArkUI'; import type { BusinessError } from '@kit.BasicServicesKit'; import { hilog } from '@kit.PerformanceAnalysisKit'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; const TAG: string = '[BreakpointSystem]'; @@ -79,7 +79,7 @@ export class BreakpointSystem { public static getInstance(): BreakpointSystem { if (!BreakpointSystem.instance) { BreakpointSystem.instance = new BreakpointSystem(); - AppStorage.setOrCreate(CommonConstants.KEY_BREAKPOINT, BreakpointTypeEnum.MD); + AppStorage.setOrCreate(Constants.KEY_BREAKPOINT, BreakpointTypeEnum.MD); } return BreakpointSystem.instance; } @@ -87,7 +87,7 @@ export class BreakpointSystem { public updateCurrentBreakpoint(breakpoint: BreakpointTypeEnum): void { if (this.currentBreakpoint !== breakpoint) { this.currentBreakpoint = breakpoint; - AppStorage.setOrCreate(CommonConstants.KEY_BREAKPOINT, this.currentBreakpoint); + AppStorage.setOrCreate(Constants.KEY_BREAKPOINT, this.currentBreakpoint); } } diff --git a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets index 403600e..0368b67 100644 --- a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets +++ b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets @@ -17,7 +17,7 @@ import { window } from '@kit.ArkUI'; import type { BusinessError } from '@kit.BasicServicesKit'; import { hilog } from '@kit.PerformanceAnalysisKit'; import { BreakpointSystem } from './BreakpointSystem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; const TAG: string = '[WindowUtil]'; @@ -25,7 +25,7 @@ export class WindowUtil { public static initialize(windowStage: window.WindowStage) { try { const uiContext: UIContext = windowStage.getMainWindowSync()?.getUIContext(); - AppStorage.setOrCreate(CommonConstants.KEY_UI_CONTEXT, uiContext); + AppStorage.setOrCreate(Constants.KEY_UI_CONTEXT, uiContext); WindowUtil.requestFullScreen(windowStage); WindowUtil.registerBreakPoint(windowStage); } catch (err) { @@ -46,7 +46,7 @@ export class WindowUtil { promise.then(() => { hilog.info(0x0000, TAG, 'Succeeded in setting the window layout to full-screen mode.'); }).catch((err: BusinessError) => { - hilog.info(0x0000, TAG, + hilog.error(0x0000, TAG, `Failed to set the window layout to full-screen mode. Cause: ${err.code}, ${err.message}`); }); } catch (err) { @@ -87,11 +87,11 @@ export class WindowUtil { // Get status bar height and indicator height. public static setAvoidArea(type: window.AvoidAreaType, area: window.AvoidArea) { - const context = AppStorage.get(CommonConstants.KEY_UI_CONTEXT); + const context = AppStorage.get(Constants.KEY_UI_CONTEXT); if (type === window.AvoidAreaType.TYPE_SYSTEM) { - AppStorage.setOrCreate(CommonConstants.KEY_TOP_RECT_HEIGHT, context?.px2vp(area.topRect.height)); + AppStorage.setOrCreate(Constants.KEY_STATUS_BAR_HEIGHT, context?.px2vp(area.topRect.height)); } else { - AppStorage.setOrCreate(CommonConstants.KEY_BOTTOM_RECT_HEIGHT, context?.px2vp(area.bottomRect.height)); + AppStorage.setOrCreate(Constants.KEY_NAV_INDICATOR_HEIGHT, context?.px2vp(area.bottomRect.height)); } } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/ets/view/MailBoxView.ets b/multicolumnslibrary/src/main/ets/view/MailBoxView.ets index babc3fc..5bc1634 100644 --- a/multicolumnslibrary/src/main/ets/view/MailBoxView.ets +++ b/multicolumnslibrary/src/main/ets/view/MailBoxView.ets @@ -16,7 +16,7 @@ import { BreakpointType } from '../utils/BreakpointSystem'; import { MailNavigation } from '../component/MailNavigation'; import { MailSideBar } from '../component/MailSideBar'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; @Builder export function MailBoxBuilder() { @@ -27,8 +27,8 @@ export function MailBoxBuilder() { export struct MailBoxView { @State isFold: boolean = false; @State sideBarWidth: number = 304; - @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; @StorageProp('isShowMailSideBar') isShowMailSideBar: boolean = this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? true : false; private pageStack: NavPathStack = new NavPathStack(); @@ -40,7 +40,7 @@ export struct MailBoxView { build() { NavDestination() { GridRow() { - GridCol({ span: CommonConstants.GRID_SPACE }) { + GridCol({ span: Constants.GRID_SPACE }) { Stack({ alignContent: Alignment.TopStart }) { SideBarContainer(SideBarContainerType.AUTO) { // Area A @@ -68,18 +68,18 @@ export struct MailBoxView { } .divider({ color: $r('sys.color.comp_divider'), strokeWidth: 0 }) .sideBarWidth(this.sideBarWidth) - .minSideBarWidth(CommonConstants.SIDE_BAR_WIDTH_MIN) - .minContentWidth(this.currentBreakPoint === 'sm' ? '100%' : CommonConstants.SIDE_BAR_WIDTH_CONTENT_MIN) + .minSideBarWidth(Constants.SIDE_BAR_WIDTH_MIN) + .minContentWidth(this.currentBreakPoint === 'sm' ? '100%' : Constants.SIDE_BAR_WIDTH_CONTENT_MIN) .controlButton({ left: new BreakpointType({ - sm: CommonConstants.PADDING_16 + CommonConstants.BACK_SIZE, - md: CommonConstants.PADDING_24 + CommonConstants.BACK_SIZE, - lg: CommonConstants.PADDING_32 + CommonConstants.BACK_SIZE, + sm: Constants.PADDING_16 + Constants.BACK_SIZE, + md: Constants.PADDING_24 + Constants.BACK_SIZE, + lg: Constants.PADDING_32 + Constants.BACK_SIZE, }).getValue(this.currentBreakPoint), - top: this.topRectHeight === 0 ? CommonConstants.PADDING_16 : - this.topRectHeight + CommonConstants.PADDING_CUSTOM, - width: CommonConstants.IMAGE_SIZE_SMALL, - height: CommonConstants.IMAGE_SIZE_SMALL + top: this.statusBarHeight === 0 ? Constants.PADDING_16 : + this.statusBarHeight + Constants.PADDING_CUSTOM, + width: Constants.IMAGE_SIZE_SMALL, + height: Constants.IMAGE_SIZE_SMALL }) .showSideBar(this.isShowMailSideBar) .onChange((value: boolean) => { @@ -98,8 +98,8 @@ export struct MailBoxView { md: $r('sys.float.padding_level12'), lg: $r('sys.float.padding_level16') }).getValue(this.currentBreakPoint), - top: this.topRectHeight === 0 ? CommonConstants.PADDING_16 : - this.topRectHeight + CommonConstants.PADDING_CUSTOM + top: this.statusBarHeight === 0 ? Constants.PADDING_16 : + this.statusBarHeight + Constants.PADDING_CUSTOM }) .backgroundColor(Color.Transparent) .height($r('app.float.button_height_small')) diff --git a/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets b/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets index 8997896..2459de8 100644 --- a/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets +++ b/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets @@ -15,15 +15,15 @@ import { hilog } from '@kit.PerformanceAnalysisKit'; import { BusinessError } from '@kit.BasicServicesKit'; -import { CommonConstants, Route } from '../common/CommonConstants'; +import { Constants, Route } from '../common/Constants'; @Component export struct MultiColumnsView { - @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; - @Provide(CommonConstants.KEY_PATH_STACK) pathStack: NavPathStack = new NavPathStack(); - private routes: Route[] = CommonConstants.ROUTES; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_NAV_INDICATOR_HEIGHT) navIndicatorHeight: number = 0; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; + @Provide(Constants.KEY_PATH_STACK) pathStack: NavPathStack = new NavPathStack(); + private routes: Route[] = Constants.ROUTES; build() { Navigation(this.pathStack) { @@ -55,18 +55,18 @@ export struct MultiColumnsView { }) }, (item: Route) => JSON.stringify(item)) } - .width(CommonConstants.FULL_WIDTH) + .width(Constants.FULL_WIDTH) } .backgroundColor($r('sys.color.background_primary')) - .width(CommonConstants.FULL_WIDTH) - .height(CommonConstants.FULL_HEIGHT) + .width(Constants.FULL_WIDTH) + .height(Constants.FULL_HEIGHT) .alignItems(HorizontalAlign.Center) .justifyContent(FlexAlign.SpaceBetween) .padding({ left: $r('sys.float.padding_level8'), right: $r('sys.float.padding_level8'), - top: CommonConstants.PADDING_TOP_INDEX + this.topRectHeight, - bottom: CommonConstants.PADDING_BOTTOM_INDEX + this.bottomRectHeight + top: Constants.PADDING_TOP_INDEX + this.statusBarHeight, + bottom: Constants.PADDING_BOTTOM_INDEX + this.navIndicatorHeight }) } .mode(NavigationMode.Stack) diff --git a/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets b/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets index 529a644..29e657e 100644 --- a/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets +++ b/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets @@ -14,7 +14,7 @@ */ import { BreakpointType } from '../utils/BreakpointSystem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; import { PhotoContent } from '../component/PhotoContent'; import { PhotoSideBar } from '../component/PhotoSideBar'; @@ -25,15 +25,15 @@ export function PhotoAlbumBuilder() { @Component export struct PhotoAlbumView { - @StorageProp(CommonConstants.KEY_BREAKPOINT) curBp: string = CommonConstants.BREAK_POINT_SM; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; - @State sideBarStatus: boolean = this.curBp !== CommonConstants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; + @State sideBarStatus: boolean = this.curBp !== Constants.BREAK_POINT_SM; private pageStack: NavPathStack = new NavPathStack(); build() { NavDestination() { GridRow() { - GridCol({ span: CommonConstants.GRID_SPACE }) { + GridCol({ span: Constants.GRID_SPACE }) { Stack({ alignContent: Alignment.TopStart }) { SideBarContainer(SideBarContainerType.AUTO) { Column() { @@ -48,13 +48,13 @@ export struct PhotoAlbumView { } .divider({ strokeWidth: 0.5, color: $r('sys.color.comp_divider') }) .controlButton({ - left: CommonConstants.PADDING_16 + CommonConstants.BACK_SIZE, - top: this.topRectHeight === 0 ? CommonConstants.PADDING_16 : - this.topRectHeight + CommonConstants.PADDING_CUSTOM, - width: CommonConstants.IMAGE_SIZE_SMALL, - height: CommonConstants.IMAGE_SIZE_SMALL + left: Constants.PADDING_16 + Constants.BACK_SIZE, + top: this.statusBarHeight === 0 ? Constants.PADDING_16 : + this.statusBarHeight + Constants.PADDING_CUSTOM, + width: Constants.IMAGE_SIZE_SMALL, + height: Constants.IMAGE_SIZE_SMALL }) - .showSideBar(this.curBp !== CommonConstants.BREAK_POINT_SM) + .showSideBar(this.curBp !== Constants.BREAK_POINT_SM) .onChange((value: boolean) => { this.sideBarStatus = value; }) @@ -70,8 +70,8 @@ export struct PhotoAlbumView { md: $r('sys.float.padding_level12'), lg: $r('sys.float.padding_level16') }).getValue(this.curBp), - top: this.topRectHeight === 0 ? $r('sys.float.padding_level8') : - this.topRectHeight + CommonConstants.PADDING_CUSTOM, + top: this.statusBarHeight === 0 ? $r('sys.float.padding_level8') : + this.statusBarHeight + Constants.PADDING_CUSTOM, }) .backgroundColor(Color.Transparent) .height($r('app.float.button_height_small')) diff --git a/multicolumnslibrary/src/main/ets/view/SettingsView.ets b/multicolumnslibrary/src/main/ets/view/SettingsView.ets index 3c2c8ef..ba98bbb 100644 --- a/multicolumnslibrary/src/main/ets/view/SettingsView.ets +++ b/multicolumnslibrary/src/main/ets/view/SettingsView.ets @@ -15,7 +15,7 @@ import { MainItem } from '../component/SettingItem'; import { WlanItem } from '../component/WlanItem'; -import { CommonConstants } from '../common/CommonConstants'; +import { Constants } from '../common/Constants'; @Builder export function SettingsBuilder() { @@ -25,13 +25,15 @@ export function SettingsBuilder() { @Component export struct SettingsView { @State pathInfo: NavPathStack = new NavPathStack(); - @StorageProp(CommonConstants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; - @StorageProp(CommonConstants.KEY_TOP_RECT_HEIGHT) topRectHeight: number = 0; - @StorageProp(CommonConstants.KEY_BOTTOM_RECT_HEIGHT) bottomRectHeight: number = 0; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; + @StorageProp(Constants.KEY_NAV_INDICATOR_HEIGHT) navIndicatorHeight: number = 0; @Builder - myRouter(name: string, param?: number | undefined) { - WlanItem() + myRouter(name: string) { + if (name === 'wlan') { + WlanItem() + } } @Builder @@ -43,15 +45,15 @@ export struct SettingsView { } aboutToAppear() { - this.pathInfo.pushPath({ name: 'one' }); + this.pathInfo.pushPath({ name: 'wlan' }); } build() { NavDestination() { GridRow() { - GridCol({ span: CommonConstants.GRID_SPACE }) { + GridCol({ span: Constants.GRID_SPACE }) { Navigation(this.pathInfo) { - List({ space: CommonConstants.GRID_SPACE }) { + List({ space: Constants.GRID_SPACE }) { ListItem() { Search({ placeholder: $r('app.string.search') }) .backgroundColor($r('sys.color.comp_background_primary')) @@ -136,7 +138,7 @@ export struct SettingsView { .padding($r('sys.float.padding_level2')) } .margin({ - bottom: this.bottomRectHeight === 0 ? CommonConstants.PADDING_BOTTOM_INDEX : this.bottomRectHeight + bottom: this.navIndicatorHeight === 0 ? Constants.PADDING_BOTTOM_INDEX : this.navIndicatorHeight }) } .scrollBar(BarState.Off) @@ -160,9 +162,7 @@ export struct SettingsView { .borderColor({ right: $r('sys.color.comp_divider') }) } .hideTitleBar(true) - .padding({ - top: this.topRectHeight - }) + .padding({ top: this.statusBarHeight }) .backgroundColor($r('sys.color.background_secondary')) } } \ No newline at end of file diff --git a/multicolumnslibrary/src/main/resources/base/element/color.json b/multicolumnslibrary/src/main/resources/base/element/color.json index 433d659..d7e1622 100644 --- a/multicolumnslibrary/src/main/resources/base/element/color.json +++ b/multicolumnslibrary/src/main/resources/base/element/color.json @@ -11,6 +11,18 @@ { "name": "text_color", "value": "#18181a" + }, + { + "name": "item_selected_color", + "value": "#19254ff7" + }, + { + "name": "mail_side_bg_color", + "value": "#254ff7" + }, + { + "name": "mail_side_font_color", + "value": "#fff" } ] } \ No newline at end of file -- Gitee From 011432d8420d019dbde576ccc5225aa170c9bf6a Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Tue, 15 Jul 2025 14:52:01 +0800 Subject: [PATCH 14/15] =?UTF-8?q?import=E8=A7=84=E8=8C=83=E6=95=B4?= =?UTF-8?q?=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- multicolumnslibrary/src/main/ets/component/MailContent.ets | 2 +- multicolumnslibrary/src/main/ets/component/MailNavigation.ets | 2 +- multicolumnslibrary/src/main/ets/component/MailSideBar.ets | 2 +- multicolumnslibrary/src/main/ets/component/PhotoContent.ets | 2 +- multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets | 2 +- multicolumnslibrary/src/main/ets/component/WlanItem.ets | 2 +- multicolumnslibrary/src/main/ets/utils/WindowUtils.ets | 2 +- multicolumnslibrary/src/main/ets/view/MailBoxView.ets | 4 ++-- multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets | 2 +- multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets | 2 +- multicolumnslibrary/src/main/ets/view/SettingsView.ets | 2 +- multicolumnssample/src/main/ets/entryability/EntryAbility.ets | 2 +- 12 files changed, 13 insertions(+), 13 deletions(-) diff --git a/multicolumnslibrary/src/main/ets/component/MailContent.ets b/multicolumnslibrary/src/main/ets/component/MailContent.ets index 0ce2e11..1caac5a 100644 --- a/multicolumnslibrary/src/main/ets/component/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/component/MailContent.ets @@ -13,9 +13,9 @@ * limitations under the License. */ +import { Constants } from '../common/Constants'; import { OperateTabs } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { Constants } from '../common/Constants'; @Component export struct MailContent { diff --git a/multicolumnslibrary/src/main/ets/component/MailNavigation.ets b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets index fe422eb..5ec0241 100644 --- a/multicolumnslibrary/src/main/ets/component/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets @@ -13,8 +13,8 @@ * limitations under the License. */ -import { BreakpointType } from '../utils/BreakpointSystem'; import { Constants } from '../common/Constants'; +import { BreakpointType } from '../utils/BreakpointSystem'; import { MailContent } from './MailContent'; @Component diff --git a/multicolumnslibrary/src/main/ets/component/MailSideBar.ets b/multicolumnslibrary/src/main/ets/component/MailSideBar.ets index 8122cc0..b472e00 100644 --- a/multicolumnslibrary/src/main/ets/component/MailSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/MailSideBar.ets @@ -12,9 +12,9 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import { Constants } from '../common/Constants'; import { MailType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { Constants } from '../common/Constants'; @Extend(Text) function textStyle() { diff --git a/multicolumnslibrary/src/main/ets/component/PhotoContent.ets b/multicolumnslibrary/src/main/ets/component/PhotoContent.ets index 93df942..92c76d6 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoContent.ets @@ -13,9 +13,9 @@ * limitations under the License. */ +import { Constants } from '../common/Constants'; import { PhotoType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { Constants } from '../common/Constants'; @Component export struct PhotoContent { diff --git a/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets index 67d6eec..631e17f 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets @@ -13,9 +13,9 @@ * limitations under the License. */ +import { Constants } from '../common/Constants'; import { PhotoType } from '../model/dataType'; import { BreakpointType } from '../utils/BreakpointSystem'; -import { Constants } from '../common/Constants'; @Component export struct PhotoSideBar { diff --git a/multicolumnslibrary/src/main/ets/component/WlanItem.ets b/multicolumnslibrary/src/main/ets/component/WlanItem.ets index 6ccc8d3..5e509c9 100644 --- a/multicolumnslibrary/src/main/ets/component/WlanItem.ets +++ b/multicolumnslibrary/src/main/ets/component/WlanItem.ets @@ -13,8 +13,8 @@ * limitations under the License. */ -import { SubItem } from './SettingItem'; import { Constants } from '../common/Constants'; +import { SubItem } from './SettingItem'; @Component export struct WlanItem { diff --git a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets index 0368b67..0843c48 100644 --- a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets +++ b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets @@ -16,8 +16,8 @@ import { window } from '@kit.ArkUI'; import type { BusinessError } from '@kit.BasicServicesKit'; import { hilog } from '@kit.PerformanceAnalysisKit'; -import { BreakpointSystem } from './BreakpointSystem'; import { Constants } from '../common/Constants'; +import { BreakpointSystem } from './BreakpointSystem'; const TAG: string = '[WindowUtil]'; diff --git a/multicolumnslibrary/src/main/ets/view/MailBoxView.ets b/multicolumnslibrary/src/main/ets/view/MailBoxView.ets index 5bc1634..8d2b00e 100644 --- a/multicolumnslibrary/src/main/ets/view/MailBoxView.ets +++ b/multicolumnslibrary/src/main/ets/view/MailBoxView.ets @@ -13,10 +13,10 @@ * limitations under the License. */ -import { BreakpointType } from '../utils/BreakpointSystem'; +import { Constants } from '../common/Constants'; import { MailNavigation } from '../component/MailNavigation'; import { MailSideBar } from '../component/MailSideBar'; -import { Constants } from '../common/Constants'; +import { BreakpointType } from '../utils/BreakpointSystem'; @Builder export function MailBoxBuilder() { diff --git a/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets b/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets index 2459de8..99b2d5a 100644 --- a/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets +++ b/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets @@ -13,8 +13,8 @@ * limitations under the License. */ -import { hilog } from '@kit.PerformanceAnalysisKit'; import { BusinessError } from '@kit.BasicServicesKit'; +import { hilog } from '@kit.PerformanceAnalysisKit'; import { Constants, Route } from '../common/Constants'; @Component diff --git a/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets b/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets index 29e657e..091b408 100644 --- a/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets +++ b/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets @@ -13,10 +13,10 @@ * limitations under the License. */ -import { BreakpointType } from '../utils/BreakpointSystem'; import { Constants } from '../common/Constants'; import { PhotoContent } from '../component/PhotoContent'; import { PhotoSideBar } from '../component/PhotoSideBar'; +import { BreakpointType } from '../utils/BreakpointSystem'; @Builder export function PhotoAlbumBuilder() { diff --git a/multicolumnslibrary/src/main/ets/view/SettingsView.ets b/multicolumnslibrary/src/main/ets/view/SettingsView.ets index ba98bbb..40de3b3 100644 --- a/multicolumnslibrary/src/main/ets/view/SettingsView.ets +++ b/multicolumnslibrary/src/main/ets/view/SettingsView.ets @@ -13,9 +13,9 @@ * limitations under the License. */ +import { Constants } from '../common/Constants'; import { MainItem } from '../component/SettingItem'; import { WlanItem } from '../component/WlanItem'; -import { Constants } from '../common/Constants'; @Builder export function SettingsBuilder() { diff --git a/multicolumnssample/src/main/ets/entryability/EntryAbility.ets b/multicolumnssample/src/main/ets/entryability/EntryAbility.ets index 7b1575d..c6ffb4e 100644 --- a/multicolumnssample/src/main/ets/entryability/EntryAbility.ets +++ b/multicolumnssample/src/main/ets/entryability/EntryAbility.ets @@ -15,8 +15,8 @@ import { UIAbility } from '@kit.AbilityKit'; import { window } from '@kit.ArkUI'; -import { hilog } from '@kit.PerformanceAnalysisKit'; import { BusinessError } from '@kit.BasicServicesKit'; +import { hilog } from '@kit.PerformanceAnalysisKit'; import { MultiColumnController } from '@ohos_samples/multicolumnslibrary'; export default class EntryAbility extends UIAbility { -- Gitee From 60529f69ed3f1d1be86ead2e500ea24fcd5c047c Mon Sep 17 00:00:00 2001 From: EasyGuohf <163991322+EasyGuohf@users.noreply.github.com> Date: Tue, 15 Jul 2025 20:19:15 +0800 Subject: [PATCH 15/15] =?UTF-8?q?=E8=A7=84=E8=8C=83=E6=95=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/main/ets/common/Constants.ets | 54 ++++++----- .../src/main/ets/component/MailContent.ets | 6 +- .../src/main/ets/component/MailNavigation.ets | 10 +-- .../src/main/ets/component/MailSideBar.ets | 4 +- .../src/main/ets/component/PhotoContent.ets | 32 ++++--- .../src/main/ets/component/PhotoSideBar.ets | 4 +- .../src/main/ets/component/WlanItem.ets | 5 +- .../src/main/ets/utils/WindowUtils.ets | 90 ++++++++----------- .../src/main/ets/view/MailBoxView.ets | 16 ++-- .../src/main/ets/view/MultiColumnsView.ets | 9 +- .../src/main/ets/view/PhotoAlbumView.ets | 8 +- .../src/main/ets/view/SettingsView.ets | 3 +- .../main/resources/base/element/color.json | 4 - .../main/resources/base/element/string.json | 4 + .../main/resources/en_US/element/string.json | 4 + .../main/resources/zh_CN/element/string.json | 4 + .../main/ets/entryability/EntryAbility.ets | 3 +- 17 files changed, 132 insertions(+), 128 deletions(-) diff --git a/multicolumnslibrary/src/main/ets/common/Constants.ets b/multicolumnslibrary/src/main/ets/common/Constants.ets index 2e7bdd5..fb3597e 100644 --- a/multicolumnslibrary/src/main/ets/common/Constants.ets +++ b/multicolumnslibrary/src/main/ets/common/Constants.ets @@ -13,87 +13,83 @@ * limitations under the License. */ -/** +/* * Common constants for all features. */ export class Constants { - /** - * BACK Button size. + /* + * Back Button size. */ public static readonly BACK_SIZE: number = 48; - /** + /* * Index page padding top size. */ public static readonly PADDING_TOP_INDEX: number = 64; - /** + /* * Index page padding bottom size. */ public static readonly PADDING_BOTTOM_INDEX: number = 16; - /** - * image size. + /* + * Image size. */ public static readonly IMAGE_SIZE_SMALL: number = 24; - /** + /* * Grid space. */ public static readonly GRID_SPACE: number = 12; - /** + /* * List space. */ public static readonly LIST_SPACE: number = 20; - /** + /* * Custom padding top size. */ public static readonly PADDING_CUSTOM: number = 8; - /** + /* * Custom padding size 16. */ public static readonly PADDING_16: number = 16; - /** + /* * Custom padding size 24. */ public static readonly PADDING_24: number = 24; - /** + /* * Custom padding size 32. */ public static readonly PADDING_32: number = 32; - /** - * album title padding left. + /* + * Album title padding left. */ public static readonly ALBUMS_PADDING_LEFT: number = 36; - /** + /* * Width the percentage of the 100. */ public static readonly FULL_WIDTH: string = '100%'; - /** + /* * Height the percentage of the 100. */ public static readonly FULL_HEIGHT: string = '100%'; - /** - * Breakpoint sm. - */ - public static readonly BREAK_POINT_SM: string = 'sm'; - /** + /* * Breakpoint sm navBarWidth. */ public static readonly NAV_BAR_WIDTH_SM: number = 321; - /** + /* * Breakpoint md navBarWidth. */ public static readonly NAV_BAR_WIDTH_MD: number = 321; - /** + /* * Breakpoint lg navBarWidth. */ public static readonly NAV_BAR_WIDTH_LG: number = 390; - /** + /* * Breakpoint lg navBarWidth. */ public static readonly SIDE_BAR_WIDTH_MIN: number = 240; - /** + /* * Breakpoint lg navBarWidth. */ public static readonly SIDE_BAR_WIDTH_CONTENT_MIN: number = 600; - /** + /* * AppStorage key */ public static readonly KEY_PREFIX_COLUMNS: string = 'multiColumns'; @@ -102,7 +98,7 @@ export class Constants { public static readonly KEY_NAV_INDICATOR_HEIGHT: string = Constants.KEY_PREFIX_COLUMNS + 'NavIndicatorHeight'; public static readonly KEY_PATH_STACK: string = Constants.KEY_PREFIX_COLUMNS + 'PathStack'; public static readonly KEY_UI_CONTEXT: string = Constants.KEY_PREFIX_COLUMNS + 'UIContext'; - /** + /* * Routes */ public static readonly ROUTES: Route[] = [ @@ -118,7 +114,7 @@ export class Constants { ]; } -/** +/* * Route type define */ export interface Route { diff --git a/multicolumnslibrary/src/main/ets/component/MailContent.ets b/multicolumnslibrary/src/main/ets/component/MailContent.ets index 1caac5a..e4f5d95 100644 --- a/multicolumnslibrary/src/main/ets/component/MailContent.ets +++ b/multicolumnslibrary/src/main/ets/component/MailContent.ets @@ -15,7 +15,7 @@ import { Constants } from '../common/Constants'; import { OperateTabs } from '../model/dataType'; -import { BreakpointType } from '../utils/BreakpointSystem'; +import { BreakpointType, BreakpointTypeEnum } from '../utils/BreakpointSystem'; @Component export struct MailContent { @@ -26,7 +26,7 @@ export struct MailContent { new OperateTabs($r('sys.symbol.trash'), $r('app.string.delete')), new OperateTabs($r('sys.symbol.dot_grid_2x2'), $r('app.string.more')), ] - @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = BreakpointTypeEnum.SM; @StorageProp(Constants.KEY_NAV_INDICATOR_HEIGHT) navIndicatorHeight: number = 0; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; @@ -36,7 +36,7 @@ export struct MailContent { Column() { Text($r('app.string.mailDetailTitle')) .fontSize($r('sys.float.Title_M')) - .margin({ left: this.curBp === 'sm' ? Constants.PADDING_32 + Constants.BACK_SIZE : 0 }) + .margin({ left: this.curBp === BreakpointTypeEnum.SM ? Constants.PADDING_32 + Constants.BACK_SIZE : 0 }) .fontWeight(FontWeight.Medium) .fontColor($r('sys.color.font_primary')) diff --git a/multicolumnslibrary/src/main/ets/component/MailNavigation.ets b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets index 5ec0241..d8841fd 100644 --- a/multicolumnslibrary/src/main/ets/component/MailNavigation.ets +++ b/multicolumnslibrary/src/main/ets/component/MailNavigation.ets @@ -14,14 +14,14 @@ */ import { Constants } from '../common/Constants'; -import { BreakpointType } from '../utils/BreakpointSystem'; +import { BreakpointType, BreakpointTypeEnum } from '../utils/BreakpointSystem'; import { MailContent } from './MailContent'; @Component export struct MailNavigation { @State pathInfo: NavPathStack = new NavPathStack(); @State mailList: string[] = ['1', '1', '1', '1', '1', '1']; - @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = BreakpointTypeEnum.MD; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; @Builder @@ -33,7 +33,7 @@ export struct MailNavigation { @Builder NavigationMenus() { - if (this.currentBreakPoint !== 'md') { + if (this.currentBreakPoint !== BreakpointTypeEnum.MD) { Row() { SymbolGlyph($r('sys.symbol.plus')) .fontColor([$r('sys.color.icon_primary')]) @@ -98,7 +98,7 @@ export struct MailNavigation { .lineHeight($r('app.float.line_height_22')) .fontColor($r('sys.color.font_primary')) Blank() - Text('4/12') + Text($r('app.string.date')) .fontSize($r('sys.float.Body_S')) .opacity(0.6) }.width('100%') @@ -149,7 +149,7 @@ export struct MailNavigation { }).getValue(this.currentBreakPoint), }) - if (this.currentBreakPoint !== 'lg' && this.currentBreakPoint !== 'xl') { + if (this.currentBreakPoint !== BreakpointTypeEnum.LG && this.currentBreakPoint !== BreakpointTypeEnum.XL) { Image($r('app.media.ic_public_list_add_light')) .width($r('app.float.image_size_48')) .height($r('app.float.image_size_48')) diff --git a/multicolumnslibrary/src/main/ets/component/MailSideBar.ets b/multicolumnslibrary/src/main/ets/component/MailSideBar.ets index b472e00..337b78a 100644 --- a/multicolumnslibrary/src/main/ets/component/MailSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/MailSideBar.ets @@ -14,7 +14,7 @@ */ import { Constants } from '../common/Constants'; import { MailType } from '../model/dataType'; -import { BreakpointType } from '../utils/BreakpointSystem'; +import { BreakpointType, BreakpointTypeEnum } from '../utils/BreakpointSystem'; @Extend(Text) function textStyle() { @@ -41,7 +41,7 @@ struct AccountInfo { 'xxxxxxxxxxxxx', 'xxxxxxxxxxxxx', ] - @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = BreakpointTypeEnum.SM; @Builder accountInfo() { diff --git a/multicolumnslibrary/src/main/ets/component/PhotoContent.ets b/multicolumnslibrary/src/main/ets/component/PhotoContent.ets index 92c76d6..d4c3271 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoContent.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoContent.ets @@ -15,7 +15,7 @@ import { Constants } from '../common/Constants'; import { PhotoType } from '../model/dataType'; -import { BreakpointType } from '../utils/BreakpointSystem'; +import { BreakpointType, BreakpointTypeEnum } from '../utils/BreakpointSystem'; @Component export struct PhotoContent { @@ -31,38 +31,42 @@ export struct PhotoContent { ] @State columnsTemplate: string = '1fr 1fr 1fr'; @Link @Watch('onStateChange') sideBarStatus: boolean; - @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = BreakpointTypeEnum.SM; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; aboutToAppear() { - if (this.sideBarStatus === true && this.currentBreakPoint === 'md') { + if (this.sideBarStatus === true && this.currentBreakPoint === BreakpointTypeEnum.MD) { this.columnsTemplate = '1fr 1fr 1fr'; - } else if (this.sideBarStatus === true && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { + } else if (this.sideBarStatus === true && + (this.currentBreakPoint === BreakpointTypeEnum.LG || this.currentBreakPoint === BreakpointTypeEnum.XL)) { this.columnsTemplate = '1fr 1fr 1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === false && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { + } else if (this.sideBarStatus === false && + (this.currentBreakPoint === BreakpointTypeEnum.LG || this.currentBreakPoint === BreakpointTypeEnum.XL)) { this.columnsTemplate = '1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === false && this.currentBreakPoint === 'md') { + } else if (this.sideBarStatus === false && this.currentBreakPoint === BreakpointTypeEnum.MD) { this.columnsTemplate = '1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === true && this.currentBreakPoint === 'sm') { + } else if (this.sideBarStatus === true && this.currentBreakPoint === BreakpointTypeEnum.SM) { this.columnsTemplate = '1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === false && this.currentBreakPoint === 'sm') { + } else if (this.sideBarStatus === false && this.currentBreakPoint === BreakpointTypeEnum.SM) { this.columnsTemplate = '1fr 1fr 1fr 1fr'; } } onStateChange() { this.getUIContext().animateTo({ duration: 300 }, () => { - if (this.sideBarStatus === true && this.currentBreakPoint === 'md') { + if (this.sideBarStatus === true && this.currentBreakPoint === BreakpointTypeEnum.MD) { this.columnsTemplate = '1fr 1fr 1fr'; - } else if (this.sideBarStatus === true && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { + } else if (this.sideBarStatus === true && + (this.currentBreakPoint === BreakpointTypeEnum.LG || this.currentBreakPoint === BreakpointTypeEnum.XL)) { this.columnsTemplate = '1fr 1fr 1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === false && (this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl')) { + } else if (this.sideBarStatus === false && + (this.currentBreakPoint === BreakpointTypeEnum.LG || this.currentBreakPoint === BreakpointTypeEnum.XL)) { this.columnsTemplate = '1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === false && this.currentBreakPoint === 'md') { + } else if (this.sideBarStatus === false && this.currentBreakPoint === BreakpointTypeEnum.MD) { this.columnsTemplate = '1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === true && this.currentBreakPoint === 'sm') { + } else if (this.sideBarStatus === true && this.currentBreakPoint === BreakpointTypeEnum.SM) { this.columnsTemplate = '1fr 1fr 1fr 1fr'; - } else if (this.sideBarStatus === false && this.currentBreakPoint === 'sm') { + } else if (this.sideBarStatus === false && this.currentBreakPoint === BreakpointTypeEnum.SM) { this.columnsTemplate = '1fr 1fr 1fr 1fr'; } }) diff --git a/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets index 631e17f..f8dd210 100644 --- a/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets +++ b/multicolumnslibrary/src/main/ets/component/PhotoSideBar.ets @@ -15,7 +15,7 @@ import { Constants } from '../common/Constants'; import { PhotoType } from '../model/dataType'; -import { BreakpointType } from '../utils/BreakpointSystem'; +import { BreakpointType, BreakpointTypeEnum } from '../utils/BreakpointSystem'; @Component export struct PhotoSideBar { @@ -30,7 +30,7 @@ export struct PhotoSideBar { new PhotoType($r('app.string.pictureType'), 22), new PhotoType($r('app.string.hidden'), 1), ]; - @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = BreakpointTypeEnum.SM; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; build() { diff --git a/multicolumnslibrary/src/main/ets/component/WlanItem.ets b/multicolumnslibrary/src/main/ets/component/WlanItem.ets index 5e509c9..7c8a4c7 100644 --- a/multicolumnslibrary/src/main/ets/component/WlanItem.ets +++ b/multicolumnslibrary/src/main/ets/component/WlanItem.ets @@ -14,12 +14,13 @@ */ import { Constants } from '../common/Constants'; +import { BreakpointTypeEnum } from '../utils/BreakpointSystem'; import { SubItem } from './SettingItem'; @Component export struct WlanItem { @State netWorkStatus: Resource = $r('app.string.closed'); - @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = BreakpointTypeEnum.MD; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; @StorageProp(Constants.KEY_NAV_INDICATOR_HEIGHT) navIndicatorHeight: number = 0; @Consume(Constants.KEY_PATH_STACK) pageStack: NavPathStack; @@ -35,7 +36,7 @@ export struct WlanItem { build() { NavDestination() { Row() { - if (this.currentBreakPoint === 'sm') { + if (this.currentBreakPoint === BreakpointTypeEnum.SM) { Button({ type: ButtonType.Circle }) { SymbolGlyph($r('sys.symbol.chevron_backward')) .fontColor([$r('sys.color.icon_primary')]) diff --git a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets index 0843c48..36fe5de 100644 --- a/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets +++ b/multicolumnslibrary/src/main/ets/utils/WindowUtils.ets @@ -22,75 +22,63 @@ import { BreakpointSystem } from './BreakpointSystem'; const TAG: string = '[WindowUtil]'; export class WindowUtil { + private static windowClass: window.Window; + public static initialize(windowStage: window.WindowStage) { try { - const uiContext: UIContext = windowStage.getMainWindowSync()?.getUIContext(); + WindowUtil.windowClass = windowStage.getMainWindowSync(); + const uiContext: UIContext = WindowUtil.windowClass.getUIContext(); AppStorage.setOrCreate(Constants.KEY_UI_CONTEXT, uiContext); - WindowUtil.requestFullScreen(windowStage); - WindowUtil.registerBreakPoint(windowStage); + WindowUtil.requestFullScreen(WindowUtil.windowClass); + WindowUtil.registerBreakPoint(WindowUtil.windowClass); } catch (err) { const error = err as BusinessError; hilog.error(0x0000, TAG, `Initialize failed. Cause code: ${error.code}, message: ${error.message}`); } } - public static requestFullScreen(windowStage: window.WindowStage): void { - windowStage.getMainWindow((err: BusinessError, data: window.Window) => { - if (err.code) { - return; - } - const windowClass: window.Window = data; - // Realize the immersive effect. - try { - const promise: Promise = windowClass.setWindowLayoutFullScreen(true); - promise.then(() => { - hilog.info(0x0000, TAG, 'Succeeded in setting the window layout to full-screen mode.'); - }).catch((err: BusinessError) => { - hilog.error(0x0000, TAG, - `Failed to set the window layout to full-screen mode. Cause: ${err.code}, ${err.message}`); - }); - } catch (err) { - const error = err as BusinessError; + public static requestFullScreen(windowClass: window.Window): void { + // Realize the immersive effect. + try { + const promise: Promise = windowClass.setWindowLayoutFullScreen(true); + promise.then(() => { + hilog.info(0x0000, TAG, 'Succeeded in setting the window layout to full-screen mode.'); + }).catch((err: BusinessError) => { hilog.error(0x0000, TAG, - `Failed to set the window layout to full-screen mode.Cause code: ${error.code}, message: ${error.message}.`); - } - }); + `Failed to set the window layout to full-screen mode. Cause: ${err.code}, ${err.message}`); + }); + } catch (err) { + const error = err as BusinessError; + hilog.error(0x0000, TAG, + `Failed to set the window layout to full-screen mode.Cause code: ${error.code}, message: ${error.message}.`); + } } - public static registerBreakPoint(windowStage: window.WindowStage) { - windowStage.getMainWindow((err: BusinessError, data: window.Window) => { - if (err.code) { - hilog.error(0x0000, TAG, `Failed to get main window: ${err.message}`); - return; - } - try { - BreakpointSystem.getInstance().updateWidthBp(data); - const systemAvoidArea: window.AvoidArea = data.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM); - const navIndicatorAvoidArea: window.AvoidArea = - data.getWindowAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR); - WindowUtil.setAvoidArea(window.AvoidAreaType.TYPE_SYSTEM, systemAvoidArea); - WindowUtil.setAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR, navIndicatorAvoidArea); - data.on('windowSizeChange', () => BreakpointSystem.getInstance().onWindowSizeChange(data)); - data.on('avoidAreaChange', (avoidAreaOption) => { - if (avoidAreaOption.type === window.AvoidAreaType.TYPE_SYSTEM || - avoidAreaOption.type === window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR) { - WindowUtil.setAvoidArea(avoidAreaOption.type, avoidAreaOption.area); - } - }); - } catch (err) { - const error = err as BusinessError; - hilog.error(0x0000, TAG, - `Register avoidAreaChange or windowSizeChange failed. code: ${error.code}, message: ${error.message}`); - } - }) + public static registerBreakPoint(data: window.Window) { + try { + BreakpointSystem.getInstance().updateWidthBp(data); + const systemAvoidArea: window.AvoidArea = data.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM); + const navIndicatorAvoidArea: window.AvoidArea = + data.getWindowAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR); + WindowUtil.setAvoidArea(window.AvoidAreaType.TYPE_SYSTEM, systemAvoidArea); + WindowUtil.setAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR, navIndicatorAvoidArea); + data.on('windowSizeChange', () => BreakpointSystem.getInstance().onWindowSizeChange(data)); + data.on('avoidAreaChange', (avoidAreaOption) => { + WindowUtil.setAvoidArea(avoidAreaOption.type, avoidAreaOption.area); + }); + } catch (err) { + const error = err as BusinessError; + hilog.error(0x0000, TAG, + `Register avoidAreaChange or windowSizeChange failed. code: ${error.code}, message: ${error.message}`); + } } // Get status bar height and indicator height. - public static setAvoidArea(type: window.AvoidAreaType, area: window.AvoidArea) { + private static setAvoidArea(type: window.AvoidAreaType, area: window.AvoidArea) { const context = AppStorage.get(Constants.KEY_UI_CONTEXT); if (type === window.AvoidAreaType.TYPE_SYSTEM) { AppStorage.setOrCreate(Constants.KEY_STATUS_BAR_HEIGHT, context?.px2vp(area.topRect.height)); - } else { + } else if (type === window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR) { AppStorage.setOrCreate(Constants.KEY_NAV_INDICATOR_HEIGHT, context?.px2vp(area.bottomRect.height)); } } diff --git a/multicolumnslibrary/src/main/ets/view/MailBoxView.ets b/multicolumnslibrary/src/main/ets/view/MailBoxView.ets index 8d2b00e..aa7fb58 100644 --- a/multicolumnslibrary/src/main/ets/view/MailBoxView.ets +++ b/multicolumnslibrary/src/main/ets/view/MailBoxView.ets @@ -16,7 +16,7 @@ import { Constants } from '../common/Constants'; import { MailNavigation } from '../component/MailNavigation'; import { MailSideBar } from '../component/MailSideBar'; -import { BreakpointType } from '../utils/BreakpointSystem'; +import { BreakpointType, BreakpointTypeEnum } from '../utils/BreakpointSystem'; @Builder export function MailBoxBuilder() { @@ -27,14 +27,16 @@ export function MailBoxBuilder() { export struct MailBoxView { @State isFold: boolean = false; @State sideBarWidth: number = 304; - @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = BreakpointTypeEnum.MD; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; @StorageProp('isShowMailSideBar') isShowMailSideBar: boolean = - this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? true : false; + this.currentBreakPoint === BreakpointTypeEnum.LG || this.currentBreakPoint === BreakpointTypeEnum.XL ? true : false; private pageStack: NavPathStack = new NavPathStack(); aboutToAppear(): void { - this.isShowMailSideBar = this.currentBreakPoint === 'lg' || this.currentBreakPoint === 'xl' ? true : false; + this.isShowMailSideBar = + this.currentBreakPoint === BreakpointTypeEnum.LG || this.currentBreakPoint === BreakpointTypeEnum.XL ? true : + false; } build() { @@ -57,7 +59,8 @@ export struct MailBoxView { Column() { Stack() { MailNavigation() - if (this.isFold && this.currentBreakPoint !== 'lg' && this.currentBreakPoint !== 'xl') { + if (this.isFold && this.currentBreakPoint !== BreakpointTypeEnum.LG && + this.currentBreakPoint !== BreakpointTypeEnum.XL) { Column() .width('100%') .height('100%') @@ -69,7 +72,8 @@ export struct MailBoxView { .divider({ color: $r('sys.color.comp_divider'), strokeWidth: 0 }) .sideBarWidth(this.sideBarWidth) .minSideBarWidth(Constants.SIDE_BAR_WIDTH_MIN) - .minContentWidth(this.currentBreakPoint === 'sm' ? '100%' : Constants.SIDE_BAR_WIDTH_CONTENT_MIN) + .minContentWidth(this.currentBreakPoint === BreakpointTypeEnum.SM ? '100%' : + Constants.SIDE_BAR_WIDTH_CONTENT_MIN) .controlButton({ left: new BreakpointType({ sm: Constants.PADDING_16 + Constants.BACK_SIZE, diff --git a/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets b/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets index 99b2d5a..614b1e3 100644 --- a/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets +++ b/multicolumnslibrary/src/main/ets/view/MultiColumnsView.ets @@ -16,10 +16,11 @@ import { BusinessError } from '@kit.BasicServicesKit'; import { hilog } from '@kit.PerformanceAnalysisKit'; import { Constants, Route } from '../common/Constants'; +import { BreakpointTypeEnum } from '../utils/BreakpointSystem'; @Component export struct MultiColumnsView { - @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = BreakpointTypeEnum.SM; @StorageProp(Constants.KEY_NAV_INDICATOR_HEIGHT) navIndicatorHeight: number = 0; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; @Provide(Constants.KEY_PATH_STACK) pathStack: NavPathStack = new NavPathStack(); @@ -34,15 +35,15 @@ export struct MultiColumnsView { .fontSize($r('sys.float.Title_L')) .alignSelf(ItemAlign.Start) .margin({ - left: this.curBp === 'sm' ? $r('sys.float.padding_level0') : - this.curBp === 'md' ? $r('sys.float.padding_level4') : $r('sys.float.padding_level8') + left: this.curBp === BreakpointTypeEnum.SM ? $r('sys.float.padding_level0') : + this.curBp === BreakpointTypeEnum.MD ? $r('sys.float.padding_level4') : $r('sys.float.padding_level8') }) Column() { ForEach(this.routes, (item: Route) => { Button(item.text) .fontSize($r('sys.float.Subtitle_M')) .fontColor($r('sys.color.font_on_primary')) - .width(this.curBp === 'sm' ? '100%' : $r('app.float.index_button_width_lg')) + .width(this.curBp === BreakpointTypeEnum.SM ? '100%' : $r('app.float.index_button_width_lg')) .height($r('app.float.button_height')) .margin({ top: $r('sys.float.padding_level6') }) .backgroundColor($r('sys.color.comp_background_emphasize')) diff --git a/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets b/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets index 091b408..7889935 100644 --- a/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets +++ b/multicolumnslibrary/src/main/ets/view/PhotoAlbumView.ets @@ -16,7 +16,7 @@ import { Constants } from '../common/Constants'; import { PhotoContent } from '../component/PhotoContent'; import { PhotoSideBar } from '../component/PhotoSideBar'; -import { BreakpointType } from '../utils/BreakpointSystem'; +import { BreakpointType, BreakpointTypeEnum } from '../utils/BreakpointSystem'; @Builder export function PhotoAlbumBuilder() { @@ -25,9 +25,9 @@ export function PhotoAlbumBuilder() { @Component export struct PhotoAlbumView { - @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = Constants.BREAK_POINT_SM; + @StorageProp(Constants.KEY_BREAKPOINT) curBp: string = BreakpointTypeEnum.SM; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; - @State sideBarStatus: boolean = this.curBp !== Constants.BREAK_POINT_SM; + @State sideBarStatus: boolean = this.curBp !== BreakpointTypeEnum.SM; private pageStack: NavPathStack = new NavPathStack(); build() { @@ -54,7 +54,7 @@ export struct PhotoAlbumView { width: Constants.IMAGE_SIZE_SMALL, height: Constants.IMAGE_SIZE_SMALL }) - .showSideBar(this.curBp !== Constants.BREAK_POINT_SM) + .showSideBar(this.curBp !== BreakpointTypeEnum.SM) .onChange((value: boolean) => { this.sideBarStatus = value; }) diff --git a/multicolumnslibrary/src/main/ets/view/SettingsView.ets b/multicolumnslibrary/src/main/ets/view/SettingsView.ets index 40de3b3..4f450ae 100644 --- a/multicolumnslibrary/src/main/ets/view/SettingsView.ets +++ b/multicolumnslibrary/src/main/ets/view/SettingsView.ets @@ -16,6 +16,7 @@ import { Constants } from '../common/Constants'; import { MainItem } from '../component/SettingItem'; import { WlanItem } from '../component/WlanItem'; +import { BreakpointTypeEnum } from '../utils/BreakpointSystem'; @Builder export function SettingsBuilder() { @@ -25,7 +26,7 @@ export function SettingsBuilder() { @Component export struct SettingsView { @State pathInfo: NavPathStack = new NavPathStack(); - @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = 'md'; + @StorageProp(Constants.KEY_BREAKPOINT) currentBreakPoint: string = BreakpointTypeEnum.MD; @StorageProp(Constants.KEY_STATUS_BAR_HEIGHT) statusBarHeight: number = 0; @StorageProp(Constants.KEY_NAV_INDICATOR_HEIGHT) navIndicatorHeight: number = 0; diff --git a/multicolumnslibrary/src/main/resources/base/element/color.json b/multicolumnslibrary/src/main/resources/base/element/color.json index d7e1622..cf371e7 100644 --- a/multicolumnslibrary/src/main/resources/base/element/color.json +++ b/multicolumnslibrary/src/main/resources/base/element/color.json @@ -1,9 +1,5 @@ { "color": [ - { - "name": "start_window_background", - "value": "#FFFFFF" - }, { "name": "detail_background", "value": "#33000000" diff --git a/multicolumnslibrary/src/main/resources/base/element/string.json b/multicolumnslibrary/src/main/resources/base/element/string.json index 6a7c9bc..45578cb 100644 --- a/multicolumnslibrary/src/main/resources/base/element/string.json +++ b/multicolumnslibrary/src/main/resources/base/element/string.json @@ -16,6 +16,10 @@ "name": "nonSense", "value": "xxxx" }, + { + "name": "date", + "value": "4/12" + }, { "name": "recvBox", "value": "Inbox" diff --git a/multicolumnslibrary/src/main/resources/en_US/element/string.json b/multicolumnslibrary/src/main/resources/en_US/element/string.json index f94236c..98ab072 100644 --- a/multicolumnslibrary/src/main/resources/en_US/element/string.json +++ b/multicolumnslibrary/src/main/resources/en_US/element/string.json @@ -32,6 +32,10 @@ "name": "nonSense", "value": "xxxx" }, + { + "name": "date", + "value": "4/12" + }, { "name": "recvBox", "value": "Inbox" diff --git a/multicolumnslibrary/src/main/resources/zh_CN/element/string.json b/multicolumnslibrary/src/main/resources/zh_CN/element/string.json index 885c08a..db71744 100644 --- a/multicolumnslibrary/src/main/resources/zh_CN/element/string.json +++ b/multicolumnslibrary/src/main/resources/zh_CN/element/string.json @@ -16,6 +16,10 @@ "name": "nonSense", "value": "xxxx" }, + { + "name": "date", + "value": "4/12" + }, { "name": "recvBox", "value": "收件箱" diff --git a/multicolumnssample/src/main/ets/entryability/EntryAbility.ets b/multicolumnssample/src/main/ets/entryability/EntryAbility.ets index c6ffb4e..70f2510 100644 --- a/multicolumnssample/src/main/ets/entryability/EntryAbility.ets +++ b/multicolumnssample/src/main/ets/entryability/EntryAbility.ets @@ -13,7 +13,7 @@ * limitations under the License. */ -import { UIAbility } from '@kit.AbilityKit'; +import { ConfigurationConstant, UIAbility } from '@kit.AbilityKit'; import { window } from '@kit.ArkUI'; import { BusinessError } from '@kit.BasicServicesKit'; import { hilog } from '@kit.PerformanceAnalysisKit'; @@ -22,6 +22,7 @@ import { MultiColumnController } from '@ohos_samples/multicolumnslibrary'; export default class EntryAbility extends UIAbility { onCreate(): void { hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate'); + this.context.getApplicationContext().setColorMode(ConfigurationConstant.ColorMode.COLOR_MODE_NOT_SET); } onDestroy(): void { -- Gitee