• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/**
2 * Copyright (c) 2021-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 */
15
16import { Log } from '../utils/Log';
17import { MenuInfo } from '../bean/MenuInfo';
18import { StyleConstants } from '../constants/StyleConstants';
19import { CommonConstants } from '../constants/CommonConstants';
20import { ResourceManager } from '../manager/ResourceManager';
21
22const TAG = 'AppMenu';
23
24@Component
25export struct AppMenu {
26  menuInfoList: Array<MenuInfo> = new Array<MenuInfo>();
27  getMenuInfoList: Function;
28  menuMode: number = CommonConstants.MENU_UI_MODE_LIGHT;
29  fixedMenuList: Array<MenuInfo> = null;
30  dynamicMenuList: Array<MenuInfo> = null;
31  isBothTypeMenuExist: boolean = true;
32  closeMenu: Function = () => {};
33
34  aboutToAppear(): void {
35    Log.showInfo(TAG, 'aboutToAppear start');
36    if (this.getMenuInfoList) {
37      this.menuInfoList = this.getMenuInfoList();
38    }
39    this.fixedMenuList = new Array<MenuInfo>();
40    this.dynamicMenuList = new Array<MenuInfo>();
41    for (let menuInfo of this.menuInfoList) {
42      if (menuInfo.menuType == CommonConstants.MENU_TYPE_FIXED) {
43        this.fixedMenuList.push(menuInfo);
44      } else {
45        this.dynamicMenuList.push(menuInfo);
46      }
47    }
48    this.isBothTypeMenuExist = this.fixedMenuList.length > 0 && this.dynamicMenuList.length > 0;
49    AppStorage.SetOrCreate('contextMenuState', true);
50  }
51
52  aboutToDisappear(): void  {
53    Log.showInfo(TAG, 'aboutToDisappear start');
54    this.fixedMenuList = null;
55    this.dynamicMenuList = null;
56  }
57
58  build() {
59    Column() {
60      Column() {
61        ForEach(this.dynamicMenuList, (item) => {
62          Column() {
63            HorizontalMenuItem({
64              menuInfo: item,
65              menuMode: this.menuMode,
66              closeMenu: this.closeMenu
67            })
68          }
69        }, item => JSON.stringify(item))
70      }
71      .visibility(this.dynamicMenuList.length > 0 ? Visibility.Visible : Visibility.None)
72
73      if (this.isBothTypeMenuExist) {
74        Divider()
75          .vertical(false)
76          .color((this.menuMode == CommonConstants.MENU_UI_MODE_LIGHT) ? "#33000000" : "#33ffffff")
77          .strokeWidth(1)
78      }
79
80      Column() {
81        ForEach(this.fixedMenuList, (item) => {
82          Column() {
83            HorizontalMenuItem({
84              menuInfo: item,
85              menuMode: this.menuMode,
86              closeMenu: this.closeMenu
87            })
88          }
89        }, item => JSON.stringify(item))
90      }
91      .visibility(this.fixedMenuList.length > 0 ? Visibility.Visible : Visibility.None)
92    }
93    .padding({
94      top: 4,
95      bottom: 4,
96      left: 4,
97      right: 4
98    })
99    .borderRadius(StyleConstants.DEFAULT_12)
100  }
101}
102
103@Component
104struct HorizontalMenuItem {
105  @State shortcutIcon: string = StyleConstants.DEFAULT_ICON;
106  @State shortcutName: string = "";
107  private mResourceManager;
108  menuInfo: MenuInfo;
109  menuMode: number = CommonConstants.MENU_UI_MODE_LIGHT;
110  closeMenu: Function = () => {};
111
112  aboutToAppear(): void  {
113    this.mResourceManager = ResourceManager.getInstance();
114    this.updateIcon();
115    this.updateName();
116  }
117
118  public shortcutIconLoadCallback(image) {
119    this.shortcutIcon = image;
120  }
121
122  public shortcutNameLoadCallback(name) {
123    this.shortcutName = name;
124  }
125
126  public updateIcon() {
127    if (this.menuInfo.shortcutIconId != -1 && this.menuInfo.menuImgSrc != "" && this.menuInfo.menuImgSrc != null) {
128      this.mResourceManager.getAppIconWithCache(this.menuInfo.shortcutIconId, this.menuInfo.bundleName,
129        this.menuInfo.moduleName, this.shortcutIconLoadCallback.bind(this), StyleConstants.DEFAULT_ICON);
130    } else {
131      this.shortcutIconLoadCallback(this.menuInfo.menuImgSrc);
132    }
133  }
134
135  public updateName() {
136    if (this.menuInfo.shortcutLabelId != -1 && this.menuInfo.menuText != "" && this.menuInfo.menuText != null && this.mResourceManager) {
137      this.mResourceManager.getAppNameWithCache(this.menuInfo.shortcutLabelId, this.menuInfo.bundleName,
138        this.menuInfo.moduleName, this.shortcutName, this.shortcutNameLoadCallback.bind(this));
139    } else {
140      this.shortcutNameLoadCallback(this.menuInfo.menuText);
141    }
142  }
143
144  build() {
145    Row() {
146      if (this.shortcutIcon != null && this.shortcutIcon != "") {
147        Image(this.shortcutIcon)
148          .objectFit(ImageFit.Contain)
149          .height(StyleConstants.DEFAULT_20)
150          .width(StyleConstants.DEFAULT_20)
151          .margin({
152            left: 12
153          })
154      } else {
155        Image("")
156          .objectFit(ImageFit.Contain)
157          .height(StyleConstants.DEFAULT_20)
158          .width(StyleConstants.DEFAULT_20)
159          .backgroundColor('#33ffffFF')
160          .margin({
161            left: 12
162          })
163      }
164      Text(this.shortcutName)
165        .fontColor((this.menuMode == CommonConstants.MENU_UI_MODE_LIGHT) ? "#e5000000" : "#e5ffffff")
166        .fontSize(14)
167        .height(StyleConstants.DEFAULT_20)
168        .margin({
169          left: StyleConstants.DEFAULT_8
170        })
171        .textOverflow({overflow: TextOverflow.Ellipsis})
172    }
173    .alignItems(VerticalAlign.Center)
174    .borderRadius(StyleConstants.DEFAULT_ITEM_RADIUS)
175    .height(StyleConstants.DEFAULT_40)
176    .width(235)
177    .onClick(() => {
178      this.menuInfo.onMenuClick();
179      this.closeMenu();
180    })
181  }
182}