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