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