diff --git a/services/dialog_ui/enable_notification_dialog/AppScope/app.json b/services/dialog_ui/enable_notification_dialog/AppScope/app.json index d7b2858123732b03f59fd76bcb421056f75210d4..f1c91228dfa2356c6e48a125e82cf7eac72396fc 100644 --- a/services/dialog_ui/enable_notification_dialog/AppScope/app.json +++ b/services/dialog_ui/enable_notification_dialog/AppScope/app.json @@ -2,8 +2,8 @@ "app": { "bundleName": "com.ohos.notificationdialog", "vendor": "example", - "versionCode": 1000025, - "versionName": "1.2.5", + "versionCode": 1000026, + "versionName": "1.2.6", "icon": "$media:app_icon", "label": "$string:app_name", "distributedNotificationEnabled": true, diff --git a/services/dialog_ui/enable_notification_dialog/entry/src/main/ets/common/constant.ets b/services/dialog_ui/enable_notification_dialog/entry/src/main/ets/common/constant.ets index 42c8241d14e5194edd3ad77621b8750c10f5bada..c95968779a5441036ccb4edfbc209f28ce97ec8d 100644 --- a/services/dialog_ui/enable_notification_dialog/entry/src/main/ets/common/constant.ets +++ b/services/dialog_ui/enable_notification_dialog/entry/src/main/ets/common/constant.ets @@ -141,6 +141,9 @@ export default class Constants { public static DIALOG_PRIVACY_BORDER_RADIUS = 32; public static DIALOG_PADDING_BOTTOM = 16; + public static DIALOG_PADDING_BOTTOM_LOW = 8; + public static MARGIN_ZERO = 0; + public static BUTTON_MARGIN_ROW = 4; public static TITLE_MIN_FONT_SIZE = 16; public static CROSS_LINE_RATIO = 0.2; diff --git a/services/dialog_ui/enable_notification_dialog/entry/src/main/ets/pages/notificationDialog.ets b/services/dialog_ui/enable_notification_dialog/entry/src/main/ets/pages/notificationDialog.ets index 881bb7da733be770aebd5b9ab3657feb8adfa6d6..d38222154971593d8e12b0e46f62e5ec8a9845ee 100644 --- a/services/dialog_ui/enable_notification_dialog/entry/src/main/ets/pages/notificationDialog.ets +++ b/services/dialog_ui/enable_notification_dialog/entry/src/main/ets/pages/notificationDialog.ets @@ -56,6 +56,20 @@ let storage = LocalStorage.getShared(); .width('50%') } +@Extend(Button) function singleRowButton() { + .backgroundColor(Color.Transparent) + .fontColor($r('app.color.button_text')) + .fontSize( + getLimitFontSize( + Constants.TEXT_MIDDLE_FONT_SIZE, + getFontSizeScale(getContext(this) as common.UIAbilityContext, Constants.FONT_SCALE_MAX)) + ) + .fontWeight(FontWeight.Medium) + .height(Constants.BUTTON_HEIGHT) + .flexGrow(Constants.FLEX_GROW) + .width('100%') +} + @Entry(storage) @Component struct NotificationDialogPage { @@ -94,6 +108,8 @@ struct PermissionDialog { controller?: CustomDialogController; @State titleContainerWidth: string | number = 'auto'; @State maxHeight: string|number = '85%'; + @State buttonVisibility: Visibility = Visibility.Visible; + @State singleRowButtonVisibility: Visibility = Visibility.None; build() { Row(){ @@ -190,16 +206,63 @@ struct PermissionDialog { }) .customizeButton() } - .margin({ left: Constants.BUTTON_MARGIN_LEFT, right: Constants.BUTTON_MARGIN_RIGHT }) + .margin({ + left: Constants.BUTTON_MARGIN_LEFT, + right: Constants.BUTTON_MARGIN_RIGHT, + bottom: Constants.DIALOG_PADDING_BOTTOM + }) + } + .visibility(this.buttonVisibility) + + Row() { + Flex({ justifyContent: FlexAlign.Center }) { + Button($r('app.string.BAN')) + .onClick(async (): Promise => { + await this.enableNotification(false); + }) + .singleRowButton() + .margin({ + left: Constants.MARGIN_ZERO, + right: Constants.MARGIN_ZERO, + bottom: Constants.BUTTON_MARGIN_ROW + }) + } + .margin({ + left: Constants.BUTTON_MARGIN_LEFT, + right: Constants.BUTTON_MARGIN_RIGHT + }) } + .visibility(this.singleRowButtonVisibility) + + Row() { + Flex({ justifyContent: FlexAlign.Center }) { + Button($r('app.string.ALLOW')) + .onClick(async (): Promise => { + await this.enableNotification(true); + }) + .singleRowButton() + .margin({ + left: Constants.MARGIN_ZERO, + right: Constants.MARGIN_ZERO + }) + } + .margin({ + left: Constants.BUTTON_MARGIN_LEFT, + right: Constants.BUTTON_MARGIN_RIGHT, + bottom: Constants.DIALOG_PADDING_BOTTOM_LOW + }) + } + .visibility(this.singleRowButtonVisibility) } } } .borderRadius(Constants.DIALOG_PRIVACY_BORDER_RADIUS) .backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK) .width(Constants.FULL_WIDTH) - .padding({ bottom: Constants.DIALOG_PADDING_BOTTOM }) .clip(true) + .onAreaChange((oldArea: Area, newArea: Area) => { + this.updateButtomVisibility(newArea.width as number); + }) } } .margin({ @@ -283,6 +346,44 @@ struct PermissionDialog { } } + updateButtomVisibility(dialogWidth: number): void { + try { + let buttonWidth = (dialogWidth - Constants.BUTTON_LEFT - Constants.BUTTON_RIGHT + - Constants.BUTTON_MARGIN_LEFT - Constants.BUTTON_MARGIN_RIGHT + - Constants.BUTTON_HEIGHT) * 0.5; + + let measureUtils = this.getUIContext().getMeasureUtils(); + let denyOptions: MeasureOptions = { + textContent: $r('app.string.BAN'), + fontSize: getLimitFontSize( + Constants.TEXT_MIDDLE_FONT_SIZE, + getFontSizeScale(getContext(this) as common.UIAbilityContext, Constants.FONT_SCALE_MAX)), + fontWeight: FontWeight.Medium + }; + let denyTextWidth = measureUtils.measureText(denyOptions); + + let allowOptions: MeasureOptions = { + textContent: $r('app.string.ALLOW'), + fontSize: getLimitFontSize( + Constants.TEXT_MIDDLE_FONT_SIZE, + getFontSizeScale(getContext(this) as common.UIAbilityContext, Constants.FONT_SCALE_MAX)), + fontWeight: FontWeight.Medium + }; + let allowTextWidth = measureUtils.measureText(allowOptions); + + console.info(TAG, `updateButtomVisibility ${denyTextWidth} ${allowTextWidth} ${vp2px(buttonWidth)}`); + if (denyTextWidth > vp2px(buttonWidth) || allowTextWidth > vp2px(buttonWidth)) { + this.buttonVisibility = Visibility.None; + this.singleRowButtonVisibility = Visibility.Visible; + } else { + this.buttonVisibility = Visibility.Visible; + this.singleRowButtonVisibility = Visibility.None; + } + } catch (err) { + console.error(TAG, `updateButtomVisibility error. Cause: ${err?.code}`); + } + } + async updateIsBottomPopover(): Promise { let dis = display.getDefaultDisplaySync(); let isVertical = dis.width <= dis.height;