• 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 '@ohos/common';
17import { FormModel } from '@ohos/common';
18import { windowManager } from '@ohos/common';
19import { localEventManager } from '@ohos/common';
20import { StyleConstants } from '@ohos/common';
21import { EventConstants } from '@ohos/common';
22
23const TAG = 'FormManagerComponent';
24
25/**
26 * Form manager view  Component (phone adaptation).
27 */
28@Component
29export struct FormManagerComponent {
30  @StorageLink('formAppInfo') formAppInfo: any = {};
31  @StorageLink('formMgrItem') formItem: any = [];
32  @State allowUpdate: boolean = true;
33  @State chooseCardId: number = -1;
34  private mSwiperController: SwiperController = new SwiperController();
35  private mFormModel: FormModel;
36  private mSwiperIndex: number = 0;
37  private mFormIdList: number[] = [];
38  private mFormComponentWidth: number[] =
39    [StyleConstants.FORM_MGR_FORM_SIZE * StyleConstants.DPI_RATIO / 2,
40    StyleConstants.FORM_MGR_FORM_SIZE * StyleConstants.DPI_RATIO / 2,
41    StyleConstants.FORM_MGR_FORM_SIZE * StyleConstants.DPI_RATIO,
42    StyleConstants.FORM_MGR_FORM_SIZE * StyleConstants.DPI_RATIO];
43  private mFormComponentHeight: number[] =
44    [StyleConstants.FORM_MGR_FORM_SIZE * StyleConstants.DPI_RATIO / 4,
45    StyleConstants.FORM_MGR_FORM_SIZE * StyleConstants.DPI_RATIO / 2,
46    StyleConstants.FORM_MGR_FORM_SIZE * StyleConstants.DPI_RATIO / 2,
47    StyleConstants.FORM_MGR_FORM_SIZE * StyleConstants.DPI_RATIO];
48
49  aboutToAppear(): void {
50    this.chooseCardId = -1;
51    this.mFormModel = FormModel.getInstance();
52    Log.showInfo(TAG, `aboutToAppear formAppInfo: ${JSON.stringify(this.formAppInfo)}`);
53    this.getCurrentFormInfo();
54  }
55
56  aboutToDisappear(): void {
57    if (this.chooseCardId !== -1) {
58      this.clearNoUseFormById();
59    } else {
60      this.clearAllFormById();
61    }
62    delete this.mSwiperController;
63    this.mSwiperController = null;
64  }
65
66  /**
67   * Get current form information by bundle name.
68   */
69  private async getCurrentFormInfo() {
70    this.mFormModel.getFormsInfoByBundleName(this.formAppInfo.bundleName);
71  }
72
73  /**
74   * Get choose card info from current form information.
75   *
76   * @return {any} formCardItem
77   */
78  private getChooseCard() {
79    this.chooseCardId = this.mFormIdList[this.mSwiperIndex];
80    let formCardItem: any = {};
81    formCardItem.id = this.mFormIdList[this.mSwiperIndex];
82    let count = 0;
83    let isStop = false;
84    for (let i = 0; i < this.formItem.length; i++) {
85      if (isStop) break;
86      for (let j = 0; j < this.formItem[i].supportDimensions.length; j++) {
87        if (count === this.mSwiperIndex) {
88          formCardItem.name = this.formItem[i].cardName;
89          formCardItem.bundleName = this.formItem[i].bundleName;
90          formCardItem.abilityName = this.formItem[i].abilityName;
91          formCardItem.moduleName = this.formItem[i].moduleName;
92          formCardItem.dimension = this.formItem[i].supportDimensions[j];
93          formCardItem.formConfigAbility = this.formItem[i].formConfigAbility;
94          formCardItem.appLabelId = this.formAppInfo.appLabelId;
95          isStop = true;
96          break;
97        }
98        count++;
99      }
100    }
101    return formCardItem;
102  }
103
104  /**
105   * Keep the form which be added to the desktop, and delete the remaining forms.
106   */
107  private clearNoUseFormById(): void {
108    let id = this.mFormIdList[this.mSwiperIndex];
109    for (let i = 0; i < this.mFormIdList.length; i++) {
110      if (i != this.mSwiperIndex) {
111        this.mFormModel.deleteFormByFormID(this.mFormIdList[i]);
112      }
113    }
114  }
115
116  /**
117   * Delete all form by id.
118   */
119  private clearAllFormById(): void {
120    for (let i = 0; i < this.mFormIdList.length; i++) {
121      this.mFormModel.deleteFormByFormID(this.mFormIdList[i]);
122    }
123  }
124
125  build() {
126    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
127      Row() {
128        Image(StyleConstants.DEFAULT_FORM_MGR_BACK_IMAGE)
129          .width(StyleConstants.FORM_MGR_BACK_ICON_WIDTH * StyleConstants.DPI_RATIO)
130          .height(StyleConstants.FORM_MGR_BACK_ICON_HEIGHT * StyleConstants.DPI_RATIO)
131          .objectFit(ImageFit.Fill)
132          .margin({left: StyleConstants.FORM_MGR_BACK_ICON_LEFT_MARGIN * StyleConstants.DPI_RATIO})
133          .onClick(() => {
134            Log.showDebug(TAG, 'hide form manager window');
135            this.clearAllFormById();
136            windowManager.destroyWindow(windowManager.FORM_MANAGER_WINDOW_NAME);
137          })
138        Blank()
139      }
140      .margin({top: StyleConstants.FORM_MGR_STATUS_BAR_HEIGHT * StyleConstants.DPI_RATIO})
141      .width("100%")
142      .height(StyleConstants.FORM_MGR_APP_BAR_HEIGHT * StyleConstants.DPI_RATIO)
143      Text(this.formAppInfo.appName)
144        .fontColor(StyleConstants.DEFAULT_FORM_MGR_FONT_COLOR)
145        .fontSize(StyleConstants.FORM_MGR_APP_LABEL_TEXT_SIZE * StyleConstants.DPI_RATIO)
146        .margin({top: 10 * StyleConstants.DPI_RATIO, bottom: 8 * StyleConstants.DPI_RATIO })
147      Column({ space: 5 }) {
148        Swiper(this.mSwiperController) {
149          ForEach(this.formItem, (formItem) => {
150            ForEach(formItem.supportDimensions, (dimensionItem) => {
151              Column() {
152                Text(formItem.description)
153                  .width('70%')
154                  .fontColor(0xe5ffffff)
155                  .fontSize(StyleConstants.FORM_MGR_DESCRIPTION_TEXT_SIZE * StyleConstants.DPI_RATIO)
156                  .textAlign(TextAlign.Center)
157                Column() {
158                  Flex({
159                    direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
160                    if (this.formAppInfo.bundleName == formItem.bundleName) {
161                      FormComponent({
162                        id: formItem.cardId,
163                        name: formItem.cardName,
164                        bundle: formItem.bundleName,
165                        ability: formItem.abilityName,
166                        module: formItem.moduleName,
167                        dimension: dimensionItem,
168                      })
169                        .enabled(false)
170                        .focusable(false)
171                        .clip(new Rect({
172                          width: this.mFormComponentWidth[dimensionItem - 1],
173                          height: this.mFormComponentHeight[dimensionItem - 1],
174                          radius: 24
175                        }))
176                        .size({
177                          width: this.mFormComponentWidth[dimensionItem - 1],
178                          height: this.mFormComponentHeight[dimensionItem - 1]
179                        })
180                        .allowUpdate(this.allowUpdate)
181                        .visibility(Visibility.Visible)
182                        .onAcquired((form) => {
183                          Log.showDebug(TAG, `FormComponent card id is: ${form.id}`);
184                          this.mFormIdList.push(form.id);
185                        })
186                        .onError((error) => {
187                          Log.showDebug(TAG, `FormComponent error msg: ${error.msg}`);
188                        })
189                    }
190                  }
191                }
192                .height('80%')
193              }.width('100%')
194            }, (dimensionItem) => JSON.stringify(dimensionItem))
195          }, (formItem) => JSON.stringify(formItem))
196        }.width('100%')
197        .height('100%')
198        .loop(false)
199        .index(0)
200        .indicatorStyle({
201          selectedColor: StyleConstants.DEFAULT_FORM_MGR_FONT_COLOR
202        })
203        .onChange((index: number) => {
204          this.mSwiperIndex = index;
205        })
206      }.alignItems(HorizontalAlign.Center)
207      .height('60%')
208      Blank()
209      Button({type: ButtonType.Capsule}) {
210        Row() {
211          Text($r('app.string.add_to_desktop'))
212            .fontColor(StyleConstants.DEFAULT_FORM_MGR_FONT_COLOR)
213            .fontSize(StyleConstants.FORM_MGR_ADD_TO_DESKTOP_TEXT_SIZE * StyleConstants.DPI_RATIO)
214        }
215      }
216      .backgroundColor(0x66ffffff)
217      .width(StyleConstants.FORM_MGR_ADD_TO_DESKTOP_BUTTON_WIDTH * StyleConstants.DPI_RATIO)
218      .height(StyleConstants.FORM_MGR_ADD_TO_DESKTOP_BUTTON_HEIGHT * StyleConstants.DPI_RATIO)
219      .margin({bottom: StyleConstants.FORM_MGR_ADD_TO_DESKTOP_BUTTON_BOTTOM_MARGIN * StyleConstants.DPI_RATIO,
220        left: StyleConstants.FORM_MGR_ADD_TO_DESKTOP_BUTTON_LEFT_MARGIN * StyleConstants.DPI_RATIO,
221        right: StyleConstants.FORM_MGR_ADD_TO_DESKTOP_BUTTON_RIGHT_MARGIN * StyleConstants.DPI_RATIO})
222      .onClick(() => {
223        Log.showDebug(TAG, 'form add to desktop');
224        localEventManager.sendLocalEventSticky(EventConstants.EVENT_REQUEST_PAGEDESK_FORM_ITEM_ADD, this.getChooseCard());
225        this.clearNoUseFormById();
226        windowManager.destroyWindow(windowManager.FORM_MANAGER_WINDOW_NAME);
227      })
228    }
229    .width(StyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
230    .height(StyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
231    .backgroundImage(StyleConstants.DEFAULT_FORM_MGR_BACKGROUND_IMAGE)
232  }
233}
234