From a995cb21c66948d6c9e34c6150801da62719ac70 Mon Sep 17 00:00:00 2001 From: dan Date: Thu, 29 Aug 2024 18:06:30 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E9=80=82=E9=85=8D=E4=BA=86=E6=8E=A7?= =?UTF-8?q?=E5=88=B6=E4=B8=AD=E5=BF=83=E5=9C=A8=E8=AE=BE=E5=A4=87=E6=A8=AA?= =?UTF-8?q?=E5=B1=8F=E7=8A=B6=E6=80=81=E4=B8=8B=E7=9A=84=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ets/com/ohos/common/StyleConfiguration.ts | 2 ++ .../com/ohos/pages/ControlCenterComponent.ets | 1 - .../src/main/ets/pages/common/StyleManager.ts | 28 +++++++++++++------ .../src/main/ets/pages/control.ets | 16 ++++++++++- .../src/main/ets/pages/index.ets | 18 ++++++++++-- 5 files changed, 53 insertions(+), 12 deletions(-) diff --git a/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts b/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts index abc6f7f6..29fe6fae 100644 --- a/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts +++ b/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts @@ -30,6 +30,7 @@ export class ControlCenterComponentStyle { brightnessMarginBottom: Length = $r('app.float.control_center_brightness_margin_bottom'); componentBorderRadius: Length = $r('app.float.control_center_component_border_radius'); componentBackgroundColor: ResourceColor = $r('app.color.control_center_component_background'); + isLandscape: boolean = false; } export class ControlCenterUpTitleStyle { @@ -86,6 +87,7 @@ export class SimpleToggleLayoutEditComponentStyle { editBtnMarginRight: Length = $r('app.float.simple_toggle_edit_btn_margin_right'); editBtnHeight: Length = $r('app.float.simple_toggle_edit_btn_height'); editBtnSpace: Length = $r('app.float.simple_toggle_edit_btn_space'); + isLandscape: boolean = false; } export class SimpleToggleLayoutEditUpTitleStyle { diff --git a/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets b/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets index 1c004d2c..795f3c5f 100644 --- a/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets +++ b/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets @@ -154,7 +154,6 @@ export default struct ControlCenterComponent { .transition({ type: TransitionType.Delete, opacity: 0 }) } } - .height('100%') .width('100%') .onAreaChange((e, e2) => { Log.showInfo(TAG, `onAreaChange, e: ${JSON.stringify(e)} e2: ${JSON.stringify(e2)}`); diff --git a/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts b/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts index 4cb60bd1..5a50d0c2 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts +++ b/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts @@ -25,12 +25,22 @@ export default class StyleManager { static readonly STANDARD_DISPLAY_WIDTH: number = 720; static readonly STANDARD_DISPLAY_HEIGHT: number = 1280; static maxWidth: number = StyleManager.STANDARD_DISPLAY_WIDTH; + static realWidth: number = StyleManager.STANDARD_DISPLAY_WIDTH; + static isLandscape: boolean = false; static setStyle(): void { Log.showDebug(TAG, 'setStyle'); let rect = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_DROPDOWN_PANEL, 'rect'); StyleManager.maxWidth = rect.width; + StyleManager.realWidth = rect.width + if (rect.height >= rect.width) { + StyleManager.maxWidth = rect.width; + } else { + StyleManager.maxWidth = rect.height; + StyleManager.isLandscape = true; + } + // ControlCenter StyleManager.setControlCenterComponentStyle(); @@ -64,10 +74,10 @@ export default class StyleManager { // ControlCenter private static setControlCenterComponentStyle(): void{ let style = ControlCenterStyleConfiguration.getControlCenterComponentStyle(); - style.marginLeft = StyleManager.calcScaleSizePx(48); - style.marginRight = StyleManager.calcScaleSizePx(48); - style.marginTop = StyleManager.calcScaleSizePx(36); - style.upTitleHeight = StyleManager.calcScaleSizePx(127); + style.marginLeft = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); + style.marginRight = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); + style.marginTop = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(12): StyleManager.calcScaleSizePx(36); + style.upTitleHeight = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(45) : StyleManager.calcScaleSizePx(127); style.titleMarginBottom = StyleManager.calcScaleSizePx(0); style.toggleAreaGap = StyleManager.calcScaleSizePx(24); style.simpleToggleLayoutMarginTop = StyleManager.calcScaleSizePx(48); @@ -75,6 +85,7 @@ export default class StyleManager { style.brightnessMarginBottom = StyleManager.calcScaleSizePx(44); style.componentBorderRadius = StyleManager.calcScaleSizePx(48); style.componentBackgroundColor = '#99FFFFFF'; + style.isLandscape = StyleManager.isLandscape; } // ControlCenter-Title private static setControlCenterUpTitleStyle(): void{ @@ -189,10 +200,10 @@ export default class StyleManager { // SimpleToggleLayoutEdit private static setSimpleToggleLayoutEditComponentStyle(): void{ let style = ControlCenterStyleConfiguration.getSimpleToggleLayoutEditComponentStyle(); - style.marginLeft = StyleManager.calcScaleSizePx(48); - style.marginRight = StyleManager.calcScaleSizePx(48); - style.marginTop = StyleManager.calcScaleSizePx(33); - style.titleHeight = StyleManager.calcScaleSizePx(127); + style.marginLeft = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); + style.marginRight = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); + style.marginTop = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(9): StyleManager.calcScaleSizePx(33); + style.titleHeight = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(45) : StyleManager.calcScaleSizePx(127); style.titleMarginBottom = StyleManager.calcScaleSizePx(0); style.upGridMarginTop = StyleManager.calcScaleSizePx(48); style.upGridMarginBottom = StyleManager.calcScaleSizePx(24); @@ -212,6 +223,7 @@ export default class StyleManager { style.editBtnMarginRight = StyleManager.calcScaleSizePx(32); style.editBtnHeight = StyleManager.calcScaleSizePx(80); style.editBtnSpace = StyleManager.calcScaleSizePx(32); + style.isLandscape = StyleManager.isLandscape; } // SimpleToggleLayoutEdit-title private static setSimpleToggleLayoutEditUpTitleStyle(): void{ diff --git a/product/phone/dropdownpanel/src/main/ets/pages/control.ets b/product/phone/dropdownpanel/src/main/ets/pages/control.ets index 83939f9e..f12d6266 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/control.ets +++ b/product/phone/dropdownpanel/src/main/ets/pages/control.ets @@ -40,10 +40,17 @@ export default struct Control { @State moveX: number = 0 @State moveY: number = 0 @State style: ControlStyle = StyleConfiguration.getControlStyle() + @State navigationBarHeight: number = 0 + private isLandscape: boolean = false aboutToAppear() { Log.showInfo(TAG, `aboutToAppear Start`) AbilityManager.setContextName(AbilityManager.ABILITY_NAME_CONTROL_PANEL,AbilityManager.ABILITY_NAME_DROPDOWN_PANEL); + this.navigationBarHeight = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_NAVIGATION_BAR, 'config').realHeight + let rect = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_DROPDOWN_PANEL, 'rect'); + if (rect.height < rect.width) { + this.isLandscape = true + } } aboutToDisappear() { @@ -76,7 +83,14 @@ export default struct Control { .width('100%') } .width('100%') - .scrollBarColor(Color.Gray).scrollBarWidth(10) + .margin({ bottom: this.navigationBarHeight + 'px' }) + .scrollable(ScrollDirection.Vertical) + .scrollBar(BarState.Off) + .onScroll(()=>{ + if (this.isLandscape) { + AppStorage.SetOrCreate('TouchFromControlCenterScroller', true); + } + }) .layoutWeight(1) } .width('100%') diff --git a/product/phone/dropdownpanel/src/main/ets/pages/index.ets b/product/phone/dropdownpanel/src/main/ets/pages/index.ets index ff50ec78..346d4d73 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/index.ets +++ b/product/phone/dropdownpanel/src/main/ets/pages/index.ets @@ -179,7 +179,11 @@ struct Index { } try { this.mNavigationBarStatusDefaultValue = settings.getValueSync(context, this.settingDataKey, '1'); - this.componentOptAreaHeightPX = this.mNavigationBarStatusDefaultValue == '1' ? dropdownRect.height - navigationBarRect.realHeight : dropdownRect.height; + if(dropdownRect.height < dropdownRect.width){ + this.componentOptAreaHeightPX = dropdownRect.height; + }else{ + this.componentOptAreaHeightPX = this.mNavigationBarStatusDefaultValue == '1' ? dropdownRect.height - navigationBarRect.realHeight : dropdownRect.height; + } this.navigationBarWidth = this.mNavigationBarStatusDefaultValue == '1' ? navigationBarRect.height : 0; } catch (err) { Log.showError(TAG, `resizeDropdownPanelAndNavigationBar: ${context}, ${JSON.stringify(err)}`); @@ -310,7 +314,12 @@ struct Index { } if (this.showComponentName === DropdownPanelComponentName.CONTROL_CENTER) { ControlCenterComponent({ - touchMoveCallback: (data) => this.onTouchMove(data) + touchMoveCallback: (data) => { + if (AppStorage.Get('TouchFromControlCenterScroller') !== true) { + this.onTouchMove(data) + } + AppStorage.SetOrCreate('TouchFromControlCenterScroller', false); + } }) .transition(this.mControlCenterInsert) .transition(this.mControlCenterDelete) @@ -319,6 +328,11 @@ struct Index { .width('100%') .height(this.componentOptAreaHeightPX + 'px') .translate({ y: this.componentOptAreaTranslateY }) + .onTouch((event:TouchEvent)=>{ + if (event.type == TouchType.Down) { + AppStorage.SetOrCreate('TouchFromControlCenterScroller', false); + } + }) } .width('100%') .height('100%') -- Gitee From d322fc90ee1469599f766d6bea35274115ec9a98 Mon Sep 17 00:00:00 2001 From: dan <809968248@qq.com> Date: Thu, 29 Aug 2024 19:13:30 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E9=80=82=E9=85=8D=E4=BA=86=E6=8E=A7?= =?UTF-8?q?=E5=88=B6=E4=B8=AD=E5=BF=83=E5=9C=A8=E8=AE=BE=E5=A4=87=E6=A8=AA?= =?UTF-8?q?=E5=B1=8F=E7=8A=B6=E6=80=81=E4=B8=8B=E7=9A=84=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: dan --- .../ets/com/ohos/common/StyleConfiguration.ts | 2 -- .../com/ohos/pages/ControlCenterComponent.ets | 1 + .../src/main/ets/pages/common/StyleManager.ts | 28 ++++++------------- .../src/main/ets/pages/control.ets | 16 +---------- .../src/main/ets/pages/index.ets | 18 ++---------- 5 files changed, 12 insertions(+), 53 deletions(-) diff --git a/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts b/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts index 29fe6fae..abc6f7f6 100644 --- a/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts +++ b/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts @@ -30,7 +30,6 @@ export class ControlCenterComponentStyle { brightnessMarginBottom: Length = $r('app.float.control_center_brightness_margin_bottom'); componentBorderRadius: Length = $r('app.float.control_center_component_border_radius'); componentBackgroundColor: ResourceColor = $r('app.color.control_center_component_background'); - isLandscape: boolean = false; } export class ControlCenterUpTitleStyle { @@ -87,7 +86,6 @@ export class SimpleToggleLayoutEditComponentStyle { editBtnMarginRight: Length = $r('app.float.simple_toggle_edit_btn_margin_right'); editBtnHeight: Length = $r('app.float.simple_toggle_edit_btn_height'); editBtnSpace: Length = $r('app.float.simple_toggle_edit_btn_space'); - isLandscape: boolean = false; } export class SimpleToggleLayoutEditUpTitleStyle { diff --git a/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets b/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets index 795f3c5f..1c004d2c 100644 --- a/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets +++ b/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets @@ -154,6 +154,7 @@ export default struct ControlCenterComponent { .transition({ type: TransitionType.Delete, opacity: 0 }) } } + .height('100%') .width('100%') .onAreaChange((e, e2) => { Log.showInfo(TAG, `onAreaChange, e: ${JSON.stringify(e)} e2: ${JSON.stringify(e2)}`); diff --git a/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts b/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts index 5a50d0c2..4cb60bd1 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts +++ b/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts @@ -25,22 +25,12 @@ export default class StyleManager { static readonly STANDARD_DISPLAY_WIDTH: number = 720; static readonly STANDARD_DISPLAY_HEIGHT: number = 1280; static maxWidth: number = StyleManager.STANDARD_DISPLAY_WIDTH; - static realWidth: number = StyleManager.STANDARD_DISPLAY_WIDTH; - static isLandscape: boolean = false; static setStyle(): void { Log.showDebug(TAG, 'setStyle'); let rect = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_DROPDOWN_PANEL, 'rect'); StyleManager.maxWidth = rect.width; - StyleManager.realWidth = rect.width - if (rect.height >= rect.width) { - StyleManager.maxWidth = rect.width; - } else { - StyleManager.maxWidth = rect.height; - StyleManager.isLandscape = true; - } - // ControlCenter StyleManager.setControlCenterComponentStyle(); @@ -74,10 +64,10 @@ export default class StyleManager { // ControlCenter private static setControlCenterComponentStyle(): void{ let style = ControlCenterStyleConfiguration.getControlCenterComponentStyle(); - style.marginLeft = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); - style.marginRight = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); - style.marginTop = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(12): StyleManager.calcScaleSizePx(36); - style.upTitleHeight = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(45) : StyleManager.calcScaleSizePx(127); + style.marginLeft = StyleManager.calcScaleSizePx(48); + style.marginRight = StyleManager.calcScaleSizePx(48); + style.marginTop = StyleManager.calcScaleSizePx(36); + style.upTitleHeight = StyleManager.calcScaleSizePx(127); style.titleMarginBottom = StyleManager.calcScaleSizePx(0); style.toggleAreaGap = StyleManager.calcScaleSizePx(24); style.simpleToggleLayoutMarginTop = StyleManager.calcScaleSizePx(48); @@ -85,7 +75,6 @@ export default class StyleManager { style.brightnessMarginBottom = StyleManager.calcScaleSizePx(44); style.componentBorderRadius = StyleManager.calcScaleSizePx(48); style.componentBackgroundColor = '#99FFFFFF'; - style.isLandscape = StyleManager.isLandscape; } // ControlCenter-Title private static setControlCenterUpTitleStyle(): void{ @@ -200,10 +189,10 @@ export default class StyleManager { // SimpleToggleLayoutEdit private static setSimpleToggleLayoutEditComponentStyle(): void{ let style = ControlCenterStyleConfiguration.getSimpleToggleLayoutEditComponentStyle(); - style.marginLeft = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); - style.marginRight = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); - style.marginTop = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(9): StyleManager.calcScaleSizePx(33); - style.titleHeight = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(45) : StyleManager.calcScaleSizePx(127); + style.marginLeft = StyleManager.calcScaleSizePx(48); + style.marginRight = StyleManager.calcScaleSizePx(48); + style.marginTop = StyleManager.calcScaleSizePx(33); + style.titleHeight = StyleManager.calcScaleSizePx(127); style.titleMarginBottom = StyleManager.calcScaleSizePx(0); style.upGridMarginTop = StyleManager.calcScaleSizePx(48); style.upGridMarginBottom = StyleManager.calcScaleSizePx(24); @@ -223,7 +212,6 @@ export default class StyleManager { style.editBtnMarginRight = StyleManager.calcScaleSizePx(32); style.editBtnHeight = StyleManager.calcScaleSizePx(80); style.editBtnSpace = StyleManager.calcScaleSizePx(32); - style.isLandscape = StyleManager.isLandscape; } // SimpleToggleLayoutEdit-title private static setSimpleToggleLayoutEditUpTitleStyle(): void{ diff --git a/product/phone/dropdownpanel/src/main/ets/pages/control.ets b/product/phone/dropdownpanel/src/main/ets/pages/control.ets index f12d6266..83939f9e 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/control.ets +++ b/product/phone/dropdownpanel/src/main/ets/pages/control.ets @@ -40,17 +40,10 @@ export default struct Control { @State moveX: number = 0 @State moveY: number = 0 @State style: ControlStyle = StyleConfiguration.getControlStyle() - @State navigationBarHeight: number = 0 - private isLandscape: boolean = false aboutToAppear() { Log.showInfo(TAG, `aboutToAppear Start`) AbilityManager.setContextName(AbilityManager.ABILITY_NAME_CONTROL_PANEL,AbilityManager.ABILITY_NAME_DROPDOWN_PANEL); - this.navigationBarHeight = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_NAVIGATION_BAR, 'config').realHeight - let rect = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_DROPDOWN_PANEL, 'rect'); - if (rect.height < rect.width) { - this.isLandscape = true - } } aboutToDisappear() { @@ -83,14 +76,7 @@ export default struct Control { .width('100%') } .width('100%') - .margin({ bottom: this.navigationBarHeight + 'px' }) - .scrollable(ScrollDirection.Vertical) - .scrollBar(BarState.Off) - .onScroll(()=>{ - if (this.isLandscape) { - AppStorage.SetOrCreate('TouchFromControlCenterScroller', true); - } - }) + .scrollBarColor(Color.Gray).scrollBarWidth(10) .layoutWeight(1) } .width('100%') diff --git a/product/phone/dropdownpanel/src/main/ets/pages/index.ets b/product/phone/dropdownpanel/src/main/ets/pages/index.ets index 346d4d73..ff50ec78 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/index.ets +++ b/product/phone/dropdownpanel/src/main/ets/pages/index.ets @@ -179,11 +179,7 @@ struct Index { } try { this.mNavigationBarStatusDefaultValue = settings.getValueSync(context, this.settingDataKey, '1'); - if(dropdownRect.height < dropdownRect.width){ - this.componentOptAreaHeightPX = dropdownRect.height; - }else{ - this.componentOptAreaHeightPX = this.mNavigationBarStatusDefaultValue == '1' ? dropdownRect.height - navigationBarRect.realHeight : dropdownRect.height; - } + this.componentOptAreaHeightPX = this.mNavigationBarStatusDefaultValue == '1' ? dropdownRect.height - navigationBarRect.realHeight : dropdownRect.height; this.navigationBarWidth = this.mNavigationBarStatusDefaultValue == '1' ? navigationBarRect.height : 0; } catch (err) { Log.showError(TAG, `resizeDropdownPanelAndNavigationBar: ${context}, ${JSON.stringify(err)}`); @@ -314,12 +310,7 @@ struct Index { } if (this.showComponentName === DropdownPanelComponentName.CONTROL_CENTER) { ControlCenterComponent({ - touchMoveCallback: (data) => { - if (AppStorage.Get('TouchFromControlCenterScroller') !== true) { - this.onTouchMove(data) - } - AppStorage.SetOrCreate('TouchFromControlCenterScroller', false); - } + touchMoveCallback: (data) => this.onTouchMove(data) }) .transition(this.mControlCenterInsert) .transition(this.mControlCenterDelete) @@ -328,11 +319,6 @@ struct Index { .width('100%') .height(this.componentOptAreaHeightPX + 'px') .translate({ y: this.componentOptAreaTranslateY }) - .onTouch((event:TouchEvent)=>{ - if (event.type == TouchType.Down) { - AppStorage.SetOrCreate('TouchFromControlCenterScroller', false); - } - }) } .width('100%') .height('100%') -- Gitee From 25cad806ffad1b44b51f793db8f7dcc0adc52ea8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B7=A1=E4=B9=89=E9=9B=84?= <809968248@qq.com> Date: Thu, 29 Aug 2024 19:24:25 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=E9=80=82=E9=85=8D=E4=BA=86=E6=8E=A7?= =?UTF-8?q?=E5=88=B6=E4=B8=AD=E5=BF=83=E5=9C=A8=E8=AE=BE=E5=A4=87=E6=A8=AA?= =?UTF-8?q?=E5=B1=8F=E7=8A=B6=E6=80=81=E4=B8=8B=E7=9A=84=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: dan --- .../ets/com/ohos/common/StyleConfiguration.ts | 2 ++ .../com/ohos/pages/ControlCenterComponent.ets | 1 - .../src/main/ets/pages/common/StyleManager.ts | 28 +++++++++++++------ .../src/main/ets/pages/control.ets | 16 ++++++++++- .../src/main/ets/pages/index.ets | 18 ++++++++++-- 5 files changed, 53 insertions(+), 12 deletions(-) diff --git a/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts b/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts index abc6f7f6..29fe6fae 100644 --- a/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts +++ b/features/controlcentercomponent/src/main/ets/com/ohos/common/StyleConfiguration.ts @@ -30,6 +30,7 @@ export class ControlCenterComponentStyle { brightnessMarginBottom: Length = $r('app.float.control_center_brightness_margin_bottom'); componentBorderRadius: Length = $r('app.float.control_center_component_border_radius'); componentBackgroundColor: ResourceColor = $r('app.color.control_center_component_background'); + isLandscape: boolean = false; } export class ControlCenterUpTitleStyle { @@ -86,6 +87,7 @@ export class SimpleToggleLayoutEditComponentStyle { editBtnMarginRight: Length = $r('app.float.simple_toggle_edit_btn_margin_right'); editBtnHeight: Length = $r('app.float.simple_toggle_edit_btn_height'); editBtnSpace: Length = $r('app.float.simple_toggle_edit_btn_space'); + isLandscape: boolean = false; } export class SimpleToggleLayoutEditUpTitleStyle { diff --git a/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets b/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets index 1c004d2c..795f3c5f 100644 --- a/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets +++ b/features/controlcentercomponent/src/main/ets/com/ohos/pages/ControlCenterComponent.ets @@ -154,7 +154,6 @@ export default struct ControlCenterComponent { .transition({ type: TransitionType.Delete, opacity: 0 }) } } - .height('100%') .width('100%') .onAreaChange((e, e2) => { Log.showInfo(TAG, `onAreaChange, e: ${JSON.stringify(e)} e2: ${JSON.stringify(e2)}`); diff --git a/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts b/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts index 4cb60bd1..5a50d0c2 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts +++ b/product/phone/dropdownpanel/src/main/ets/pages/common/StyleManager.ts @@ -25,12 +25,22 @@ export default class StyleManager { static readonly STANDARD_DISPLAY_WIDTH: number = 720; static readonly STANDARD_DISPLAY_HEIGHT: number = 1280; static maxWidth: number = StyleManager.STANDARD_DISPLAY_WIDTH; + static realWidth: number = StyleManager.STANDARD_DISPLAY_WIDTH; + static isLandscape: boolean = false; static setStyle(): void { Log.showDebug(TAG, 'setStyle'); let rect = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_DROPDOWN_PANEL, 'rect'); StyleManager.maxWidth = rect.width; + StyleManager.realWidth = rect.width + if (rect.height >= rect.width) { + StyleManager.maxWidth = rect.width; + } else { + StyleManager.maxWidth = rect.height; + StyleManager.isLandscape = true; + } + // ControlCenter StyleManager.setControlCenterComponentStyle(); @@ -64,10 +74,10 @@ export default class StyleManager { // ControlCenter private static setControlCenterComponentStyle(): void{ let style = ControlCenterStyleConfiguration.getControlCenterComponentStyle(); - style.marginLeft = StyleManager.calcScaleSizePx(48); - style.marginRight = StyleManager.calcScaleSizePx(48); - style.marginTop = StyleManager.calcScaleSizePx(36); - style.upTitleHeight = StyleManager.calcScaleSizePx(127); + style.marginLeft = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); + style.marginRight = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); + style.marginTop = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(12): StyleManager.calcScaleSizePx(36); + style.upTitleHeight = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(45) : StyleManager.calcScaleSizePx(127); style.titleMarginBottom = StyleManager.calcScaleSizePx(0); style.toggleAreaGap = StyleManager.calcScaleSizePx(24); style.simpleToggleLayoutMarginTop = StyleManager.calcScaleSizePx(48); @@ -75,6 +85,7 @@ export default class StyleManager { style.brightnessMarginBottom = StyleManager.calcScaleSizePx(44); style.componentBorderRadius = StyleManager.calcScaleSizePx(48); style.componentBackgroundColor = '#99FFFFFF'; + style.isLandscape = StyleManager.isLandscape; } // ControlCenter-Title private static setControlCenterUpTitleStyle(): void{ @@ -189,10 +200,10 @@ export default class StyleManager { // SimpleToggleLayoutEdit private static setSimpleToggleLayoutEditComponentStyle(): void{ let style = ControlCenterStyleConfiguration.getSimpleToggleLayoutEditComponentStyle(); - style.marginLeft = StyleManager.calcScaleSizePx(48); - style.marginRight = StyleManager.calcScaleSizePx(48); - style.marginTop = StyleManager.calcScaleSizePx(33); - style.titleHeight = StyleManager.calcScaleSizePx(127); + style.marginLeft = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); + style.marginRight = StyleManager.calcScaleSizePx(48 + (StyleManager.realWidth - StyleManager.maxWidth) / 2 / 1.5); + style.marginTop = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(9): StyleManager.calcScaleSizePx(33); + style.titleHeight = StyleManager.isLandscape ? StyleManager.calcScaleSizePx(45) : StyleManager.calcScaleSizePx(127); style.titleMarginBottom = StyleManager.calcScaleSizePx(0); style.upGridMarginTop = StyleManager.calcScaleSizePx(48); style.upGridMarginBottom = StyleManager.calcScaleSizePx(24); @@ -212,6 +223,7 @@ export default class StyleManager { style.editBtnMarginRight = StyleManager.calcScaleSizePx(32); style.editBtnHeight = StyleManager.calcScaleSizePx(80); style.editBtnSpace = StyleManager.calcScaleSizePx(32); + style.isLandscape = StyleManager.isLandscape; } // SimpleToggleLayoutEdit-title private static setSimpleToggleLayoutEditUpTitleStyle(): void{ diff --git a/product/phone/dropdownpanel/src/main/ets/pages/control.ets b/product/phone/dropdownpanel/src/main/ets/pages/control.ets index 83939f9e..f12d6266 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/control.ets +++ b/product/phone/dropdownpanel/src/main/ets/pages/control.ets @@ -40,10 +40,17 @@ export default struct Control { @State moveX: number = 0 @State moveY: number = 0 @State style: ControlStyle = StyleConfiguration.getControlStyle() + @State navigationBarHeight: number = 0 + private isLandscape: boolean = false aboutToAppear() { Log.showInfo(TAG, `aboutToAppear Start`) AbilityManager.setContextName(AbilityManager.ABILITY_NAME_CONTROL_PANEL,AbilityManager.ABILITY_NAME_DROPDOWN_PANEL); + this.navigationBarHeight = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_NAVIGATION_BAR, 'config').realHeight + let rect = AbilityManager.getAbilityData(AbilityManager.ABILITY_NAME_DROPDOWN_PANEL, 'rect'); + if (rect.height < rect.width) { + this.isLandscape = true + } } aboutToDisappear() { @@ -76,7 +83,14 @@ export default struct Control { .width('100%') } .width('100%') - .scrollBarColor(Color.Gray).scrollBarWidth(10) + .margin({ bottom: this.navigationBarHeight + 'px' }) + .scrollable(ScrollDirection.Vertical) + .scrollBar(BarState.Off) + .onScroll(()=>{ + if (this.isLandscape) { + AppStorage.SetOrCreate('TouchFromControlCenterScroller', true); + } + }) .layoutWeight(1) } .width('100%') diff --git a/product/phone/dropdownpanel/src/main/ets/pages/index.ets b/product/phone/dropdownpanel/src/main/ets/pages/index.ets index ff50ec78..346d4d73 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/index.ets +++ b/product/phone/dropdownpanel/src/main/ets/pages/index.ets @@ -179,7 +179,11 @@ struct Index { } try { this.mNavigationBarStatusDefaultValue = settings.getValueSync(context, this.settingDataKey, '1'); - this.componentOptAreaHeightPX = this.mNavigationBarStatusDefaultValue == '1' ? dropdownRect.height - navigationBarRect.realHeight : dropdownRect.height; + if(dropdownRect.height < dropdownRect.width){ + this.componentOptAreaHeightPX = dropdownRect.height; + }else{ + this.componentOptAreaHeightPX = this.mNavigationBarStatusDefaultValue == '1' ? dropdownRect.height - navigationBarRect.realHeight : dropdownRect.height; + } this.navigationBarWidth = this.mNavigationBarStatusDefaultValue == '1' ? navigationBarRect.height : 0; } catch (err) { Log.showError(TAG, `resizeDropdownPanelAndNavigationBar: ${context}, ${JSON.stringify(err)}`); @@ -310,7 +314,12 @@ struct Index { } if (this.showComponentName === DropdownPanelComponentName.CONTROL_CENTER) { ControlCenterComponent({ - touchMoveCallback: (data) => this.onTouchMove(data) + touchMoveCallback: (data) => { + if (AppStorage.Get('TouchFromControlCenterScroller') !== true) { + this.onTouchMove(data) + } + AppStorage.SetOrCreate('TouchFromControlCenterScroller', false); + } }) .transition(this.mControlCenterInsert) .transition(this.mControlCenterDelete) @@ -319,6 +328,11 @@ struct Index { .width('100%') .height(this.componentOptAreaHeightPX + 'px') .translate({ y: this.componentOptAreaTranslateY }) + .onTouch((event:TouchEvent)=>{ + if (event.type == TouchType.Down) { + AppStorage.SetOrCreate('TouchFromControlCenterScroller', false); + } + }) } .width('100%') .height('100%') -- Gitee