• 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, Trace, StyleConstants, CommonConstants, AppMenu, MenuInfo, localEventManager, EventConstants } from '@ohos/common';
17import SwiperPage from './SwiperPage';
18
19const TAG = "GridSwiper";
20const APP_INFO_REFRESH_DELAY = 1000;
21
22@Component
23export default struct GridSwiper {
24  @StorageLink('NavigationBarStatusValue') navigationBarStatusValue: boolean = false;
25  @StorageLink('isDesktopLoadFinished') desktopLoadFinished: boolean = false;
26  @Prop gridConfig: string;
27  @StorageLink('pageIndex') pageIndex: number = 0;
28  private mPageDesktopViewModel;
29  @StorageLink('appListInfo') appListInfo: {
30    appGridInfo: [[]]
31  } = { appGridInfo: [[]] };
32  private swiperController: SwiperController = new SwiperController();
33  private dialogController: CustomDialogController;
34
35  aboutToAppear(): void {
36    this.mPageDesktopViewModel.setSwiperController(this.swiperController);
37  }
38
39  aboutToDisappear(): void {
40    Log.showInfo(TAG, 'aboutToDisappear');
41  }
42
43  private buildLog(): boolean {
44    let isDesktopLoadFinished = AppStorage.Get('isDesktopLoadFinished');
45    Log.showDebug(TAG, `build start ${isDesktopLoadFinished} page ${this.pageIndex}`);
46    return isDesktopLoadFinished == true;
47  }
48
49  @Builder MenuBuilder() {
50    Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {
51      AppMenu({
52        getMenuInfoList: this.getMenu.bind(this),
53      })
54    }
55    .width(StyleConstants.CONTEXT_MENU_WIDTH)
56    .borderRadius(StyleConstants.DEFAULT_12)
57  }
58
59  private getMenu(): MenuInfo[] {
60    let menuInfoList = new Array<MenuInfo>();
61    let setting = new MenuInfo();
62    setting.menuType = CommonConstants.MENU_TYPE_FIXED
63    setting.menuImgSrc = "/common/pics/ic_public_settings.svg"
64    setting.menuText = $r('app.string.into_settings')
65    setting.onMenuClick = () => {
66      Trace.start(Trace.CORE_METHOD_START_SETTINGS);
67      this.mPageDesktopViewModel.intoSetting();
68    }
69    menuInfoList.push(setting);
70
71    let addOrDeleteBlankPage = new MenuInfo();
72    addOrDeleteBlankPage.menuType = CommonConstants.MENU_TYPE_FIXED
73    addOrDeleteBlankPage.menuImgSrc = this.mPageDesktopViewModel.getBlankPageBtnIcon()
74    addOrDeleteBlankPage.menuText = this.mPageDesktopViewModel.getBlankPageBtnStr()
75    addOrDeleteBlankPage.onMenuClick = () => {
76      this.mPageDesktopViewModel.addOrDeleteBlankPage();
77    }
78    menuInfoList.push(addOrDeleteBlankPage);
79    return menuInfoList;
80  }
81
82  itemMove(moveX: number, moveY: number){
83    const hotArea: number = 12;
84    let screenWidth: number = AppStorage.Get('screenWidth') ?? 0;
85    let screenHeight: number = AppStorage.Get('screenHeight') ?? 0;
86    const isSwappingPage: boolean = AppStorage.Get('isSwappingPage');
87    if (isSwappingPage || !screenWidth || !screenHeight) {
88      return;
89    }
90    let curPageIndex: number = AppStorage.Get('pageIndex');
91    if (moveX < hotArea && curPageIndex > 0 && moveY < screenHeight) {
92      this.mPageDesktopViewModel.showPrevious();
93      this.movingIconSwapPageDelay();
94    }
95    if (moveX > (screenWidth - hotArea) && moveY < screenHeight) {
96      let cachePageIndex = this.mPageDesktopViewModel.getGridPageCount();
97      if (curPageIndex == cachePageIndex - 1 && !this.mPageDesktopViewModel.isBlankPage()) {
98        this.mPageDesktopViewModel.addBlankPage(true);
99      } else if(curPageIndex < cachePageIndex - 1) {
100        this.mPageDesktopViewModel.showNext();
101      }
102      this.movingIconSwapPageDelay();
103    }
104  }
105
106  /**
107   * Increase delay when dragging app to other page.
108   */
109  movingIconSwapPageDelay() {
110    AppStorage.SetOrCreate('isSwappingPage', true);
111    setTimeout(() => {
112      AppStorage.SetOrCreate('isSwappingPage', false);
113    }, APP_INFO_REFRESH_DELAY);
114  }
115
116  build() {
117    Column() {
118      if (this.buildLog()) {}
119        if (this.desktopLoadFinished) {
120          Swiper(this.swiperController) {
121            ForEach(this.appListInfo.appGridInfo, (item) => {
122              if (AppStorage.Get('deviceType') == CommonConstants.DEFAULT_DEVICE_TYPE) {
123                Column() {
124                  SwiperPage({
125                    mAppListInfo: item,
126                    gridConfig: this.gridConfig,
127                    mPageDesktopViewModel: this.mPageDesktopViewModel
128                  })
129                }
130                .gesture(
131                LongPressGesture({ repeat: false })
132                  .onAction((event: GestureEvent) => {
133                    this.dialogController.open()
134                  })
135                )
136                .bindContextMenu(this.MenuBuilder, ResponseType.RightClick)
137              } else {
138                SwiperPage({
139                  mAppListInfo: item,
140                  gridConfig: this.gridConfig,
141                  mPageDesktopViewModel: this.mPageDesktopViewModel
142                })
143                  .bindContextMenu(this.MenuBuilder, ResponseType.LongPress)
144                  .bindContextMenu(this.MenuBuilder, ResponseType.RightClick)
145              }
146            })
147          }
148          .padding({
149            top: this.navigationBarStatusValue ?
150              this.mPageDesktopViewModel.getPageDesktopStyleConfig().mDesktopMarginTop :
151              this.mPageDesktopViewModel.getPageDesktopStyleConfig().mDesktopMarginTop + 0
152          })
153          .height(StyleConstants.PERCENTAGE_100)
154          .width(StyleConstants.PERCENTAGE_100)
155          .indicatorStyle({
156            selectedColor: StyleConstants.DEFAULT_FONT_COLOR
157          })
158          .loop(false)
159          .index(this.pageIndex)
160          .onChange((index) => {
161            this.pageIndex = index;
162            Log.showInfo(TAG, `swiper change to page ${index}`);
163            localEventManager.sendLocalEventSticky(EventConstants.EVENT_REQUEST_FORM_ITEM_VISIBLE, null);
164          })
165        }
166    }
167    .alignItems(HorizontalAlign.Center)
168    .justifyContent(FlexAlign.Center)
169    .height(StyleConstants.PERCENTAGE_100)
170    .width(StyleConstants.PERCENTAGE_100)
171    .onDragMove((event: DragEvent, extraParams: string) => {
172      Log.showInfo(TAG, `onDragMove event: [${event.getX()}, ${event.getY()}]`);
173      if (!AppStorage.Get('isDrag')) return;
174      if (AppStorage.Get('deviceType') === CommonConstants.DEFAULT_DEVICE_TYPE
175      || (AppStorage.Get('deviceType') !== CommonConstants.DEFAULT_DEVICE_TYPE
176      && AppStorage.Get('dragItemType') === CommonConstants.DRAG_FROM_DESKTOP)) {
177        this.itemMove(event.getX(), event.getY());
178      }
179    })
180  }
181}