• 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 , CheckEmptyUtils, AppItemInfo, FolderItemInfo, CardItemInfo, FolderData } from '@ohos/common';
17import { Trace } from '@ohos/common';
18import { EventConstants } from '@ohos/common';
19import { StyleConstants } from '@ohos/common';
20import { CommonConstants } from '@ohos/common';
21import { PresetStyleConstants } from '@ohos/common';
22import { AppName } from '@ohos/common/component';
23import { AppBubble } from '@ohos/common/component';
24import { UninstallDialog } from '@ohos/common/component';
25import { FormManagerDialog } from '@ohos/common/component';
26import { ResourceManager } from '@ohos/common';
27import { localEventManager } from '@ohos/common';
28import { InputMethodManager } from '@ohos/common';
29import { BigFolderModel } from '../model/BigFolderModel';
30import { BigFolderViewModel } from '../viewmodel/BigFolderViewModel';
31import { BigFolderStyleConfig } from '../common/BigFolderStyleConfig';
32import { BigFolderConstants } from '../common/constants/BigFolderConstants';
33import { BigFolderStyleConstants } from '../common/constants/BigFolderStyleConstants';
34import FolderAppListDialog from '../common/uicomponents/FolderAppListDialog';
35import BigFolderStartAppHandler from '../common/BigFolderStartAppHandler';
36import { PageDesktopViewModel } from '../../../../../../pagedesktop/src/main/ets/default/viewmodel/PageDesktopViewModel';
37
38const TAG = 'FolderOpenComponent';
39const DOUBLE_CLICK_COUNT = 2;
40
41interface FolderOpenLayoutTable {
42  id: number;
43  layout: string;
44  name: string;
45  row: number;
46  column: number;
47  checked: boolean;
48}
49
50const FOLDER_CLOSE_DELAY = 500;
51let mBigFolderViewModel: BigFolderViewModel;
52let mBigFolderStyleConfig: BigFolderStyleConfig;
53let mFolderModel: BigFolderModel;
54let mAppNameHeight = BigFolderStyleConstants.DEFAULT_APP_NAME_HEIGHT;
55let mAppItemWidth = BigFolderStyleConstants.DEFAULT_APP_ITEM_WIDTH;
56let mAppNameSize = BigFolderStyleConstants.DEFAULT_APP_NAME_SIZE;
57let mAppIconSize = BigFolderStyleConstants.DEFAULT_APP_ITEM_WIDTH;
58let mAddIconSize = BigFolderStyleConstants.DEFAULT_ADD_APP_SIZE;
59let mNameLines = PresetStyleConstants.DEFAULT_APP_NAME_LINES;
60let mIconNameMargin = PresetStyleConstants.DEFAULT_ICON_NAME_GAP;
61let mSwiperHeight = 0;
62let mGridWidth = 0;
63let mGridHeight = 0;
64let mGridPadding = 0;
65let mGridMarginTop = 0;
66let mFolderOpenTitle = 0;
67let mGridIconTopPadding = 0;
68let isPad = false;
69let mBigFolderStartAppHandler: BigFolderStartAppHandler;
70
71@Component
72export struct FolderOpenComponent {
73  @State withBlur: boolean = true;
74  @StorageLink('openFolderPageIndex') PageIndex: number = 0;
75  @StorageLink('openFolderStatus') @Watch('updateFolderData') openFolderStatus: number = BigFolderConstants.OPEN_FOLDER_STATUS_CLOSE;
76  @State overLayAlpha: number = 0.3;
77  @State isRenaming: boolean = false;
78  @StorageLink('openFolderData') mFolderInfo: FolderData = { layoutInfo: [], enterEditing: false, folderName: '', folderId: '' };
79  @State newFolderName: string = '';
80
81  aboutToAppear(): void {
82    Log.showInfo(TAG, `aboutToAppear start`);
83    mBigFolderViewModel = BigFolderViewModel.getInstance();
84    mBigFolderStartAppHandler = BigFolderStartAppHandler.getInstance();
85    this.updateStyle();
86    // Folder dialog data preloading
87    mBigFolderViewModel.getFolderAddAppList(this.mFolderInfo.folderId);
88    mBigFolderViewModel.getFolderAppList(this.mFolderInfo.folderId);
89    this.newFolderName = this.mFolderInfo.folderName;
90    Log.showInfo(TAG, `aboutToAppear end`);
91  }
92
93  private updateStyle() {
94    isPad = mBigFolderViewModel.getIsPad();
95    mBigFolderStyleConfig = mBigFolderViewModel.getFolderStyleConfig();
96    if (mBigFolderStyleConfig == null) {
97      return;
98    }
99    mAppItemWidth = mBigFolderStyleConfig.mOpenFolderAppSize;
100    mAppIconSize = mBigFolderStyleConfig.mOpenFolderIconSize;
101    mAddIconSize = mBigFolderStyleConfig.mOpenFolderAddIconSize;
102    mAppNameSize = mBigFolderStyleConfig.mOpenFolderAppNameSize;
103    mAppNameHeight = mBigFolderStyleConfig.mOpenFolderAppNameHeight;
104    mGridWidth = mBigFolderStyleConfig.mOpenFolderGridWidth;
105    mGridHeight = mBigFolderStyleConfig.mOpenFolderGridHeight;
106    mSwiperHeight = mBigFolderStyleConfig.mOpenFolderSwiperHeight;
107    mGridPadding = mBigFolderStyleConfig.mOpenFolderGridPadding;
108    mNameLines = mBigFolderStyleConfig.mNameLines;
109    mIconNameMargin = mBigFolderStyleConfig.mIconNameMargin;
110    mGridMarginTop = mBigFolderStyleConfig.mFolderOpenMargin;
111    mFolderOpenTitle = mBigFolderStyleConfig.mFolderOpenTitle;
112    mGridIconTopPadding = mBigFolderStyleConfig.mOpenFolderGridIconTopPadding;
113  }
114
115  private updateFolderData() {
116    Log.showDebug(TAG, `updateFolderData start`);
117    if (this.openFolderStatus == BigFolderConstants.OPEN_FOLDER_STATUS_STATIC) {
118      return;
119    }
120    if (this.openFolderStatus == BigFolderConstants.OPEN_FOLDER_STATUS_CLOSE) {
121      this.hideOpenFolder();
122      mBigFolderViewModel.delAddIcon(this.mFolderInfo);
123      PageDesktopViewModel.getInstance().pagingFiltering();
124      this.newFolderName = '';
125      return;
126    } else {
127      this.isRenaming = this.mFolderInfo.enterEditing;
128      this.newFolderName = this.mFolderInfo.folderName;
129      this.mFolderInfo = mBigFolderViewModel.addAddIcon(this.mFolderInfo);
130      this.showOpenFolder();
131    }
132    AppStorage.setOrCreate('openFolderStatus', BigFolderConstants.OPEN_FOLDER_STATUS_STATIC);
133    AppStorage.setOrCreate('isDraging', false);
134    Log.showDebug(TAG, `updateFolderData end`);
135  }
136
137  private hideOpenFolder() {
138    Log.showDebug(TAG, `hideOpenFolder start`);
139    this.isRenaming = false;
140    this.withBlur = false;
141    this.openFolderStatus = BigFolderConstants.OPEN_FOLDER_STATUS_CLOSE;
142    this.showAnimate(0.3, Curve.EaseOut);
143    Log.showDebug(TAG, `hideOpenFolder end`);
144  }
145
146  private showOpenFolder() {
147    this.updateStyle();
148    this.withBlur = true;
149    this.showAnimate(1, Curve.EaseIn);
150  }
151
152  private showAnimate(overLayAlpha: number, curveValue: Curve) {
153    animateTo({
154      duration: 250,
155      tempo: 0.5,
156      curve: curveValue,
157      delay: 0,
158      iterations: 1,
159      playMode: PlayMode.Normal,
160    }, () => {
161      this.overLayAlpha = overLayAlpha;
162      Trace.end(Trace.CORE_METHOD_OPEN_FOLDER);
163    })
164  }
165
166  build() {
167    Stack() {
168      if (this.withBlur) {
169        Column()
170          .blur(CommonConstants.OVERLAY_BLUR_RADIUS)
171          .width(BigFolderStyleConstants.PERCENTAGE_100)
172          .height(BigFolderStyleConstants.PERCENTAGE_100)
173      }
174
175      Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center }) {
176        Stack({ alignContent: Alignment.Center }) {
177          if (this.isRenaming) {
178            Row() {
179              TextInput({ text: this.newFolderName })
180                .maxLength(CommonConstants.FOLDER_NAME_MAX_LENGTH)
181                .caretColor(Color.White)
182                .fontColor(Color.White)
183                .fontSize(BigFolderStyleConstants.DEFAULT_OPEN_FOLDER_NAME_SIZE)
184                .fontWeight(FontWeight.Normal)
185                .layoutWeight(1)
186                .backgroundColor('rgba(255,255,255,0)')
187                .enterKeyType(EnterKeyType.Done)
188                .onSubmit((enterKey: EnterKeyType) => {
189                  Log.showDebug(TAG, `textinput done: ${enterKey} `)
190                  this.isRenaming = true;
191                  this.saveText();
192                })
193                .onChange((text: string) => {
194                  Log.showDebug(TAG, `textinput: ` + text);
195                  this.newFolderName = text;
196                })
197              Image(BigFolderStyleConstants.DEFAULT_CANCEL_APP_IMAGE)
198                .width(BigFolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE)
199                .height(BigFolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE)
200                .onClick(() => {
201                  this.newFolderName = ''
202                })
203            }
204            .height(BigFolderStyleConstants.DEFAULT_OPEN_FOLDER_TEXTAREA_HEIGHT)
205            .width(BigFolderStyleConstants.PERCENTAGE_100)
206            .borderRadius(BigFolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE)
207            .padding({
208              left: BigFolderStyleConstants.DEFAULT_BUTTON_HEIGHT,
209              right: BigFolderStyleConstants.DEFAULT_DIALOG_BOTTOM_MARGIN
210            })
211            .backgroundColor('rgba(255,255,255,0.3)')
212          } else {
213            Text(this.mFolderInfo.folderName) {
214            }
215            .fontSize(BigFolderStyleConstants.DEFAULT_OPEN_FOLDER_NAME_SIZE)
216            .fontColor(Color.White)
217            .textAlign(TextAlign.Center)
218            .maxLines(1)
219            .width(BigFolderStyleConstants.PERCENTAGE_100)
220            .onClick(() => {
221              Log.showDebug(TAG, 'title click');
222              this.isRenaming = true;
223              this.newFolderName = this.mFolderInfo.folderName
224            })
225          }
226        }
227        .margin({ top: mFolderOpenTitle })
228        .width(mGridWidth)
229        .height(mGridMarginTop)
230
231        Stack() {
232          Swiper() {
233            ForEach(this.mFolderInfo.layoutInfo, (item: AppItemInfo[]) => {
234              FolderSwiperPage({
235                mAppInfo: item,
236                isRenaming: $isRenaming,
237                newFolderName: this.newFolderName,
238                mFolderInfo: this.mFolderInfo
239              })
240            }, (item: AppItemInfo[]) => JSON.stringify(item))
241          }
242          .indicator(Indicator.dot().selectedColor(StyleConstants.DEFAULT_FONT_COLOR))
243          .onClick(() => {
244            Log.showDebug(TAG, `Swiper click`);
245            this.saveText();
246          })
247          .height(mSwiperHeight)
248          .width(mGridWidth)
249          .duration(80)
250          .index(this.PageIndex)
251          .loop(false)
252          .onChange((index) => {
253            Log.showDebug(TAG, `onChange :${index}`);
254            if (this.PageIndex !== index) {
255              this.mFolderInfo = mBigFolderViewModel.addAddIcon(this.mFolderInfo);
256              this.PageIndex = index;
257            }
258          })
259        }
260      }
261      .width(mGridWidth)
262    }
263    .width(BigFolderStyleConstants.PERCENTAGE_100)
264    .height(BigFolderStyleConstants.PERCENTAGE_100)
265    .visibility(this.openFolderStatus == BigFolderConstants.OPEN_FOLDER_STATUS_CLOSE ? Visibility.Hidden : Visibility.Visible)
266    .opacity(this.overLayAlpha)
267    .backgroundColor('rgba(0,0,0,0.25)')
268    .onClick(() => {
269      Log.showDebug(TAG, 'blank click');
270      this.saveText();
271    })
272    .onMouse((event: MouseEvent) => {
273      if (event.button == MouseButton.Right) {
274        event.stopPropagation();
275        Log.showDebug(TAG, 'onMouse MouseButton Right');
276      }
277    })
278  }
279
280  private saveText() {
281    if (this.isRenaming) {
282      this.isRenaming = false;
283      if (this.newFolderName.trim().length !=0 && this.newFolderName) {
284        this.mFolderInfo.folderName = this.newFolderName;
285        mBigFolderViewModel.modifyFolderName(this.mFolderInfo)
286      }
287    } else {
288      const contextFlag: boolean = AppStorage.get('contextMenuState') as boolean;
289      Log.showInfo(TAG, 'saveText contextFlag: ' + contextFlag);
290      if (contextFlag) {
291        AppStorage.setOrCreate('contextMenuState', false);
292      } else {
293        mBigFolderViewModel.closeFolder();
294      }
295    }
296    InputMethodManager.getInstance().stopInput();
297  }
298}
299
300@Component
301struct FolderSwiperPage {
302  @StorageLink('isDraging') isDraging: boolean = false;
303  @Link isRenaming: boolean;
304  @Prop newFolderName: string;
305  private mFolderInfo: FolderData = { layoutInfo: [], enterEditing: false, folderName: '', folderId: '' };
306  private mAppInfo: AppItemInfo[] = [];
307  private ColumnsTemplate: string = '';
308  private RowsTemplate: string = '';
309  private mGridGap = BigFolderStyleConfig.getInstance().mOpenFolderGridGap;
310  @State mBigFolderViewModel: BigFolderViewModel = mBigFolderViewModel;
311  @State appNameAdd: string = '';
312
313  aboutToAppear(): void {
314    mFolderModel = BigFolderModel.getInstance();
315    ResourceManager.getInstance().getStringByResource($r('app.string.add')).then((resName) => {
316      this.appNameAdd = resName;
317    });
318    this.updateConfig();
319  }
320
321  aboutToDisappear(): void {
322    this.folderDialogController = null;
323  }
324
325  private updateConfig() {
326    let styleConfig = mBigFolderViewModel.getFolderStyleConfig();
327    this.mGridGap = styleConfig.mOpenFolderGridGap;
328    let openFolderConfig = mFolderModel.getFolderOpenLayout() as FolderOpenLayoutTable;
329
330    let column = openFolderConfig.column as number;
331    let row = openFolderConfig.row as number;
332    this.ColumnsTemplate = '';
333    this.RowsTemplate = '';
334    for (let i = 0; i < column; i++) {
335      this.ColumnsTemplate += '1fr '
336    }
337    for (let i = 0; i < row; i++) {
338      this.RowsTemplate += '1fr '
339    }
340  }
341
342  folderDialogController: CustomDialogController | null = new CustomDialogController({
343    builder: FolderAppListDialog({
344      cancel: () => {
345      },
346      confirm: (isDestory: boolean) => {
347        if (isDestory) {
348          mBigFolderViewModel.closeFolder();
349        }
350      },
351      folderItem: AppStorage.get('openFolderData'),
352      mBigFolderViewModel: $mBigFolderViewModel
353    }),
354    customStyle: true,
355    alignment: DialogAlignment.Center,
356    cancel: () => {
357    },
358    autoCancel: true
359  })
360
361  build() {
362    Column() {
363      Grid() {
364        ForEach(this.mAppInfo, (item: AppItemInfo) => {
365          GridItem() {
366            if (item.typeId === CommonConstants.TYPE_ADD) {
367              Column() {
368                Stack({ alignContent: Alignment.Center }) {
369                  Column()
370                    .width(mAddIconSize)
371                    .height(mAddIconSize)
372                    .opacity(0.5)
373                    .borderRadius(10)
374                    .backgroundColor(Color.White)
375
376                  Image(BigFolderStyleConstants.DEFAULT_ADD_FOLDER_APP_IMAGE)
377                    .width(BigFolderStyleConstants.DEFAULT_ADD_APP_ICON_SIZE)
378                    .height(BigFolderStyleConstants.DEFAULT_ADD_APP_ICON_SIZE)
379                }.margin({ top: mGridIconTopPadding })
380
381                if (this.appNameAdd) {
382                  AppName({
383                    nameHeight: mAppNameHeight,
384                    nameSize: mAppNameSize,
385                    nameFontColor: BigFolderStyleConstants.DEFAULT_FONT_COLOR,
386                    appName: this.appNameAdd,
387                    useCache: false,
388                    nameLines: mNameLines,
389                    marginTop: mIconNameMargin
390                  })
391                }
392              }
393              .width(BigFolderStyleConstants.PERCENTAGE_100)
394              .height(BigFolderStyleConstants.PERCENTAGE_100)
395              .onClick(() => {
396                Log.showDebug(TAG, `add app to this folder`);
397                this.folderDialogController?.open();
398              })
399            } else {
400              FolderAppItem({
401                item: item,
402              })
403            }
404          }
405        }, (item: AppItemInfo) => JSON.stringify(item))
406      }
407      .margin(mGridPadding)
408      .width(mGridWidth - 2 * mGridPadding)
409      .height(mGridHeight - 2 * mGridPadding)
410      .columnsGap(this.mGridGap)
411      .rowsGap(this.mGridGap)
412      .onClick(() => {
413        Log.showDebug(TAG, 'Grid click');
414        this.saveText();
415      })
416      .columnsTemplate(this.ColumnsTemplate)
417      .rowsTemplate(this.RowsTemplate)
418    }
419    .width(mGridWidth)
420    .height(mGridHeight)
421    .borderRadius(32)
422    .borderColor(this.isDraging ? 'rgba(255,255,255,0.25)' : 'rgba(0,0,0,0)')
423    .borderWidth(2)
424    .onMouse((event: MouseEvent) => {
425      if (event.button == MouseButton.Right) {
426        event.stopPropagation();
427        Log.showDebug(TAG, 'Grid onMouse MouseButton Right');
428      }
429    })
430  }
431
432  private saveText() {
433    if (this.isRenaming) {
434      this.isRenaming = false;
435      if (this.newFolderName && this.newFolderName != this.mFolderInfo.folderName) {
436        this.mFolderInfo.folderName = this.newFolderName;
437        mBigFolderViewModel.modifyFolderName(this.mFolderInfo);
438      }
439    } else {
440      const contextFlag: boolean = AppStorage.get('contextMenuState') as boolean;
441      Log.showInfo(TAG, 'saveText contextFlag: ' + contextFlag);
442      if (contextFlag) {
443        AppStorage.setOrCreate('contextMenuState', false);
444      } else {
445        mBigFolderViewModel.closeFolder();
446      }
447    }
448    InputMethodManager.getInstance().stopInput();
449  }
450}
451
452@Component
453struct FolderAppItem {
454  @StorageLink('uninstallAppInfo') appInfo: AppItemInfo = new AppItemInfo();
455  @StorageLink('selectDesktopAppItem') selectDesktopAppItem: string = '';
456  @State item: AppItemInfo = new AppItemInfo();
457  private ColumnsTemplate: string = '';
458  private RowsTemplate: string = '';
459  private isSwappingPage = false;
460  private willCloseFolder: boolean = false;
461  private mFolderInfo: FolderData = { layoutInfo: [], enterEditing: false, folderName: '', folderId: '' };
462  private mouseClick: number = 0;
463  private dialogName: string = "";
464  private clearForm: Function = () => {};
465
466  aboutToAppear(): void  {
467    mFolderModel = BigFolderModel.getInstance();
468    ResourceManager.getInstance().getStringByResource(isPad
469      ? $r('app.string.is_delete_form') : $r('app.string.isUninstall')).then((resName) => {
470      this.dialogName = resName;
471    });
472  }
473
474  aboutToDisappear(): void {
475    this.uninstallDialogController = null;
476    this.formManagerDialogController = null;
477  }
478
479  uninstallDialogController: CustomDialogController | null = new CustomDialogController({
480    builder: UninstallDialog({
481      cancel: () => {
482      },
483      confirm: () => {
484        if (isPad) {
485          this.mFolderInfo = mBigFolderViewModel.deleteAppFromOpenFolder(this.appInfo);
486        } else {
487          mBigFolderViewModel.uninstallApp(this.appInfo.bundleName, this.appInfo.isUninstallAble);
488          if (!this.appInfo.isUninstallAble) {
489            return;
490          }
491          this.mFolderInfo = mBigFolderViewModel.deleteAppFromOpenFolder(this.appInfo);
492        }
493        mBigFolderViewModel.refreshFolder(this.mFolderInfo);
494        localEventManager.sendLocalEventSticky(EventConstants.EVENT_REQUEST_PAGEDESK_ITEM_UPDATE, null);
495      },
496      dialogName: this.dialogName,
497      dialogContent: this.appInfo.appName + ' ?',
498    }),
499    cancel: () => {
500    },
501    autoCancel: false,
502    customStyle: true
503  });
504
505  concatCacheKey(item: AppItemInfo): string {
506    if (item.appLabelId && item.bundleName && item.moduleName) {
507      return `${item.appLabelId}${item.bundleName}${item.moduleName}`;
508    }
509    return '';
510  }
511
512  formManagerDialogController: CustomDialogController | null = new CustomDialogController({
513    builder: FormManagerDialog({
514      cancel: (callback?: () => void) => {
515        // delete all form
516        if (callback != undefined) {
517          this.clearForm = callback;
518        }
519      },
520      confirm: (formCardItem: CardItemInfo) => {
521        // add form to desktop
522        Log.showDebug(TAG, `createCardToDeskTop formCardItem: ${JSON.stringify(formCardItem)}`);
523        localEventManager.sendLocalEventSticky(EventConstants.EVENT_REQUEST_PAGEDESK_FORM_ITEM_ADD, formCardItem);
524      },
525      bundleName: this.item.bundleName as string,
526      appName: PageDesktopViewModel.getInstance().getAppName(this.concatCacheKey(this.item)),
527      appLabelId: this.item.appLabelId as number
528    }),
529    cancel: this.cancelFormDialog,
530    autoCancel: false,
531    customStyle: true
532  });
533
534  cancelFormDialog() {
535    Log.showDebug(TAG, 'form manager cancel dialog');
536    this.clearForm();
537  }
538
539  closeFolderDelay() {
540    this.willCloseFolder = false;
541    setTimeout(() => {
542      this.willCloseFolder = true;
543    }, FOLDER_CLOSE_DELAY);
544  }
545
546  removeAppOutOfFolder = (appInfo: AppItemInfo) => {
547    mBigFolderViewModel.removeAppOutOfFolder(appInfo);
548  }
549
550  private launchApp() {
551    Trace.start(Trace.CORE_METHOD_START_APP_ANIMATION);
552    this.setStartAppInfo();
553    PageDesktopViewModel.getInstance().onAppDoubleClick(this.item.abilityName, this.item.bundleName, this.item.moduleName);
554  }
555
556  build() {
557    Column() {
558      Column() {
559        AppBubble({
560          iconSize: mAppIconSize,
561          nameSize: mAppNameSize,
562          nameHeight: mAppNameHeight,
563          nameFontColor: BigFolderStyleConstants.DEFAULT_FONT_COLOR,
564          appName: this.item.appName,
565          bundleName: this.item.bundleName,
566          abilityName: this.item.abilityName,
567          moduleName: this.item.moduleName,
568          appIconId: this.item.appIconId,
569          appLabelId: this.item.appLabelId,
570          badgeNumber: this.item.badgeNumber,
571          isSelect: this.selectDesktopAppItem == this.item.keyName,
572          mPaddingTop: mGridIconTopPadding,
573          menuInfo: PageDesktopViewModel.getInstance().buildMenuInfoList(this.item, this.uninstallDialogController,
574            this.formManagerDialogController, this.removeAppOutOfFolder, () => {
575              this.setStartAppInfo();
576            }),
577          nameLines: mNameLines,
578          mIconNameMargin: mIconNameMargin,
579          dragStart: () => {}
580        })
581      }
582      .width(mAppItemWidth)
583      .height(mAppItemWidth)
584      .onClick(() => {
585        Log.showDebug(TAG, 'App click');
586        this.setStartAppInfo();
587        PageDesktopViewModel.getInstance().openApplication(this.item.abilityName, this.item.bundleName, this.item.moduleName);
588      })
589      .onMouse((event: MouseEvent) => {
590        if (event.button == MouseButton.Right) {
591          event.stopPropagation();
592          Log.showDebug(TAG, `FolderAppItem onMouse MouseButton Right keyName: ${this.item.keyName}`);
593          AppStorage.setOrCreate('selectDesktopAppItem', this.item.keyName);
594        }
595      })
596      .gesture(
597      GestureGroup(GestureMode.Exclusive,
598      TapGesture()
599        .onAction((event: GestureEvent) => {
600          Log.showDebug(TAG, `tap action ${JSON.stringify(event)}`)
601          if (event.source == SourceType.Mouse) {
602            this.mouseClick++;
603            if (this.mouseClick == DOUBLE_CLICK_COUNT) {
604              Log.showDebug(TAG, 'mouse double click');
605              this.mouseClick = 0;
606              this.launchApp();
607            } else {
608              this.setStartAppInfo();
609              PageDesktopViewModel.getInstance().onAppClick(this.item.abilityName, this.item.bundleName, this.item.moduleName);
610              setTimeout(() => {
611                this.mouseClick = 0;
612              }, 300)
613            }
614          } else {
615            Log.showDebug(TAG, 'tap click');
616            this.launchApp();
617          }
618        })
619      )
620      )
621    }
622    .width(mAppItemWidth)
623    .height(mAppItemWidth)
624  }
625
626  /**
627   * set start app info
628   */
629  setStartAppInfo() {
630    if (CheckEmptyUtils.isEmpty(this.item)) {
631      Log.showError(TAG, `setStartAppInfo with item`)
632      return;
633    }
634    Log.showInfo(TAG, `app setStartAppInfo`);
635    if (AppStorage.get('deviceType') === CommonConstants.PAD_DEVICE_TYPE) {
636      AppStorage.setOrCreate('openFolderStatus', BigFolderConstants.OPEN_FOLDER_STATUS_CLOSE);
637    }
638    AppStorage.setOrCreate('startAppItemInfo', this.item);
639    mBigFolderStartAppHandler.setAppIconSize(mBigFolderStyleConfig.mOpenFolderIconSize);
640    mBigFolderStartAppHandler.setAppIconInfo();
641  }
642}
643