• 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 {
17  Log,
18  Trace,
19  StyleConstants,
20  CommonConstants,
21  CloseAppManager } from '@ohos/common';
22import GridSwiper from '../common/components/GridSwiper';
23import { PageDesktopDragHandler } from '../common/PageDesktopDragHandler';
24import PageDesktopViewModel from '../viewmodel/PageDesktopViewModel';
25import { PageDesktopCloseAppHandler } from '../common/PageDesktopCloseAppHandler';
26
27let mPageDesktopViewModel: PageDesktopViewModel = null;
28const TAG = "PageDesktopLayout";
29
30@Component
31export struct PageDesktopLayout {
32  @StorageLink('workSpaceWidth') @Watch('updateDeskTopParams') workSpaceWidth: number = 0;
33  @StorageLink('workSpaceHeight') @Watch('updateDeskTopParams') workSpaceHeight: number = 0;
34  @State @Watch('updateDeskTopParams') mMargin: number = 0;
35  @State mTop: number = 0;
36  @State @Watch('changeGridConfig') gridConfig: string = '';
37  @StorageLink('menuId') menuId: number = 0;
38  private mPageDesktopDragHandler: PageDesktopDragHandler = null;
39  private isPad: boolean = false;
40  private deviceType: string = CommonConstants.DEFAULT_DEVICE_TYPE;
41  dialogController: CustomDialogController = new CustomDialogController({
42    builder: settingDialog({ cancel: this.onCancel, confirm: this.confirm, onAccept: this.onAccept }),
43    cancel: this.onCancel,
44    autoCancel: true,
45    alignment: DialogAlignment.Bottom,
46    customStyle: true
47  })
48
49  onCancel() {
50  }
51
52  onAccept() {
53    mPageDesktopViewModel.addOrDeleteBlankPage();
54  }
55
56  confirm() {
57    Trace.start(Trace.CORE_METHOD_START_SETTINGS);
58    mPageDesktopViewModel.intoSetting();
59  }
60
61  aboutToAppear(): void  {
62    this.deviceType = AppStorage.Get('deviceType');
63    this.mPageDesktopDragHandler = PageDesktopDragHandler.getInstance();
64    mPageDesktopViewModel = PageDesktopViewModel.getInstance();
65    this.gridConfig = mPageDesktopViewModel.getGridConfig().layout;
66    this.updateStyle();
67    if (this.deviceType != CommonConstants.PAD_DEVICE_TYPE) {
68      mPageDesktopViewModel.registerAppListChangeCallback();
69    }
70    CloseAppManager.getInstance().registerCloseAppHandler(new PageDesktopCloseAppHandler());
71  }
72
73  private updateStyle() {
74    mPageDesktopViewModel.setDevice(this.deviceType);
75    this.isPad = mPageDesktopViewModel.getDevice();
76    Log.showDebug(TAG, `updateStyle isPad: ${this.isPad}`);
77  }
78
79  private updateDeskTopParams() {
80    this.mMargin = PageDesktopViewModel.getInstance().getPageDesktopStyleConfig().mMargin;
81    this.mTop = PageDesktopViewModel.getInstance().getPageDesktopStyleConfig().mDesktopMarginTop;
82    Log.showDebug(TAG, `updateDeskTopParams mMargin: ${this.mMargin}, this.mTop: ${this.mTop}`);
83    if (this.mPageDesktopDragHandler != null) {
84      this.mPageDesktopDragHandler.setDragEffectArea({
85        left: this.mMargin,
86        top: this.mTop,
87        right: this.workSpaceWidth - this.mMargin,
88        bottom: PageDesktopViewModel.getInstance().getPageDesktopStyleConfig().mGridHeight + this.mTop
89      });
90    }
91  }
92
93  private changeGridConfig(): void {
94    Log.showDebug(TAG, `changeGridConfig GridConfig: ${this.gridConfig}`);
95    this.updateDeskTopParams();
96  }
97
98  private buildLog(): boolean {
99    Log.showDebug(TAG, 'build start');
100    return true;
101  }
102
103  build() {
104    GridSwiper({
105      gridConfig: this.gridConfig,
106      mPageDesktopViewModel: mPageDesktopViewModel,
107      dialogController: this.deviceType == CommonConstants.PAD_DEVICE_TYPE ? null : this.dialogController
108    })
109      .width(StyleConstants.PERCENTAGE_100)
110      .height(StyleConstants.PERCENTAGE_100)
111  }
112}
113
114@CustomDialog
115struct settingDialog {
116  @StorageLink('NavigationBarStatusValue') navigationBarStatusValue: boolean = false;
117  controller: CustomDialogController
118  cancel: () => void
119  confirm: () => void
120  onAccept: () => void
121
122  build() {
123    Stack() {
124      Column() {
125
126      }
127      .blur(40)
128      .width('100%')
129      .height(120)
130      .border({
131        radius: StyleConstants.DEFAULT_24
132      })
133
134      Column() {
135        Row() {
136          Text($r('app.string.into_settings'))
137            .fontSize(StyleConstants.DEFAULT_BADGE_FONT_SIZE)
138            .fontColor(StyleConstants.TEXT_COLOR_PRIMARY)
139        }.margin({ top: StyleConstants.DEFAULT_24, bottom: StyleConstants.DEFAULT_16 })
140
141        Flex({ alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceEvenly }) {
142          Button() {
143            Text($r('app.string.cancel'))
144              .fontSize(StyleConstants.DEFAULT_BADGE_FONT_SIZE)
145              .fontColor(StyleConstants.BUTTON_FONT_COLOR)
146          }
147          .backgroundColor(StyleConstants.DEFAULT_BG_COLOR)
148          .height(StyleConstants.DEFAULT_BUTTON_HEIGHT)
149          .width(StyleConstants.DEFAULT_BUTTON_WIDTH)
150          .onClick(() => {
151            this.cancel()
152            this.controller.close();
153          })
154
155          Divider()
156            .width(5)
157            .vertical(true)
158            .color(StyleConstants.DEFAULT_DIVIDER_COLOR)
159            .height(StyleConstants.DEFAULT_DIVIDER_HEIGHT)
160
161          Button() {
162            Text(mPageDesktopViewModel.isBlankPage() ? $r('app.string.delete_blank_page') : $r('app.string.add_blank_page'))
163              .fontSize(StyleConstants.DEFAULT_BADGE_FONT_SIZE)
164              .fontColor(StyleConstants.BUTTON_FONT_COLOR)
165          }
166          .backgroundColor(StyleConstants.DEFAULT_BG_COLOR)
167          .height(StyleConstants.DEFAULT_BUTTON_HEIGHT)
168          .width(StyleConstants.DEFAULT_BUTTON_WIDTH)
169          .onClick(() => {
170            this.controller.close();
171            this.onAccept()
172          })
173
174          Divider()
175            .width(5)
176            .vertical(true)
177            .color(StyleConstants.DEFAULT_DIVIDER_COLOR)
178            .height(StyleConstants.DEFAULT_DIVIDER_HEIGHT)
179
180          Button() {
181            Text($r('app.string.launcher_edit'))
182              .fontSize(StyleConstants.DEFAULT_BADGE_FONT_SIZE)
183              .fontColor(StyleConstants.BUTTON_FONT_COLOR)
184          }
185          .backgroundColor(StyleConstants.DEFAULT_BG_COLOR)
186          .height(StyleConstants.DEFAULT_BUTTON_HEIGHT)
187          .width(StyleConstants.DEFAULT_BUTTON_WIDTH)
188          .onClick(() => {
189            this.confirm()
190            this.controller.close();
191
192          })
193        }
194      }
195      .backgroundColor(Color.White)
196      .opacity(0.85)
197      .width('100%')
198      .padding({
199        bottom: StyleConstants.DEFAULT_24
200      })
201      .border({
202        radius: StyleConstants.DEFAULT_24
203      })
204    }
205    .margin({ right: StyleConstants.DEFAULT_12, left: StyleConstants.DEFAULT_12,
206      bottom: this.navigationBarStatusValue ? StyleConstants.DEFAULT_12 : StyleConstants.DEFAULT_40 })
207  }
208}