1/** 2 * Copyright (c) 2022 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15import DeviceUtil from "../utils/DeviceUtil"; 16 17/** 18 * Custom pop-up menu buttons 19 */ 20@Component 21export struct MoreMenu { 22 @StorageLink('curBp') curBp: string = 'sm' 23 @Consume menuItems:Array<any>; 24 private menuImage: Resource = $rawfile("icon/ic_public_more.svg"); 25 private placement: Placement = Placement.Bottom; 26 private defaultColor: Resource = $r("sys.color.ohos_id_color_dialog_bg"); 27 private menuText: Resource = null; 28 private menuTextColor: Resource = $r("sys.color.ohos_id_color_text_primary"); 29 30 @Builder PopupBuilder() { 31 Column() { 32 List() { 33 ForEach(this.menuItems, (item, index) => { 34 ListItem() { 35 Button({ type: ButtonType.Normal, stateEffect: item.enabled }) { 36 Text(item.value) 37 .fontSize(16) 38 .lineHeight(21) 39 .width("100%") 40 .height(48) 41 .padding({ left: 12, right: 12 }) 42 .fontWeight(FontWeight.Regular) 43 .fontColor(item.enabled ? $r("sys.color.ohos_id_color_text_primary") : 44 $r("sys.color.ohos_id_color_text_tertiary")) 45 } 46 .width("100%") 47 .height(48) 48 .borderRadius(16) 49 .backgroundColor($r("sys.color.ohos_id_color_foreground_contrary")) 50 .onClick(() => { 51 if (item.enabled) { 52 item.action(); 53 } 54 }) 55 } 56 }, item => JSON.stringify(item)) 57 } 58 .listDirection(Axis.Vertical) // Arrange Direction 59 .divider({ 60 strokeWidth: 0.5, 61 color: $r("sys.color.ohos_id_color_list_separator"), 62 startMargin: 12, 63 endMargin: 12 64 }) // Demarcation line between each row 65 .edgeEffect(EdgeEffect.Spring) // Slide to Edge Effect 66 .chainAnimation(false) // Disable linkage special effects. 67 } 68 .backgroundColor(this.defaultColor) 69 .width(this.curBp == 'lg' ? 186 : 144) 70 .borderRadius(16) 71 .padding({ top: 4, bottom: 4, left: 4, right: 4 }) 72 } 73 74 build() { 75 Column() { 76 Image(this.menuImage) 77 .width(24) 78 .height(24) 79 if (this.menuText != null) { 80 Text(this.menuText) 81 .fontSize(10) 82 .lineHeight(14) 83 .fontColor(this.menuTextColor) 84 .margin({ top: 3 }) 85 .fontSize($r("sys.float.ohos_id_text_size_caption")) 86 .fontWeight(FontWeight.Medium) 87 .fontColor($r("sys.color.ohos_id_color_toolbar_text")) 88 } 89 } 90 .bindMenu(this.PopupBuilder) 91 } 92}