diff --git a/common/src/main/ets/default/StyleConfiguration.ts b/common/src/main/ets/default/StyleConfiguration.ts index 1d8f3e26..4a23b516 100644 --- a/common/src/main/ets/default/StyleConfiguration.ts +++ b/common/src/main/ets/default/StyleConfiguration.ts @@ -14,18 +14,20 @@ */ import StyleManager from './StyleManager'; +import deviceInfo from '@ohos.deviceInfo'; const TAG = 'Common-StyleConfiguration'; +const deviceTypeInfo = deviceInfo.deviceType export default class StyleConfiguration { static getCommonStyle() { const key: string = TAG + "-Common"; return StyleManager.getStyle(key, () => { return { - statusBarFontSize: '16fp', + statusBarFontSize: deviceTypeInfo === 'phone' ? '12fp' : '16fp', statusBarIconWidth: '24vp', statusBarIconHeight: '24vp', - statusBarMarginLeftRight: '5vp', + statusBarMarginLeftRight: deviceTypeInfo === 'phone' ? '0vp' : '5vp', }; }); } diff --git a/features/managementcomponent/src/main/ets/com/ohos/view/component/appItemComponent.ets b/features/managementcomponent/src/main/ets/com/ohos/view/component/appItemComponent.ets index 49c5ecf2..fe9f3cd8 100644 --- a/features/managementcomponent/src/main/ets/com/ohos/view/component/appItemComponent.ets +++ b/features/managementcomponent/src/main/ets/com/ohos/view/component/appItemComponent.ets @@ -56,78 +56,104 @@ export default struct AppItemComponent { Text(this.appTitle) .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body1')) + .fontWeight(FontWeight.Medium) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_3) .textOverflow({ overflow: TextOverflow.Ellipsis }) - .margin({ top: $r('app.float.appitem_label_margin_t'), bottom: $r('app.float.appitem_label_margin_b'), left: $r('app.float.page_notice_info_label_margin') }); + .margin({ + top: $r('app.float.appitem_label_margin_t'), + bottom: $r('app.float.appitem_label_margin_b'), + left: $r('app.float.page_notice_info_label_margin') + }); Row() { if (this.appSwitch === 3) { if (parseInt(this.appValue) == 0) { Text($r('app.string.slot_unknown')) - .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) .visibility(Visibility.Visible) - .margin({ bottom: $r('app.float.appitem_version_margin_b'), left: $r('app.float.page_notice_info_label_margin') }); + .margin({ + bottom: $r('app.float.appitem_version_margin_b'), + left: $r('app.float.page_notice_info_label_margin') + }); } else if (parseInt(this.appValue) == 1) { Text($r('app.string.slot_social_communication')) - .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) .visibility(Visibility.Visible) - .margin({ bottom: $r('app.float.appitem_version_margin_b'), left: $r('app.float.page_notice_info_label_margin') }); + .margin({ + bottom: $r('app.float.appitem_version_margin_b'), + left: $r('app.float.page_notice_info_label_margin') + }); } else if (parseInt(this.appValue) == 2) { Text($r('app.string.slot_service_information')) - .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) .visibility(Visibility.Visible) - .margin({ bottom: $r('app.float.appitem_version_margin_b'), left: $r('app.float.page_notice_info_label_margin') }); + .margin({ + bottom: $r('app.float.appitem_version_margin_b'), + left: $r('app.float.page_notice_info_label_margin') + }); } else if (parseInt(this.appValue) == 3) { Text($r('app.string.slot_content_information')) - .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) .visibility(Visibility.Visible) - .margin({ bottom: $r('app.float.appitem_version_margin_b'), left: $r('app.float.page_notice_info_label_margin') }); + .margin({ + bottom: $r('app.float.appitem_version_margin_b'), + left: $r('app.float.page_notice_info_label_margin') + }); } else if (parseInt(this.appValue) == 0xFFFF) { Text($r('app.string.slot_other')) - .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) .visibility(Visibility.Visible) - .margin({ bottom: $r('app.float.appitem_version_margin_b'), left: $r('app.float.page_notice_info_label_margin') }); + .margin({ + bottom: $r('app.float.appitem_version_margin_b'), + left: $r('app.float.page_notice_info_label_margin') + }); } else { Text('') - .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) .visibility(Visibility.Visible) - .margin({ bottom: $r('app.float.appitem_version_margin_b'), left: $r('app.float.page_notice_info_label_margin') }); + .margin({ + bottom: $r('app.float.appitem_version_margin_b'), + left: $r('app.float.page_notice_info_label_margin') + }); } } else { Text($r('app.string.version')) - .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) .visibility(Visibility.Visible) - .margin({ bottom: $r('app.float.appitem_version_margin_b'), left: $r('app.float.page_notice_info_label_margin') }); + .margin({ + bottom: $r('app.float.appitem_version_margin_b'), + left: $r('app.float.page_notice_info_label_margin') + }); Text(this.appSummary) - .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) .textAlign(TextAlign.Start) .maxLines(ConfigData.MAX_LINES_1) @@ -180,6 +206,7 @@ export default struct AppItemComponent { } else { Toggle({ type: ToggleType.Switch, isOn: this.canNotice }) .align(Alignment.End) + .selectedColor($r("app.color.font_color_007DFF")) .width($r('app.float.toggle_comp_width')) .height($r('app.float.toggle_comp_height')) .enabled(this.isCanChange) diff --git a/features/managementcomponent/src/main/ets/com/ohos/view/component/headComponent.ets b/features/managementcomponent/src/main/ets/com/ohos/view/component/headComponent.ets index 57188627..6614740a 100644 --- a/features/managementcomponent/src/main/ets/com/ohos/view/component/headComponent.ets +++ b/features/managementcomponent/src/main/ets/com/ohos/view/component/headComponent.ets @@ -43,7 +43,7 @@ struct HeadComponent { Text(this.headName) .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('app.float.page_phrases_tittle_font')) - .fontWeight(FontWeight.Bold) + .fontWeight(FontWeight.Medium) .width(ConfigData.WH_100_100) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) @@ -51,7 +51,6 @@ struct HeadComponent { } .width(ConfigData.WH_100_100) .height($r('app.float.page_title_height')) - .margin({top:$r('app.float.page_header_margin_t')}) .alignItems(VerticalAlign.Center) .align(Alignment.Start) } diff --git a/features/managementcomponent/src/main/ets/com/ohos/view/component/itemComponent.ets b/features/managementcomponent/src/main/ets/com/ohos/view/component/itemComponent.ets index 770643a6..48ddac44 100644 --- a/features/managementcomponent/src/main/ets/com/ohos/view/component/itemComponent.ets +++ b/features/managementcomponent/src/main/ets/com/ohos/view/component/itemComponent.ets @@ -28,7 +28,7 @@ export default struct ItemComponent { .fontColor($r('app.color.itemComp_title_color')) .width(ConfigData.WH_45_100) .textAlign(TextAlign.Start) - .fontWeight(FontWeight.Bold) + .fontWeight(FontWeight.Medium) Blank() Text(this.value) .fontSize($r('app.float.itemComp_value_font')) diff --git a/features/managementcomponent/src/main/ets/com/ohos/view/component/noDisturbComponent.ets b/features/managementcomponent/src/main/ets/com/ohos/view/component/noDisturbComponent.ets index 157ebf6c..bd279210 100644 --- a/features/managementcomponent/src/main/ets/com/ohos/view/component/noDisturbComponent.ets +++ b/features/managementcomponent/src/main/ets/com/ohos/view/component/noDisturbComponent.ets @@ -13,7 +13,7 @@ * limitations under the License. */ import Log from '../../../../../../../../../common/src/main/ets/default/Log'; -import ConfigData, {DoNotDisturbType} from '../../common/constants'; +import ConfigData, { DoNotDisturbType } from '../../common/constants'; import ViewModel from '../../vm/noDisturbComponentViewModel' const TAG = 'ManagementComponent-NoDisturbComponent'; @@ -52,8 +52,9 @@ export default struct NoDisturbComponent { .fontSize($r('app.float.itemComp_titel_font')) .fontColor($r('app.color.itemComp_title_color')) .textAlign(TextAlign.Start) - .fontWeight(FontWeight.Bold) + .fontWeight(FontWeight.Medium) } + Row() { if (this.mRefreshCnt > 0) { if (this.mViewModel.repeatMode == DoNotDisturbType.TYPE_ONCE) { @@ -65,6 +66,7 @@ export default struct NoDisturbComponent { .fontSize($r('app.float.itemComp_value_font')) .fontColor($r('app.color.itemComp_font_color')) .textAlign(TextAlign.Start) + .margin({ top: $r("app.float.noDisturb_text_margin_vertical") }) } else if (this.mViewModel.repeatMode == DoNotDisturbType.TYPE_DAILY) { Text($r('app.string.noDisturb_daily_label')) .fontSize($r('app.float.itemComp_value_font')) @@ -74,6 +76,7 @@ export default struct NoDisturbComponent { .fontSize($r('app.float.itemComp_value_font')) .fontColor($r('app.color.itemComp_font_color')) .textAlign(TextAlign.Start) + .margin({ top: $r("app.float.noDisturb_text_margin_vertical") }) } else if (this.mViewModel.repeatMode == DoNotDisturbType.TYPE_CLEARLY) { Text($r('app.string.noDisturb_clearly_label')) .fontSize($r('app.float.itemComp_value_font')) @@ -83,11 +86,13 @@ export default struct NoDisturbComponent { .fontSize($r('app.float.itemComp_value_font')) .fontColor($r('app.color.itemComp_font_color')) .textAlign(TextAlign.Start) + .margin({ top: $r("app.float.noDisturb_text_margin_vertical") }) } else { Text($r('app.string.noDisturb_closed')) .fontSize($r('app.float.itemComp_value_font')) .fontColor($r('app.color.itemComp_font_color')) .textAlign(TextAlign.Start) + .margin({ top: $r("app.float.noDisturb_text_margin_vertical") }) } } else { Blank(); @@ -106,6 +111,7 @@ export default struct NoDisturbComponent { .align(Alignment.End) .width($r('app.float.toggle_comp_width')) .height($r('app.float.toggle_comp_height')) + .selectedColor($r("app.color.font_color_007DFF")) .onChange((data) => { Log.showInfo(TAG, `Toggle onChange param: data = ${data}`); if (this.mPrevGetCnt == 0) { @@ -124,8 +130,8 @@ export default struct NoDisturbComponent { this.mViewModel.repeatMode = this.mViewModel.isEffective ? this.mPrevReapMode : DoNotDisturbType.TYPE_NONE; if (this.mViewModel.repeatMode == DoNotDisturbType.TYPE_NONE) { this.mViewModel.refreshDate.bind(this.mViewModel)(this.mViewModel.repeatMode, - this.mViewModel.getDateByHHMI(ConfigData.TIME_EMPTY), - this.mViewModel.getDateByHHMI(ConfigData.TIME_EMPTY)); + this.mViewModel.getDateByHHMI(ConfigData.TIME_EMPTY), + this.mViewModel.getDateByHHMI(ConfigData.TIME_EMPTY)); } else { this.mViewModel.refreshDate.bind(this.mViewModel)(this.mViewModel.repeatMode, this.mPrevStartTime, @@ -140,7 +146,7 @@ export default struct NoDisturbComponent { .flexShrink(0) .align(Alignment.End) .alignItems(VerticalAlign.Center) - .padding({ right: $r('sys.float.ohos_id_max_padding_end') }) + .padding({ right: $r('sys.float.ohos_id_default_padding_end') }) } .width(ConfigData.WH_100_100) .height($r('app.float.itemComp_noDisturb_height')) diff --git a/features/managementcomponent/src/main/ets/com/ohos/view/component/slotLstComponent.ets b/features/managementcomponent/src/main/ets/com/ohos/view/component/slotLstComponent.ets index 9be52cf9..7f2428c5 100644 --- a/features/managementcomponent/src/main/ets/com/ohos/view/component/slotLstComponent.ets +++ b/features/managementcomponent/src/main/ets/com/ohos/view/component/slotLstComponent.ets @@ -33,7 +33,7 @@ export default struct SlotLstComponent { Text($r('app.string.slotType')) .fontColor($r('sys.color.ohos_id_color_text_secondary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) - .fontWeight(FontWeight.Bold) + .fontWeight(FontWeight.Medium) .width(ConfigData.WH_100_100) .maxLines(ConfigData.MAX_LINES_1) .textOverflow({ overflow: TextOverflow.Ellipsis }) diff --git a/features/managementcomponent/src/main/ets/com/ohos/view/component/switchComponent.ets b/features/managementcomponent/src/main/ets/com/ohos/view/component/switchComponent.ets index eac29ceb..a951f375 100644 --- a/features/managementcomponent/src/main/ets/com/ohos/view/component/switchComponent.ets +++ b/features/managementcomponent/src/main/ets/com/ohos/view/component/switchComponent.ets @@ -34,11 +34,11 @@ export default struct SwitchComponent { Text(this.title) .fontColor($r('sys.color.ohos_id_color_text_primary')) .fontSize($r('sys.float.ohos_id_text_size_body1')) - .fontWeight(FontWeight.Bold) + .fontWeight(FontWeight.Medium) .align(Alignment.Start) Text(this.describe) .fontColor($r('sys.color.ohos_id_color_text_primary')) - .fontSize($r('sys.float.ohos_id_text_size_body1')) + .fontSize($r('sys.float.ohos_id_text_size_body2')) .align(Alignment.Start) .visibility((this.describe ? true : false) ? Visibility.Visible : Visibility.None) }.alignItems(HorizontalAlign.Start) @@ -53,6 +53,8 @@ export default struct SwitchComponent { Row() { Toggle({ type: ToggleType.Switch, isOn: this.initState }) .align(Alignment.End) + .offset({ x: $r("app.float.noDisturb_offset_x"), y: 0 }) + .selectedColor($r("app.color.font_color_007DFF")) .width($r('app.float.toggle_comp_width')) .height($r('app.float.toggle_comp_height')) .enabled(this.isCanChange) @@ -66,7 +68,7 @@ export default struct SwitchComponent { .align(Alignment.End) .padding({ right: $r('app.float.switchComp_padding_r') }) }.width(ConfigData.WH_100_100) - .height($r('app.float.switchComp_height') ) + .height($r('app.float.switchComp_height')) .border({ width: $r('app.float.border_width'), color: Color.White, radius: $r('app.float.border_radius') }) .backgroundColor(Color.White) diff --git a/features/managementcomponent/src/main/resources/base/element/float.json b/features/managementcomponent/src/main/resources/base/element/float.json index 95c96582..3be998b0 100644 --- a/features/managementcomponent/src/main/resources/base/element/float.json +++ b/features/managementcomponent/src/main/resources/base/element/float.json @@ -355,6 +355,18 @@ { "name": "noDisturb_margin_16", "value": "16vp" + }, + { + "name": "noDisturb_offset_x", + "value": "0" + }, + { + "name": "noDisturb_text_margin_vertical", + "value": "0vp" + }, + { + "name": "noDisturb_text_margin_right", + "value": "0vp" } ] } \ No newline at end of file diff --git a/features/managementcomponent/src/main/resources/phone/element/color.json b/features/managementcomponent/src/main/resources/phone/element/color.json new file mode 100644 index 00000000..bf9ed9c0 --- /dev/null +++ b/features/managementcomponent/src/main/resources/phone/element/color.json @@ -0,0 +1,36 @@ +{ + "color": [ + { + "name": "background_color", + "value": "#0xDCDCDC" + }, + { + "name": "background_transparent", + "value": "#00000000" + }, + { + "name": "appitem_label_fontcolor", + "value": "#333333" + }, + { + "name": "appitem_version_fontcolor", + "value": "#999999" + }, + { + "name": "divider_color", + "value": "#0C000000" + }, + { + "name": "itemComp_title_color", + "value": "#182431" + }, + { + "name": "itemComp_font_color", + "value": "#182431" + }, + { + "name": "font_color_007DFF", + "value": "#007DFF" + } + ] +} \ No newline at end of file diff --git a/features/managementcomponent/src/main/resources/phone/element/float.json b/features/managementcomponent/src/main/resources/phone/element/float.json new file mode 100644 index 00000000..24ea9b6e --- /dev/null +++ b/features/managementcomponent/src/main/resources/phone/element/float.json @@ -0,0 +1,372 @@ +{ + "float": [ + { + "name": "page_margin_l", + "value": "12pv" + }, + { + "name": "page_margin_r", + "value": "12pv" + }, + { + "name": "page_margin_t", + "value": "5" + }, + { + "name": "page_margin_b", + "value": "5" + }, + { + "name": "page_title_font", + "value": "24vp" + }, + { + "name": "page_title_height", + "value": "56vp" + }, + { + "name": "page_phrases_font", + "value": "14fp" + }, + { + "name": "page_phrases_padding_t", + "value": "19vp" + }, + { + "name": "applist_hieght", + "value": "476vp" + }, + { + "name": "applist_hieght_phone", + "value": "800vp" + }, + { + "name": "applist_hieght_bat", + "value": "584vp" + }, + { + "name": "applist_hieght_bat_phone", + "value": "1022vp" + }, + { + "name": "page_header_margin_t", + "value": "24vp" + }, + { + "name": "applist_margin_t", + "value": "12vp" + }, + { + "name": "page_phrases_height", + "value": "48vp" + }, + { + "name": "page_phrases_tittle_font", + "value": "20fp" + }, + { + "name": "dialog_title_height", + "value": "60vp" + }, + { + "name": "dialog_title_font", + "value": "20fp" + }, + { + "name": "dialog_title_margin_l", + "value": "50" + }, + { + "name": "dialog_button_font", + "value": "20fp" + }, + { + "name": "timeDialog_height", + "value": "310vp" + }, + { + "name": "timeDialog_datePicker_height", + "value": "200vp" + }, + { + "name": "repeatDialog_cont_font", + "value": "16fp" + }, + { + "name": "repeatDialog_height", + "value": "320vp" + }, + { + "name": "border_width", + "value": "1" + }, + { + "name": "border_radius", + "value": "24vp" + }, + { + "name": "image_border_radius", + "value": "15" + }, + { + "name": "appitem_item_height", + "value": "72vp" + }, + { + "name": "appitem_header_icon_width", + "value": "24vp" + }, + { + "name": "appitem_header_icon_height", + "value": "24vp" + }, + { + "name": "appitem_icon_width", + "value": "48vp" + }, + { + "name": "appitem_icon_height", + "value": "48vp" + }, + { + "name": "appitem_icon_info_margin_r", + "value": "4vp" + }, + { + "name": "appitem_icon_info_list_margin_r", + "value": "4vp" + }, + { + "name": "appitem_icon_margin_r", + "value": "16vp" + }, + { + "name": "appitem_label_margin_t", + "value": "10" + }, + { + "name": "appitem_label_margin_b", + "value": "5" + }, + { + "name": "appitem_label_font", + "value": "20vp" + }, + { + "name": "appitem_version_font", + "value": "18vp" + }, + { + "name": "appitem_version_margin_b", + "value": "10" + }, + { + "name": "appitem_version_margin_r", + "value": "10" + }, + { + "name": "arrow_icon_width", + "value": "40" + }, + { + "name": "arrow_icon_height", + "value": "40" + }, + { + "name": "toggle_comp_width", + "value": "44vp" + }, + { + "name": "toggle_comp_height", + "value": "44vp" + }, + { + "name": "toggle_check_width", + "value": "25" + }, + { + "name": "divider_stroke_width", + "value": "1" + }, + { + "name": "divider_margin_l_info", + "value": "64vp" + }, + { + "name": "divider_margin_l", + "value": "12vp" + }, + { + "name": "divider_margin_r", + "value": "12vp" + }, + { + "name": "divider_height", + "value": "20" + }, + { + "name": "itemComp_height", + "value": "48vp" + }, + { + "name": "itemComp_noDisturb_height", + "value": "72vp" + }, + { + "name": "itemComp_titel_font", + "value": "16vp" + }, + { + "name": "itemComp_value_font", + "value": "14fp" + }, + { + "name": "itemComp_image_width", + "value": "12vp" + }, + { + "name": "itemComp_image_height", + "value": "24vp" + }, + { + "name": "itemComp_image_margin_left", + "value": "30" + }, + { + "name": "itemComp_padding_l", + "value": "12vp" + }, + { + "name": "itemComp_padding_r", + "value": "12vp" + }, + { + "name": "itemComp_margin_b", + "value": "8vp" + }, + { + "name": "slotComp_font", + "value": "20" + }, + { + "name": "page_header_icon_margin_l", + "value": "18vp" + }, + { + "name": "page_header_margin_l", + "value": "18vp" + }, + { + "name": "slotComp_image_width", + "value": "18vp" + }, + { + "name": "slotComp_image_height", + "value": "18vp" + }, + { + "name": "slotComp_margin_t", + "value": "20" + }, + { + "name": "switchComp_titel_font", + "value": "20" + }, + { + "name": "switchComp_height", + "value": "64vp" + }, + { + "name": "switchComp_padding_r", + "value": "12vp" + }, + { + "name": "slotComp_height", + "value": "56vp" + }, + { + "name": "distance_24", + "value": "15" + }, + { + "name": "page_notice_title_margin_t", + "value": "8vp" + }, + { + "name": "page_notice_part_margin_t", + "value": "8vp" + }, + { + "name": "page_notice_row_margin_t", + "value": "18vp" + }, + { + "name": "page_notice_app_item_row_height", + "value": "72vp" + }, + { + "name": "appitem_notice_info_icon_width_l", + "value": "64vp" + }, + { + "name": "appitem_notice_info_icon_height_l", + "value": "64vp" + }, + { + "name": "appitem_notice_info_icon_width", + "value": "48vp" + }, + { + "name": "appitem_notice_info_icon_height", + "value": "48vp" + }, + { + "name": "appitem_notice_infopop_icon_width", + "value": "22vp" + }, + { + "name": "appitem_notice_infopop_icon_height", + "value": "22vp" + }, + { + "name": "appitem_notice_infopop_icon_margin_r", + "value": "24vp" + }, + { + "name": "appitem_notice_info_icon_margin_r", + "value": "12vp" + }, + { + "name": "page_notice_info_label_margin", + "value": "12vp" + }, + { + "name": "notice_title_height", + "value": "48vp" + }, + { + "name": "notice_row_height", + "value": "56vp" + }, + { + "name": "noDisturb_margin_lf", + "value": "4vp" + }, + { + "name": "noDisturb_margin_16", + "value": "16vp" + }, + { + "name": "noDisturb_offset_x", + "value": "-18" + }, + { + "name": "noDisturb_text_margin_vertical", + "value": "2vp" + }, + { + "name": "noDisturb_text_margin_right", + "value": "12vp" + } + ] +} \ No newline at end of file diff --git a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/confirmDialog.ets b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/confirmDialog.ets index 1142f3d7..e68de8df 100644 --- a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/confirmDialog.ets +++ b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/confirmDialog.ets @@ -15,6 +15,9 @@ import Constants from '../../common/constants'; import Log from '../../../../../../../../../../common/src/main/ets/default/Log'; +import deviceInfo from '@ohos.deviceInfo'; + +const deviceTypeInfo = deviceInfo.deviceType; const TAG = 'NoticeItem-Confirm'; @@ -30,53 +33,61 @@ export default struct ConfirmDialog { build() { Column() { - Row() { - Text(this.title) - .fontSize($r('app.float.confirm_title_fontsize')) - .fontWeight(FontWeight.Bold) - }.width($r('app.float.confirm_dialog_row_width')) - .margin({ top: $r('app.float.title_font_margin_t') }) + Column() { + Row() { + Text(this.title) + .fontSize($r('app.float.confirm_title_fontsize')) + .fontWeight(FontWeight.Bold) + }.width($r('app.float.confirm_dialog_row_width')) + .margin({ top: $r('app.float.title_font_margin_t') }) - Row() { - Text($r('app.string.confirm_message', this.bundleName)) - .fontSize($r('app.float.confirm_cont_fontsize')) - }.width($r('app.float.confirm_dialog_row_width')) - .margin({ top: $r('app.float.message_font_margin_t') }) - - Row() { - Column() { - Text($r('app.string.cancel')) + Row() { + Text($r('app.string.confirm_message', this.bundleName)) .fontSize($r('app.float.confirm_cont_fontsize')) - .fontColor(Color.Blue) - }.onClick(() => { - this.controller.close(); - }) - .alignItems(HorizontalAlign.Center) - .width($r('app.float.confirm_dialog_button_width')) + }.width($r('app.float.confirm_dialog_row_width')) + .margin({ top: $r('app.float.message_font_margin_t') }) - Divider() - .vertical(true) - .color($r('app.color.confirm_divider_color')) - .strokeWidth(1) - .height($r('app.float.confirm_divider_height')) - Column() { - Text($r('app.string.close')) - .fontSize($r('app.float.confirm_cont_fontsize')) - .fontColor(Color.Red) - }.onClick(() => { - Log.showInfo(TAG, `confirm button of TimeDialog on click`); - this.controller.close(); - this.action(); - }) - .alignItems(HorizontalAlign.Center) - .width($r('app.float.confirm_dialog_button_width')) + Flex({ justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) { + Column() { + Text($r('app.string.cancel')) + .fontSize($r('app.float.confirm_cont_fontsize')) + .fontColor($r("app.color.button_text_color")) + }.onClick(() => { + this.controller.close(); + }) + .alignItems(HorizontalAlign.Center) + .width($r('app.float.confirm_dialog_button_width')) + + Divider() + .vertical(true) + .color($r('app.color.confirm_divider_color')) + .strokeWidth(1) + .height($r('app.float.confirm_divider_height')) + Column() { + Text($r('app.string.close')) + .fontSize($r('app.float.confirm_cont_fontsize')) + .fontColor($r("app.color.button_text_color")) + }.onClick(() => { + Log.showInfo(TAG, `confirm button of TimeDialog on click`) + this.controller.close(); + this.action(); + }) + .alignItems(HorizontalAlign.Center) + .width($r('app.float.confirm_dialog_button_width')) + } + .width($r('app.float.confirm_dialog_width')) + .margin({ top: $r('app.float.confirm_button_margin_t') }) } - .width($r('app.float.confirm_dialog_width')) - .margin({ top: $r('app.float.confirm_button_margin_t') }) - }.height($r('app.float.confirm_dialog_height')) - .width($r('app.float.confirm_dialog_width')) - .backgroundColor('#FFFFFFFF') - .border({ width: $r('app.float.setting_border_width'), color: Color.White, - radius: $r('app.float.notification_border_radius') }) + .height($r('app.float.confirm_dialog_height')) + .width(deviceTypeInfo === 'phone' ? '100%' : $r('app.float.confirm_dialog_width')) + .backgroundColor('#FFFFFF') + .border({ width: $r('app.float.setting_border_width'), color: Color.White, + radius: $r('app.float.notification_border_radius') }) + } + .margin({ + left: $r("app.float.confirm_dialog_margin"), + right: $r("app.float.confirm_dialog_margin") + }) + } } diff --git a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/devicesDialog.ets b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/devicesDialog.ets index 7806c45e..d66b2c4d 100644 --- a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/devicesDialog.ets +++ b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/devicesDialog.ets @@ -85,7 +85,7 @@ export default struct DevicesDialog { Column() { Text($r('app.string.cancel')) .fontSize($r('app.float.device_button_font')) - .fontColor(Color.Blue) + .fontColor($r("app.color.button_text_color")) }.onClick(() => { this.controller.close(); diff --git a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/generalItem.ets b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/generalItem.ets index ebb4dce6..78d97610 100644 --- a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/generalItem.ets +++ b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/generalItem.ets @@ -13,7 +13,7 @@ * limitations under the License. */ -import Constants, {NotificationLayout as Layout} from '../../common/constants'; +import Constants, { NotificationLayout as Layout } from '../../common/constants'; import basicItem from './basicItem'; import longItem from './longItem'; import multiItem from './multiItem'; @@ -138,6 +138,7 @@ struct ContentComponent { .objectFit(ImageFit.Contain) .width(Layout.NOTIFICATION_PIC_SIZE) .height(Layout.NOTIFICATION_PIC_SIZE) + .borderRadius($r("app.float.notice_image_boderRadius")) } }.margin({ left: Layout.ITEM_MARGIN, right: Layout.ITEM_MARGIN }) } diff --git a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/groupItem.ets b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/groupItem.ets index 76655aad..e86cec27 100644 --- a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/groupItem.ets +++ b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/groupItem.ets @@ -14,10 +14,10 @@ */ import Log from '../../../../../../../../../../common/src/main/ets/default/Log'; -import Constants, {NotificationLayout as Layout} from '../../common/constants'; +import Constants, { NotificationLayout as Layout } from '../../common/constants'; import NotificationItem from './notificationItem' import titleItem from './titleItem'; -import IconListComponent, {getIconListSize} from './iconListComponent'; +import IconListComponent, { getIconListSize } from './iconListComponent'; import ScrollbarManager from '../../common/ScrollbarManager'; const TAG = 'NoticeItem-GroupItem'; @@ -62,6 +62,9 @@ export default struct GroupItem { }.backgroundColor($r('app.color.notificationitem_background')) .width(Constants.FULL_CONTAINER_WIDTH) + if (this.toExpand) { + Row().height($r("app.float.notice_divider")).width('100%') + } Row() { ContentList({ groupData: this.groupData, toExpand: this.toExpand }) }.width(Constants.FULL_CONTAINER_WIDTH) diff --git a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/iconListComponent.ets b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/iconListComponent.ets index 08faebbc..83d5f7b9 100644 --- a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/iconListComponent.ets +++ b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/iconListComponent.ets @@ -13,12 +13,14 @@ * limitations under the License. */ -import Constants, {NotificationLayout as Layout} from '../../common/constants'; +import Constants, { NotificationLayout as Layout } from '../../common/constants'; import Log from '../../../../../../../../../../common/src/main/ets/default/Log'; import SettingDialog from './settingDialog'; import ConfirmDialog from './confirmDialog' import ViewModel from '../../viewmodel/ViewModel'; +import deviceInfo from '@ohos.deviceInfo'; +const deviceTypeInfo = deviceInfo.deviceType; const TAG = 'NoticeItem-IconListComponent'; let iconSize: number = 0; @@ -47,8 +49,9 @@ export default struct IconListComponent { action: () => this.confirmDialogController.open() }), autoCancel: false, + alignment: deviceTypeInfo === 'phone' ? DialogAlignment.Bottom : DialogAlignment.Default, offset: { dx: 0, dy: $r('app.float.setting_dialog_dy') }, - customStyle:true + customStyle: true }); private confirmDialogController: CustomDialogController = new CustomDialogController({ builder: ConfirmDialog({ @@ -57,8 +60,9 @@ export default struct IconListComponent { action: () => ViewModel.enableNotification(this.itemData, false) }), autoCancel: false, + alignment: deviceTypeInfo === 'phone' ? DialogAlignment.Bottom : DialogAlignment.Default, offset: { dx: 0, dy: $r('app.float.confirm_dialog_dy') }, - customStyle:true + customStyle: true }); private iconConfigs: IconData[] = [ { diff --git a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/settingDialog.ets b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/settingDialog.ets index 5732777a..4a38a934 100644 --- a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/settingDialog.ets +++ b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/settingDialog.ets @@ -13,12 +13,15 @@ * limitations under the License. */ -import Constants, {NotificationItemData} from '../../common/constants'; +import Constants, { NotificationItemData } from '../../common/constants'; import Log from '../../../../../../../../../../common/src/main/ets/default/Log'; import CheckEmptyUtils from '../../../../../../../../../../common/src/main/ets/default/CheckEmptyUtils'; import EventManager from "../../../../../../../../../../common/src/main/ets/default/event/EventManager" -import {obtainStartAbility} from "../../../../../../../../../../common/src/main/ets/default/event/EventUtil" +import { obtainStartAbility } from "../../../../../../../../../../common/src/main/ets/default/event/EventUtil" import Notification from '@ohos.notification'; +import deviceInfo from '@ohos.deviceInfo'; + +const deviceTypeInfo = deviceInfo.deviceType; const TAG = 'NoticeItem-Setting'; @@ -32,79 +35,87 @@ export default struct SettingDialog { public action: () => void build() { - Column({ space: 4 }) { - Row({ space: 4 }) { - if (!CheckEmptyUtils.isEmpty(this.itemData.smallIcon)) { - Image(this.itemData.smallIcon) - .objectFit(ImageFit.Contain) - .width($r('app.float.title_image_width')) - .height($r('app.float.title_image_height')) + Column() { + Column({ space: 4 }) { + Row({ space: 4 }) { + if (!CheckEmptyUtils.isEmpty(this.itemData.smallIcon)) { + Image(this.itemData.smallIcon) + .objectFit(ImageFit.Contain) + .width($r('app.float.title_image_width')) + .height($r('app.float.title_image_height')) + } + Text(this.itemData.appName) + .fontSize($r('app.float.setting_title_fontsize')) + .fontWeight(500) + }.width($r('app.float.setting_dialog_row_width')) + .margin({ top: $r('app.float.notification_appname_margin_top') }) + .height($r('app.float.title_font_height')) + + Row() { + Column() { + Text($r('app.string.closeNotification')) + .fontSize($r('app.float.setting_cont_fontsize')) + .fontColor($r('app.color.dialog_font_color')) + .height($r('app.float.setting_dialog_row_height')) + }.alignItems(HorizontalAlign.Center) + .width(Constants.SETTING_CONTENT_WITH) } - Text(this.itemData.appName) - .fontSize($r('app.float.setting_title_fontsize')) - .fontWeight(500) - }.width($r('app.float.setting_dialog_row_width')) - .margin({ top: $r('app.float.notification_appname_margin_top') }) - .height($r('app.float.title_font_height')) - - Row() { - Column() { - Text($r('app.string.closeNotification')) - .fontSize($r('app.float.setting_cont_fontsize')) - .fontColor($r('app.color.dialog_font_color')) - .height($r('app.float.setting_dialog_row_height')) - }.alignItems(HorizontalAlign.Center) - .width(Constants.SETTING_CONTENT_WITH) - } - .width($r('app.float.setting_dialog_row_width')) - .alignItems(VerticalAlign.Center) - .align(Alignment.Center) - .margin({ top: $r('app.float.close_notification_margin_top') }) - .border({ width: $r('app.float.setting_border_width'), color: Color.White, - radius: $r('app.float.setting_border_radius') }) - .backgroundColor($r('app.color.dialog_font_back_color')) - .onClick(this.closeNotification.bind(this)) - - Row() { - Column() { - Text($r('app.string.moreSettings')) - .fontSize($r('app.float.setting_cont_fontsize')) - .fontColor($r('app.color.dialog_font_back_color')) - .height($r('app.float.setting_dialog_row_height')) - }.alignItems(HorizontalAlign.Center) - .width(Constants.SETTING_CONTENT_WITH) + .width($r('app.float.setting_dialog_row_width')) + .alignItems(VerticalAlign.Center) .align(Alignment.Center) - } - .width($r('app.float.setting_dialog_row_width')) - .alignItems(VerticalAlign.Center) - .border({ width: $r('app.float.setting_border_width'), color: Color.White, - radius: $r('app.float.setting_border_radius') }) - .backgroundColor($r('app.color.action_button_click_color')) - .onClick(this.openAbility.bind(this)) + .margin({ top: $r('app.float.close_notification_margin_top') }) + .border({ width: $r('app.float.setting_border_width'), color: Color.White, + radius: $r('app.float.setting_border_radius') }) + .backgroundColor($r('app.color.dialog_font_back_color')) + .onClick(this.closeNotification.bind(this)) - Row() { - Column() { - Text($r('app.string.cancel')) - .maxLines(Constants.DEFAULT_MAX_LINES) - .textOverflow({ overflow: TextOverflow.Ellipsis }) - .fontSize($r('app.float.setting_cont_fontsize')) - .fontColor($r('app.color.dialog_font_back_color')) - }.alignItems(HorizontalAlign.Center) - .width(Constants.SETTING_CONTENT_WITH) + Row() { + Column() { + Text($r('app.string.moreSettings')) + .fontSize($r('app.float.setting_cont_fontsize')) + .fontColor($r('app.color.button_text_color')) + .height($r('app.float.setting_dialog_row_height')) + }.alignItems(HorizontalAlign.Center) + .width(Constants.SETTING_CONTENT_WITH) + .align(Alignment.Center) + } + .width($r('app.float.setting_dialog_row_width')) + .alignItems(VerticalAlign.Center) + .border({ width: $r('app.float.setting_border_width'), color: Color.White, + radius: $r('app.float.setting_border_radius') }) + .backgroundColor($r('app.color.action_button_click_color')) + .onClick(this.openAbility.bind(this)) + + Row() { + Column() { + Text($r('app.string.cancel')) + .maxLines(Constants.DEFAULT_MAX_LINES) + .textOverflow({ overflow: TextOverflow.Ellipsis }) + .fontSize($r('app.float.setting_cont_fontsize')) + .fontColor($r('app.color.button_text_color')) + }.alignItems(HorizontalAlign.Center) + .width(Constants.SETTING_CONTENT_WITH) + } + .width($r('app.float.setting_dialog_row_width')) + .margin({ top: $r('app.float.notification_cancle_margin_top') }) + .alignItems(VerticalAlign.Center) + .align(Alignment.Center) + .border({ width: $r('app.float.setting_border_width'), color: Color.White, + radius: $r('app.float.setting_border_radius') }) + .backgroundColor($r('app.color.dialog_font_color')) + .onClick(this.closeAbility.bind(this)) } - .width($r('app.float.setting_dialog_row_width')) - .margin({ top: $r('app.float.notification_cancle_margin_top') }) - .alignItems(VerticalAlign.Center) - .align(Alignment.Center) + .height($r('app.float.setting_dialog_height')) + .width(deviceTypeInfo === 'phone' ? '100%' : $r('app.float.setting_dialog_width')) + .backgroundColor('#FFFFFF') + .margin({ left: 20, right: 20 }) .border({ width: $r('app.float.setting_border_width'), color: Color.White, - radius: $r('app.float.setting_border_radius') }) - .backgroundColor($r('app.color.dialog_font_color')) - .onClick(this.closeAbility.bind(this)) - }.height($r('app.float.setting_dialog_height')) - .width($r('app.float.setting_dialog_width')) - .backgroundColor('#FFFFFFFF') - .border({ width: $r('app.float.setting_border_width'), color: Color.White, - radius: $r('app.float.notification_border_radius') }) + radius: $r('app.float.notification_border_radius') }) + } + .margin({ + left: $r("app.float.confirm_dialog_margin"), + right: $r("app.float.confirm_dialog_margin") + }) } closeNotification() { diff --git a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/titleItem.ets b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/titleItem.ets index cf98da15..a1dc9f35 100644 --- a/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/titleItem.ets +++ b/features/noticeitem/src/main/ets/com/ohos/noticeItem/view/item/titleItem.ets @@ -13,7 +13,7 @@ * limitations under the License. */ -import Constants, {NotificationLayout as Layout} from '../../common/constants'; +import Constants, { NotificationLayout as Layout } from '../../common/constants'; import Log from '../../../../../../../../../../common/src/main/ets/default/Log'; import CheckEmptyUtils from '../../../../../../../../../../common/src/main/ets/default/CheckEmptyUtils'; diff --git a/features/noticeitem/src/main/resources/base/element/color.json b/features/noticeitem/src/main/resources/base/element/color.json index da334c07..974d5c02 100644 --- a/features/noticeitem/src/main/resources/base/element/color.json +++ b/features/noticeitem/src/main/resources/base/element/color.json @@ -2,7 +2,7 @@ "color": [ { "name":"notificationitem_background", - "value":"#ffffffff" + "value":"#8CFAFAFA" }, { "name":"title_text_color", @@ -50,7 +50,11 @@ }, { "name": "device_divider_color", - "value": "#E3E3E3" + "value": "transparent" + }, + { + "name": "button_text_color", + "value": "#007DFF" } ] } \ No newline at end of file diff --git a/features/noticeitem/src/main/resources/base/element/float.json b/features/noticeitem/src/main/resources/base/element/float.json index 243d6b67..06db5cb7 100644 --- a/features/noticeitem/src/main/resources/base/element/float.json +++ b/features/noticeitem/src/main/resources/base/element/float.json @@ -164,6 +164,10 @@ "name": "confirm_button_height", "value": "60" }, + { + "name": "confirm_dialog_margin", + "value": "0" + }, { "name": "confirm_button_margin_t", "value": "50vp" @@ -215,6 +219,14 @@ { "name": "device_margin_16", "value": "16fp" + }, + { + "name": "notice_image_boderRadius", + "value": "0" + }, + { + "name": "notice_divider", + "value": "1vp" } ] } \ No newline at end of file diff --git a/features/noticeitem/src/main/resources/phone/element/color.json b/features/noticeitem/src/main/resources/phone/element/color.json new file mode 100644 index 00000000..23f6370e --- /dev/null +++ b/features/noticeitem/src/main/resources/phone/element/color.json @@ -0,0 +1,12 @@ +{ + "color": [ + { + "name": "button_text_color", + "value": "#007DFF" + }, + { + "name":"dialog_font_back_color", + "value":"#007DFF" + } + ] +} \ No newline at end of file diff --git a/features/noticeitem/src/main/resources/phone/element/float.json b/features/noticeitem/src/main/resources/phone/element/float.json new file mode 100644 index 00000000..ebf3f0f5 --- /dev/null +++ b/features/noticeitem/src/main/resources/phone/element/float.json @@ -0,0 +1,124 @@ +{ + "float": [ + { + "name": "title_image_width", + "value": "24vp" + }, + { + "name": "title_image_height", + "value": "24vp" + }, + { + "name": "title_font_height", + "value": "28vp" + }, + { + "name": "title_font_margin_t", + "value": "11vp" + }, + { + "name": "message_font_margin_t", + "value": "17.65vp" + }, + { + "name": "setting_title_fontsize", + "value": "20vp" + }, + { + "name": "setting_cont_fontsize", + "value": "16vp" + }, + { + "name": "setting_border_width", + "value": "0.5vp" + }, + { + "name": "setting_border_radius", + "value": "24vp" + }, + { + "name": "setting_dialog_height", + "value": "192vp" + }, + { + "name": "setting_dialog_width", + "value": "336vp" + }, + { + "name": "setting_dialog_row_width", + "value": "304vp" + }, + { + "name": "setting_dialog_row_height", + "value": "40vp" + }, + { + "name": "confirm_dialog_height", + "value": "142vp" + }, + { + "name": "confirm_dialog_width", + "value": "336vp" + }, + { + "name": "confirm_dialog_margin", + "value": "12vp" + }, + { + "name": "confirm_dialog_row_width", + "value": "288vp" + }, + { + "name": "confirm_dialog_button_width", + "value": "127.59vp" + }, + { + "name": "confirm_title_fontsize", + "value": "20vp" + }, + { + "name": "confirm_cont_fontsize", + "value": "16vp" + }, + { + "name": "confirm_divider_height", + "value": "22vp" + }, + { + "name": "confirm_button_height", + "value": "30vp" + }, + { + "name": "confirm_button_margin_t", + "value": "25vp" + }, + { + "name": "setting_dialog_dy", + "value": "-12vp" + }, + { + "name": "confirm_dialog_dy", + "value": "-12vp" + }, + { + "name": "notification_appname_margin_top", + "value": "11vp" + }, + { + "name": "close_notification_margin_top", + "value": "17vp" + }, + { + "name": "notification_cancle_margin_top", + "value": "13.28vp" + }, + { + "name": "notice_image_boderRadius", + "value": "12vp" + }, + { + "name": "notice_divider", + "value": "1vp" + } + ] +} \ No newline at end of file diff --git a/product/default/notificationmanagement/src/main/ets/pages/batchSetEnable.ets b/product/default/notificationmanagement/src/main/ets/pages/batchSetEnable.ets index 80d2b369..4d24c308 100644 --- a/product/default/notificationmanagement/src/main/ets/pages/batchSetEnable.ets +++ b/product/default/notificationmanagement/src/main/ets/pages/batchSetEnable.ets @@ -28,7 +28,7 @@ const TAG = 'NotificationManagement-BatchSetEnable'; export default struct BatchSetEnable { @State mViewModel: ViewModel = new ViewModel(); @StorageLink('appManagementList') appList: any[]= []; - @State headName:Resource = $r('app.string.notificationManagement') + @State headName:Resource = $r('app.string.batch_Management') build() { Column() { @@ -58,7 +58,7 @@ export default struct BatchSetEnable { } .divider({ strokeWidth: 1, - color: $r('app.color.background_color'), + color: $r('app.color.divider_color'), startMargin: $r('app.float.divider_margin_l_info'), endMargin: $r('app.float.divider_margin_r') }) diff --git a/product/default/notificationmanagement/src/main/ets/pages/noDisturbPre.ets b/product/default/notificationmanagement/src/main/ets/pages/noDisturbPre.ets index de148a55..ee399db0 100644 --- a/product/default/notificationmanagement/src/main/ets/pages/noDisturbPre.ets +++ b/product/default/notificationmanagement/src/main/ets/pages/noDisturbPre.ets @@ -28,7 +28,7 @@ const TAG = 'NotificationManagement-NoDisturbPre'; @Component export default struct notificationManagenment { @State columnMargin: string = '24vp'; - @State headName: Resource = $r('app.string.notificationManagement') + @State headName: Resource = $r('app.string.noDisturb') @State refreshRequest: number= 0 build() { @@ -45,8 +45,12 @@ export default struct notificationManagenment { Row() { Text($r('app.string.timing_on')) .fontSize($r('app.float.page_phrases_font')) - .margin({top:$r('app.float.page_phrases_padding_t')}) + .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .fontWeight(FontWeight.Medium) + .fontFamily('HarmonyHeiTi-Medium') + .margin({ top: $r('app.float.page_phrases_padding_t') }) } + .align(Alignment.Start) .width(ConfigData.WH_100_100) .height($r('app.float.page_phrases_height')) .padding({ left: $r('sys.float.ohos_id_default_padding_start') }) @@ -58,7 +62,8 @@ export default struct notificationManagenment { .onClick(() => { Log.showInfo(TAG, `NoDisturbComponent on click`) Router.push({ uri: 'pages/noDisturb' }); - }).width(ConfigData.WH_100_100) + }) + .width(ConfigData.WH_100_100) .backgroundColor(Color.White) .border({ width: $r('app.float.border_width'), color: Color.White, radius: $r('app.float.border_radius') }) diff --git a/product/default/notificationmanagement/src/main/ets/pages/notificationManagenment.ets b/product/default/notificationmanagement/src/main/ets/pages/notificationManagenment.ets index bd0cfeb3..d3c21a93 100644 --- a/product/default/notificationmanagement/src/main/ets/pages/notificationManagenment.ets +++ b/product/default/notificationmanagement/src/main/ets/pages/notificationManagenment.ets @@ -75,11 +75,15 @@ export default struct notificationManagenment { .fontSize($r('sys.float.ohos_id_text_size_body1')) .fontColor($r('app.color.itemComp_title_color')) .align(Alignment.End) + .margin({ right: $r("app.float.noDisturb_text_margin_right") }) + .fontWeight(FontWeight.Medium) } else { Text($r('app.string.noDisturb_closed')) .fontSize($r('sys.float.ohos_id_text_size_body1')) .fontColor($r('app.color.itemComp_title_color')) .align(Alignment.End) + .margin({ right: $r("app.float.noDisturb_text_margin_right") }) + .fontWeight(FontWeight.Medium) } Image($r('app.media.ic_settings_arrow')) .align(Alignment.End) @@ -103,11 +107,18 @@ export default struct notificationManagenment { .onClick(() => { Log.showInfo(TAG, `NoDisturbComponent on click`) Router.push({ uri: 'pages/noDisturbPre' }); - }).width(ConfigData.WH_100_100) + }) + .width(ConfigData.WH_100_100) .flexShrink(0) + Column() { Divider().color($r('app.color.divider_color')).strokeWidth(1) - }.padding({ left: $r('sys.float.ohos_id_default_padding_start'),right:$r('sys.float.ohos_id_default_padding_end') }) + } + .padding({ + left: $r('sys.float.ohos_id_default_padding_start'), + right: $r('sys.float.ohos_id_default_padding_end') + }) + Row() { Row() { SwitchComponent({ @@ -123,19 +134,19 @@ export default struct notificationManagenment { .backgroundColor(Color.White) .border({ width: $r('app.float.border_width'), color: Color.White, radius: $r('app.float.border_radius') }) - .margin({top:$r('app.float.page_notice_title_margin_t')}); + .margin({ top: $r('app.float.page_notice_title_margin_t') }); Row() { Text($r('app.string.notificationManagement')) .fontColor($r('sys.color.ohos_id_color_text_secondary')) .fontSize($r('sys.float.ohos_id_text_size_body2')) - .fontWeight(FontWeight.Bold) + .fontWeight(FontWeight.Medium) .fontFamily('HarmonyHeiTi-Medium') - .margin({top:$r('app.float.page_phrases_padding_t')}) + .margin({ top: $r('app.float.page_phrases_padding_t') }) }.align(Alignment.Start) .width(ConfigData.WH_100_100) .height($r('app.float.page_phrases_height')) - .padding({ left: $r('sys.float.ohos_id_default_padding_start')}) + .padding({ left: $r('sys.float.ohos_id_default_padding_start') }) Row() { ItemComponent({ title: $title, value: '', arrow: $arrow }) @@ -148,8 +159,8 @@ export default struct notificationManagenment { Column() { AppLstComponent() }.width(ConfigData.WH_100_100) - .height(this.mViewModel.isPhone?$r('app.float.applist_hieght_phone'):$r('app.float.applist_hieght')) - .margin({top:$r('app.float.applist_margin_t')}); + .height(this.mViewModel.isPhone ? $r('app.float.applist_hieght_phone') : $r('app.float.applist_hieght')) + .margin({ top: $r('app.float.applist_margin_t') }); } .width(ConfigData.WH_100_100) diff --git a/product/phone/dropdownpanel/src/main/ets/pages/notification.ets b/product/phone/dropdownpanel/src/main/ets/pages/notification.ets index 3447619b..671f574d 100644 --- a/product/phone/dropdownpanel/src/main/ets/pages/notification.ets +++ b/product/phone/dropdownpanel/src/main/ets/pages/notification.ets @@ -14,8 +14,8 @@ */ import Log from '../../../../../../../common/src/main/ets/default/log' -import EventManager, {unsubscribe} from "../../../../../../../common/src/main/ets/default/event/eventmanager" -import {obtainStartAbility} from "../../../../../../../common/src/main/ets/default/event/eventutil" +import EventManager, { unsubscribe } from "../../../../../../../common/src/main/ets/default/event/eventmanager" +import { obtainStartAbility } from "../../../../../../../common/src/main/ets/default/event/eventutil" import Constants from './common/constants' import BatteryIcon from '../../../../../../../features/batterycomponent/src/main/ets/default/pages/batteryicon' import ClockIcon from '../../../../../../../features/clockcomponent/src/main/ets/default/pages/clockicon' @@ -27,16 +27,19 @@ import RingModeIcon from '../../../../../../../features/ringmodecomponent/src/ma import NotificationListComponent from '../../../../../../../features/noticeitem/src/main/ets/com/ohos/noticeitem/view/notificationlistcomponent' import ViewModel from '../../../../../../../features/noticeitem/src/main/ets/com/ohos/noticeitem/viewmodel/viewmodel' import ResourceUtil from '../../../../../../../common/src/main/ets/default/resourceutil' -import TimeManager, { TimeEventArgs, TIME_CHANGE_EVENT } from '../../../../../../../common/src/main/ets/default/timemanager' +import TimeManager, { TimeEventArgs, TIME_CHANGE_EVENT +} from '../../../../../../../common/src/main/ets/default/timemanager' const TAG = 'DropdownPanel-notification' const GRID_SIZE = 6; -const IMAGE_SIZE_L = 40; -const IMAGE_SIZE_S = 48; +const IMAGE_SIZE_L = 24; +const IMAGE_SIZE_S = 20; +const BGC_SIZE_L = 40; const NO_NOTIFICATION_TOP_MARGIN = 40; -const TIME_TEXT_MARGIN = 8; +const TIME_TEXT_MARGIN = 4; +const CENTER_TITLE_MARGIN_TOP = 12; const TIME_BOTTOM_OFFSET = 7; -const SETTING_ICON_MARGIN = 12; +const CENTER_MARGIN = 12; @Component export default struct Notification { @@ -84,13 +87,20 @@ export default struct Notification { } if (this.notificationList.length > 0) { - Image($r('app.media.delete_all')) - .width(IMAGE_SIZE_L) - .height(IMAGE_SIZE_L) - .margin({ bottom: 32 }) - .onClick(() => { - ViewModel.removeAllNotifications(); - }) + Flex({ justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) { + Image($r('app.media.ic_public_delete_filled')) + .fillColor("#FFFFFF") + .width(IMAGE_SIZE_L) + .height(IMAGE_SIZE_L) + } + .width(BGC_SIZE_L) + .height(BGC_SIZE_L) + .margin({ bottom: $r('app.float.notification_delete_all') }) + .borderRadius(BGC_SIZE_L) + .backgroundColor($r('app.color.notification_delete_all_background')) + .onClick(() => { + ViewModel.removeAllNotifications(); + }) } }.onTouch(this.touchEvent.bind(this)) } @@ -177,21 +187,22 @@ struct CenterTitle { .fontColor($r("sys.color.ohos_id_color_text_primary_contrary")) .fontSize('36fp') .fontWeight(FontWeight.Medium) - .margin({ left: TIME_TEXT_MARGIN }) + .margin({ left: CENTER_MARGIN }) Text(this.mTimeString) .fontColor($r("sys.color.ohos_id_color_text_primary_contrary")) .fontSize($r("sys.float.ohos_id_text_size_sub_title3")) .fontWeight(FontWeight.Medium) .margin({ left: TIME_TEXT_MARGIN, bottom: TIME_BOTTOM_OFFSET }) .flexGrow(1) - Image($r('app.media.ic_settings')) + Image($r("app.media.ic_public_settings")) .objectFit(ImageFit.Contain) .width(IMAGE_SIZE_S) .height(IMAGE_SIZE_S) - .margin({ right: SETTING_ICON_MARGIN, bottom: TIME_BOTTOM_OFFSET }) + .fillColor("#FFFFFF") + .margin({ right: CENTER_MARGIN, bottom: TIME_BOTTOM_OFFSET }) .onClick(this.settingClick.bind(this)) } - .margin({ top: TIME_TEXT_MARGIN, bottom: TIME_TEXT_MARGIN }) + .margin({ top: CENTER_TITLE_MARGIN_TOP, bottom: TIME_TEXT_MARGIN }) .onTouch(this.touchEvent.bind(this)) } diff --git a/product/phone/dropdownpanel/src/main/resources/base/element/color.json b/product/phone/dropdownpanel/src/main/resources/base/element/color.json index 6751f30d..ad111924 100644 --- a/product/phone/dropdownpanel/src/main/resources/base/element/color.json +++ b/product/phone/dropdownpanel/src/main/resources/base/element/color.json @@ -4,6 +4,10 @@ "name": "default_background", "value": "#4D999999" }, + { + "name": "notification_delete_all_background", + "value": "#4C000000" + }, { "name": "default_font_color", "value": "#ffffffff" diff --git a/product/phone/dropdownpanel/src/main/resources/base/element/float.json b/product/phone/dropdownpanel/src/main/resources/base/element/float.json index 8f400c91..fd8bb0cc 100644 --- a/product/phone/dropdownpanel/src/main/resources/base/element/float.json +++ b/product/phone/dropdownpanel/src/main/resources/base/element/float.json @@ -4,6 +4,10 @@ "name": "status_bar_height", "value": "48vp" }, + { + "name": "notification_delete_all", + "value": "32" + }, { "name": "quickly_setting_time_font_size", "value": "30fp" diff --git a/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_delete.svg b/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_delete.svg new file mode 100644 index 00000000..422ec497 --- /dev/null +++ b/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_delete.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_delete + + + + + + + + + + \ No newline at end of file diff --git a/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_delete_filled.svg b/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_delete_filled.svg new file mode 100644 index 00000000..9807c565 --- /dev/null +++ b/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_delete_filled.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_delete_filled + + + + + + + + + + \ No newline at end of file diff --git a/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_settings.svg b/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_settings.svg new file mode 100644 index 00000000..98a78dac --- /dev/null +++ b/product/phone/dropdownpanel/src/main/resources/base/media/ic_public_settings.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_settings + + + + + + + + + + \ No newline at end of file diff --git a/product/phone/dropdownpanel/src/main/resources/phone/element/color.json b/product/phone/dropdownpanel/src/main/resources/phone/element/color.json index 38963e6c..5de4e7cf 100644 --- a/product/phone/dropdownpanel/src/main/resources/phone/element/color.json +++ b/product/phone/dropdownpanel/src/main/resources/phone/element/color.json @@ -3,6 +3,10 @@ { "name": "default_background", "value": "#999999" + }, + { + "name": "notification_delete_all_background", + "value": "#4C000000" } ] } \ No newline at end of file diff --git a/product/phone/dropdownpanel/src/main/resources/phone/element/float.json b/product/phone/dropdownpanel/src/main/resources/phone/element/float.json new file mode 100644 index 00000000..1f5716f6 --- /dev/null +++ b/product/phone/dropdownpanel/src/main/resources/phone/element/float.json @@ -0,0 +1,8 @@ + { + "float": [ + { + "name": "notification_delete_all", + "value": "64vp" + } + ] +} \ No newline at end of file