• 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 { AppBubble } from './AppBubble';
18import { AppItemInfo } from '../bean/AppItemInfo';
19import { CommonConstants } from '../constants/CommonConstants';
20import { AppGridStyleConfig } from '../layoutconfig/AppGridStyleConfig';
21import { MenuInfo } from '../bean';
22
23const TAG = 'AppGrid';
24
25@Component
26export struct AppGrid {
27  @Link appGridList: Array<AppItemInfo>;
28  @Link appGridStyleConfig: AppGridStyleConfig;
29  onItemClick: Function = (event: ClickEvent, item: AppItemInfo) => {};
30  buildMenu: Function = (item: AppItemInfo):  MenuInfo[] => [];
31  @State isScroll: boolean = false;
32
33  aboutToDisappear(): void {
34  }
35
36  private getColumnsTemplate() {
37    let columnsTemplate = '';
38    for (let i = 0; i < this.appGridStyleConfig.mColumns; i++) {
39      columnsTemplate += ' 1fr';
40    }
41    return columnsTemplate;
42  }
43
44  private getRowsTemplate() {
45    let rowsTemplate = '';
46    if (this.isScroll) {
47      return rowsTemplate;
48    }
49    for (let i = 0; i < this.appGridStyleConfig.mRows; i++) {
50      rowsTemplate += ' 1fr';
51    }
52    return rowsTemplate;
53  }
54
55  build() {
56    Grid() {
57      ForEach(this.appGridList, (item: AppItemInfo) => {
58        GridItem() {
59          Column() {
60            AppBubble({
61              iconSize: this.appGridStyleConfig.mIconSize,
62              nameSize: this.appGridStyleConfig.mNameSize,
63              nameFontColor: this.appGridStyleConfig.mNameFontColor,
64              nameHeight: this.appGridStyleConfig.mNameHeight,
65              appName: item.appName,
66              bundleName: item.bundleName,
67              moduleName: item.moduleName,
68              abilityName: item.abilityName,
69              appIconId: item.appIconId,
70              appLabelId: item.appLabelId,
71              badgeNumber: item.badgeNumber,
72              menuInfo: this.buildMenu(item),
73              nameLines: this.appGridStyleConfig.mNameLines,
74              mPaddingTop: this.appGridStyleConfig.mIconMarginVertical,
75              dragStart: () => {}
76            })
77          }
78          .onClick((event: ClickEvent) => {
79            this.onItemClick(event, item);
80          })
81          .onMouse((event: MouseEvent) => {
82            Log.showInfo(TAG, `onMouse MouseType: ${event.button}`);
83            if (event.button == MouseButton.Right) {
84              event.stopPropagation();
85            }
86          })
87        }
88        .width(this.appGridStyleConfig.mAppItemSize)
89        .height(this.appGridStyleConfig.mAppItemSize)
90        .transition({ scale: { x: 0.5, y: 0.5 } })
91      }, (item: AppItemInfo) => JSON.stringify(item))
92    }
93    .columnsTemplate(this.getColumnsTemplate())
94    .rowsTemplate(this.getRowsTemplate())
95    .columnsGap(this.appGridStyleConfig.mColumnsGap)
96    .rowsGap(this.appGridStyleConfig.mRowsGap)
97  }
98}