1/* 2 * Copyright (c) 2025 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 16if (!("finalizeConstruction" in ViewPU.prototype)) { 17 Reflect.set(ViewPU.prototype, "finalizeConstruction", () => { }); 18} 19 20let image = requireNapi('multimedia.image'); 21let j = requireNapi('i18n'); 22let display = requireNapi('display'); 23 24export var FormType; 25(function (FormType) { 26 FormType[FormType["TYPE_BIG"] = 0] = "TYPE_BIG"; 27 FormType[FormType["TYPE_MID"] = 1] = "TYPE_MID"; 28 FormType[FormType["TYPE_SMALL"] = 2] = "TYPE_SMALL"; 29})(FormType || (FormType = {})); 30var TextType; 31(function (TextType) { 32 TextType[TextType["TITLE"] = 0] = "TITLE"; 33 TextType[TextType["DESCRIPTION"] = 1] = "DESCRIPTION"; 34 TextType[TextType["APP_NAME"] = 2] = "APP_NAME"; 35})(TextType || (TextType = {})); 36const m = 'udmf.ContentFormCard'; 37const o = 38 '82,73,70,70,60,3,0,0,87,69,66,80,86,80,56,32,48,3,0,0,144,67,0,157,1,42,36,2,76,1,62,145,72,161,76,37,164,163,34,3' + 39 '4,151,40,24,176,18,9,105,110,225,117,81,27,243,141,167,87,231,251,1,151,228,76,129,74,56,124,143,240,134,221,17,24' + 40 '5,145,49,195,251,155,103,15,145,254,16,219,162,62,178,38,56,127,115,108,225,242,63,194,27,116,71,214,68,199,15,238' + 41 ',109,156,62,71,248,67,110,136,250,200,152,225,253,205,179,135,200,255,8,109,209,31,89,19,28,63,185,182,112,249,31,' + 42 '225,13,186,35,235,34,99,135,247,54,206,31,35,252,33,183,68,125,100,76,112,254,230,217,195,228,75,0,41,63,219,242,2' + 43 '38,77,44,240,251,18,157,13,186,35,235,34,99,135,247,54,206,31,35,249,8,172,169,162,121,152,235,226,174,0,65,245,14' + 44 '5,49,195,251,155,103,15,145,254,16,219,50,4,52,148,102,170,225,73,64,87,161,183,68,125,100,76,112,254,230,217,195,' + 45 '228,71,209,214,155,210,69,175,155,95,117,236,130,111,176,161,115,26,13,253,205,179,135,200,255,8,109,209,31,89,19,' + 46 '28,63,185,182,112,248,134,3,147,196,80,183,60,143,240,134,221,17,245,145,49,195,251,155,103,9,153,121,194,183,243,' + 47 '118,43,147,107,248,164,83,185,180,54,232,143,172,137,142,31,220,219,56,124,136,157,203,110,159,181,177,87,164,132,' + 48 '51,246,217,120,189,13,186,35,235,34,99,134,241,245,180,72,132,116,112,254,7,167,195,150,227,244,98,234,67,237,155,' + 49 '35,135,102,236,204,223,23,161,183,68,125,100,75,176,70,248,207,116,46,59,232,218,137,15,41,225,38,20,162,105,88,3,' + 50 '59,221,52,249,17,46,76,68,130,195,148,187,103,15,145,253,241,76,10,132,82,146,126,208,179,241,65,64,84,151,15,193,' + 51 '27,58,174,246,254,217,195,225,201,8,103,237,178,241,122,27,116,71,210,161,106,19,234,133,230,77,60,101,201,227,55,' + 52 '59,2,148,71,237,122,200,152,222,202,193,86,94,164,111,28,63,185,180,88,205,133,69,41,39,237,156,62,237,252,33,183,' + 53 '68,126,68,34,111,88,1,159,60,108,76,112,252,104,245,218,227,1,255,172,137,142,31,220,219,56,124,143,239,99,182,153' + 54 ',157,89,206,237,156,41,135,174,215,24,15,76,90,90,193,245,145,49,195,251,155,103,15,145,18,140,226,36,22,28,165,21' + 55 '8,7,174,215,23,217,167,25,36,48,125,100,76,112,254,230,217,195,196,106,61,255,30,253,149,0,0,254,254,226,128,0,0,0' + 56 ',0,0,8,43,156,5,139,91,64,214,164,5,157,168,214,71,99,143,63,110,129,210,71,53,1,30,120,20,41,161,99,5,167,202,76,' + 57 '251,103,189,240,128,146,208,198,255,248,206,215,46,193,53,91,227,66,219,241,255,4,235,164,113,76,186,21,195,174,10' + 58 ',72,252,102,101,0,19,200,26,224,13,190,145,249,137,208,169,128,196,203,52,114,184,23,26,103,126,29,119,157,143,214' + 59 ',115,91,208,138,148,47,18,132,3,189,65,160,138,162,129,225,223,121,199,68,111,66,131,240,170,9,87,178,109,244,143,' + 60 '204,78,245,205,43,87,181,148,112,162,163,53,27,128,197,247,165,165,55,37,6,212,240,48,76,139,191,173,182,51,61,7,1' + 61 '38,70,81,93,158,178,96,58,63,135,99,61,33,123,114,106,17,205,205,245,73,209,248,208,230,67,84,83,67,62,174,199,125' + 62 ',7,42,68,205,119,254,54,95,35,146,246,87,229,105,194,49,134,23,113,205,13,105,146,10,231,32,0,26,210,69,47,127,104' + 63 ',73,141,205,245,214,23,231,110,132,188,27,13,88,8,43,145,225,60,68,0,42,15,95,85,238,25,204,75,166,163,127,0,0'; 64const t = 1.2; 65const u = 0.8; 66const a1 = 0.6; 67const b1 = 200; 68const c1 = 200; 69const d1 = 100; 70const e1 = 137; 71const f1 = 83; 72const g1 = 70; 73const h1 = 40; 74const i1 = 50; 75const j1 = 30; 76const l1 = 2; 77const m1 = '100%'; 78const n1 = '#E6FFFFFF'; 79const o1 = '#99182431'; 80const q1 = '#CCCCCC'; 81const s1 = '#55CCCCCC'; 82const t1 = '#ff182431'; 83const u1 = '#99182431'; 84const v1 = 72; 85const w1 = 59; 86const q3 = 3.25; 87const z1 = { 88 c2: 200, 89 d2: 120, 90 e2: 14, 91 f2: 16, 92 g2: 10, 93 h2: 14, 94 i2: 16, 95 j2: 4, 96 l2: 5, 97 m2: 10, 98 n2: 14, 99 o2: 12, 100 q2: 16, 101 s2: 6.5, 102 t2: 12, 103 u2: 10, 104 v2: 5 105}; 106const a2 = { 107 c2: 36, 108 d2: 48, 109 w2: 14, 110 h2: 10, 111 i2: 12, 112 z2: 14, 113 a3: 16, 114 j2: 10, 115 e2: 14, 116 f2: 16, 117 g2: 14, 118 l2: 5, 119 m2: 10, 120 n2: 14, 121 o2: 12, 122 q2: 16, 123 s2: 6.5, 124 t2: 12, 125 u2: 10, 126 v2: 5 127}; 128const b2 = { 129 c2: 24, 130 d2: 24, 131 w2: 8, 132 e2: 12, 133 f2: 14, 134 g2: 9, 135 h2: 10, 136 i2: 12, 137 z2: 12, 138 a3: 14, 139 j2: 4, 140 l2: 5, 141 m2: 10, 142 o2: 12, 143 q2: 12, 144 s2: 4, 145 n2: 12, 146 t2: 8, 147 u2: 8, 148 v2: 4 149}; 150 151export class ContentFormCard extends ViewPU { 152 constructor(parent, params, __localStorage, elmtId = -1, paramsLambda = undefined, extraInfo) { 153 super(parent, __localStorage, elmtId, extraInfo); 154 if (typeof paramsLambda === "function") { 155 this.paramsGenerator_ = paramsLambda; 156 } 157 this.b3 = new SynchedPropertySimpleOneWayPU(params.formType, this, 'formType'); 158 this.contentFormData = undefined; 159 this.formStyle = a2; 160 this.controller = new TextController(); 161 this.c3 = new ObservedPropertySimplePU(1, this, 'cardScale'); 162 this.d3 = new SynchedPropertySimpleOneWayPU(params.formWidth, this, 'formWidth'); 163 this.e3 = new SynchedPropertySimpleOneWayPU(params.formHeight, this, 'formHeight'); 164 this.f3 = new ObservedPropertySimplePU(0, this, 'cardWidth'); 165 this.g3 = new ObservedPropertySimplePU(0, this, 'cardHeight'); 166 this.h3 = new ObservedPropertyObjectPU(undefined, this, 'defaultThumbImage'); 167 this.i3 = new ObservedPropertyObjectPU(undefined, this, 'thumbImage'); 168 this.j3 = new ObservedPropertyObjectPU(undefined, this, 'appImage'); 169 this.l3 = new ObservedPropertySimplePU(1, this, 'lineCount'); 170 this.m3 = new ObservedPropertySimplePU(false, this, 'isMirrorLanguageType'); 171 this.handleOnClick = () => { 172 }; 173 this.setInitiallyProvidedValue(params); 174 this.declareWatch('formType', this.formTypeChange); 175 this.declareWatch('formWidth', this.formSizeChange); 176 this.declareWatch('formHeight', this.formSizeChange); 177 this.finalizeConstruction(); 178 } 179 180 setInitiallyProvidedValue(params) { 181 if (params.formType === undefined) { 182 this.b3.set(FormType.TYPE_MID); 183 } 184 if (params.contentFormData !== undefined) { 185 this.contentFormData = params.contentFormData; 186 } 187 if (params.formStyle !== undefined) { 188 this.formStyle = params.formStyle; 189 } 190 if (params.controller !== undefined) { 191 this.controller = params.controller; 192 } 193 if (params.cardScale !== undefined) { 194 this.cardScale = params.cardScale; 195 } 196 if (params.formWidth === undefined) { 197 this.d3.set(0); 198 } 199 if (params.formHeight === undefined) { 200 this.e3.set(0); 201 } 202 if (params.cardWidth !== undefined) { 203 this.cardWidth = params.cardWidth; 204 } 205 if (params.cardHeight !== undefined) { 206 this.cardHeight = params.cardHeight; 207 } 208 if (params.defaultThumbImage !== undefined) { 209 this.defaultThumbImage = params.defaultThumbImage; 210 } 211 if (params.thumbImage !== undefined) { 212 this.thumbImage = params.thumbImage; 213 } 214 if (params.appImage !== undefined) { 215 this.appImage = params.appImage; 216 } 217 if (params.lineCount !== undefined) { 218 this.lineCount = params.lineCount; 219 } 220 if (params.isMirrorLanguageType !== undefined) { 221 this.isMirrorLanguageType = params.isMirrorLanguageType; 222 } 223 if (params.handleOnClick !== undefined) { 224 this.handleOnClick = params.handleOnClick; 225 } 226 } 227 228 updateStateVars(params) { 229 this.b3.reset(params.formType); 230 this.d3.reset(params.formWidth); 231 this.e3.reset(params.formHeight); 232 } 233 234 purgeVariableDependenciesOnElmtId(rmElmtId) { 235 this.b3.purgeDependencyOnElmtId(rmElmtId); 236 this.c3.purgeDependencyOnElmtId(rmElmtId); 237 this.d3.purgeDependencyOnElmtId(rmElmtId); 238 this.e3.purgeDependencyOnElmtId(rmElmtId); 239 this.f3.purgeDependencyOnElmtId(rmElmtId); 240 this.g3.purgeDependencyOnElmtId(rmElmtId); 241 this.h3.purgeDependencyOnElmtId(rmElmtId); 242 this.i3.purgeDependencyOnElmtId(rmElmtId); 243 this.j3.purgeDependencyOnElmtId(rmElmtId); 244 this.l3.purgeDependencyOnElmtId(rmElmtId); 245 this.m3.purgeDependencyOnElmtId(rmElmtId); 246 } 247 248 aboutToBeDeleted() { 249 this.b3.aboutToBeDeleted(); 250 this.c3.aboutToBeDeleted(); 251 this.d3.aboutToBeDeleted(); 252 this.e3.aboutToBeDeleted(); 253 this.f3.aboutToBeDeleted(); 254 this.g3.aboutToBeDeleted(); 255 this.h3.aboutToBeDeleted(); 256 this.i3.aboutToBeDeleted(); 257 this.j3.aboutToBeDeleted(); 258 this.l3.aboutToBeDeleted(); 259 this.m3.aboutToBeDeleted(); 260 SubscriberManager.Get().delete(this.id__()); 261 this.aboutToBeDeletedInternal(); 262 } 263 264 get formType() { 265 return this.b3.get(); 266 } 267 268 set formType(newValue) { 269 this.b3.set(newValue); 270 } 271 272 get cardScale() { 273 return this.c3.get(); 274 } 275 276 set cardScale(newValue) { 277 this.c3.set(newValue); 278 } 279 280 get formWidth() { 281 return this.d3.get(); 282 } 283 284 set formWidth(newValue) { 285 this.d3.set(newValue); 286 } 287 288 get formHeight() { 289 return this.e3.get(); 290 } 291 292 set formHeight(newValue) { 293 this.e3.set(newValue); 294 } 295 296 get cardWidth() { 297 return this.f3.get(); 298 } 299 300 set cardWidth(newValue) { 301 this.f3.set(newValue); 302 } 303 304 get cardHeight() { 305 return this.g3.get(); 306 } 307 308 set cardHeight(newValue) { 309 this.g3.set(newValue); 310 } 311 312 get defaultThumbImage() { 313 return this.h3.get(); 314 } 315 316 set defaultThumbImage(newValue) { 317 this.h3.set(newValue); 318 } 319 320 get thumbImage() { 321 return this.i3.get(); 322 } 323 324 set thumbImage(newValue) { 325 this.i3.set(newValue); 326 } 327 328 get appImage() { 329 return this.j3.get(); 330 } 331 332 set appImage(newValue) { 333 this.j3.set(newValue); 334 } 335 336 get lineCount() { 337 return this.l3.get(); 338 } 339 340 set lineCount(newValue) { 341 this.l3.set(newValue); 342 } 343 344 get isMirrorLanguageType() { 345 return this.m3.get(); 346 } 347 348 set isMirrorLanguageType(newValue) { 349 this.m3.set(newValue); 350 } 351 352 aboutToAppear() { 353 this.initSystemLanguage(); 354 this.initCardStyle(); 355 this.createPixelMap(); 356 } 357 358 aboutToDisappear() { 359 this.contentFormData = undefined; 360 this.thumbImage = undefined; 361 this.appImage = undefined; 362 } 363 364 formTypeChange() { 365 switch (this.formType) { 366 case FormType.TYPE_BIG: 367 this.formWidth = b1; 368 break; 369 case FormType.TYPE_MID: 370 this.formWidth = c1; 371 break; 372 default: 373 this.formWidth = e1; 374 break; 375 } 376 this.initCardStyle(); 377 } 378 379 formSizeChange() { 380 this.initCardStyle(); 381 } 382 383 initCardScale(n2, o2, q2) { 384 let r2 = this.formType === FormType.TYPE_SMALL ? a1 : u; 385 if (n2 > t) { 386 this.cardScale = t; 387 } else if (n2 < r2) { 388 this.cardScale = r2; 389 } else { 390 this.cardScale = n2; 391 } 392 this.cardWidth = o2 * this.cardScale; 393 this.cardHeight = 394 (this.contentFormData?.title === '' && this.formHeight > 0) ? this.formHeight : q2 * this.cardScale; 395 console.info(`${m}, widthScale:${this.cardScale}, cardScale: ${this.cardScale}, ` + 396 `cardWidth: ${this.cardWidth}, cardHeight: ${this.cardHeight}`); 397 } 398 399 initCardStyle() { 400 let m2 = 1; 401 switch (this.formType) { 402 case FormType.TYPE_BIG: 403 this.formStyle = z1; 404 m2 = this.formWidth ? this.formWidth / b1 : 1; 405 this.initCardScale(m2, b1, b1); 406 break; 407 case FormType.TYPE_MID: 408 this.formStyle = a2; 409 m2 = this.formWidth ? this.formWidth / c1 : 1; 410 this.initCardScale(m2, c1, d1); 411 break; 412 default: 413 this.formStyle = b2; 414 m2 = this.formWidth ? this.formWidth / e1 : 1; 415 this.initCardScale(m2, e1, f1); 416 break; 417 } 418 } 419 420 ThumbImage(parent = null) { 421 this.observeComponentCreation2((elmtId, isInitialRender) => { 422 Column.create(); 423 Column.size({ width: '100%' }); 424 Column.layoutWeight(this.formHeight > 0 ? 1 : 0); 425 Column.backgroundColor(this.thumbImage ? n1 : q1); 426 }, Column); 427 this.observeComponentCreation2((elmtId, isInitialRender) => { 428 If.create(); 429 if (this.formHeight > 0) { 430 this.ifElseBranchUpdateFunction(0, () => { 431 this.observeComponentCreation2((elmtId, isInitialRender) => { 432 Image.create(this.thumbImage ? this.thumbImage : this.defaultThumbImage); 433 Image.objectFit(ImageFit.Contain); 434 Image.width('100%'); 435 Image.layoutWeight(1); 436 Image.draggable(false); 437 }, Image); 438 }); 439 } else { 440 this.ifElseBranchUpdateFunction(1, () => { 441 this.observeComponentCreation2((elmtId, isInitialRender) => { 442 Image.create(this.thumbImage ? this.thumbImage : this.defaultThumbImage); 443 Image.objectFit(ImageFit.Contain); 444 Image.width('100%'); 445 Image.aspectRatio(this.getAspectRatio()); 446 Image.draggable(false); 447 }, Image); 448 }); 449 } 450 }, If); 451 If.pop(); 452 Column.pop(); 453 } 454 455 CardDivider(parent = null) { 456 this.observeComponentCreation2((elmtId, isInitialRender) => { 457 Divider.create(); 458 Divider.height(1); 459 Divider.opacity(0.5); 460 Divider.padding({ 461 left: this.formStyle.t2 * this.cardScale, 462 right: this.formStyle.t2 * this.cardScale 463 }); 464 }, Divider); 465 } 466 467 AppView(parent = null) { 468 this.observeComponentCreation2((elmtId, isInitialRender) => { 469 Row.create({ space: this.formStyle.s2 * this.cardScale }); 470 Row.padding({ 471 left: this.formStyle.t2 * this.cardScale, 472 right: this.formStyle.t2 * this.cardScale, 473 top: this.formStyle.v2 * this.cardScale, 474 bottom: this.formStyle.u2 * this.cardScale, 475 }); 476 }, Row); 477 this.observeComponentCreation2((elmtId, isInitialRender) => { 478 Image.create(this.appImage); 479 Image.width(this.formStyle.o2 * this.cardScale); 480 Image.height(this.formStyle.o2 * this.cardScale); 481 Image.objectFit(ImageFit.Fill); 482 Image.alt({ 483 "id": -1, 484 "type": 20000, 485 params: ['sys.media.ohos_app_icon'], 486 "bundleName": "__harDefaultBundleName__", 487 "moduleName": "__harDefaultModuleName__" 488 }); 489 Image.borderRadius({ 490 "id": -1, 491 "type": 10002, 492 params: ['sys.float.corner_radius_level1'], 493 "bundleName": "__harDefaultBundleName__", 494 "moduleName": "__harDefaultModuleName__" 495 }); 496 Image.draggable(false); 497 }, Image); 498 this.observeComponentCreation2((elmtId, isInitialRender) => { 499 Text.create(this.contentFormData?.appName ? this.contentFormData?.appName : ' '); 500 Text.fontSize(this.formStyle.m2 * this.cardScale); 501 Text.fontColor(o1); 502 Text.maxLines(1); 503 Text.lineHeight(this.formStyle.n2 * this.cardScale); 504 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 505 Text.constraintSize({ minWidth: this.getTextSize(TextType.APP_NAME, this.contentFormData?.appName) }); 506 Text.backgroundColor(this.getTextBackground(this.contentFormData?.appName)); 507 Text.fontWeight(FontWeight.Regular); 508 Text.borderRadius(this.contentFormData?.title === '' ? 0 : l1); 509 Text.direction(this.isMirrorLanguageType ? Direction.Rtl : Direction.Ltr); 510 Text.maxFontScale(1); 511 Text.layoutWeight(1); 512 }, Text); 513 Text.pop(); 514 Row.pop(); 515 } 516 517 TitleText(parent = null) { 518 this.observeComponentCreation2((elmtId, isInitialRender) => { 519 Text.create(this.contentFormData?.title); 520 Text.fontSize(this.formStyle.e2 * this.cardScale); 521 Text.fontColor(t1); 522 Text.fontWeight(FontWeight.Bold); 523 Text.maxLines(1); 524 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 525 Text.height(this.formStyle.f2 * this.cardScale); 526 Text.margin({ top: this.formStyle.g2 * this.cardScale }); 527 Text.constraintSize({ minWidth: this.getTextSize(TextType.TITLE, this.contentFormData?.title) }); 528 Text.backgroundColor(this.getTextBackground(this.contentFormData?.title)); 529 Text.borderRadius(this.contentFormData?.title === '' ? 0 : l1); 530 Text.direction(this.isMirrorLanguageType ? Direction.Rtl : Direction.Ltr); 531 Text.maxFontScale(1); 532 }, Text); 533 Text.pop(); 534 } 535 536 Card4x4(parent = null) { 537 this.observeComponentCreation2((elmtId, isInitialRender) => { 538 Column.create(); 539 Column.size({ width: '100%', height: this.cardHeight }); 540 }, Column); 541 this.observeComponentCreation2((elmtId, isInitialRender) => { 542 Image.create(this.thumbImage ? this.thumbImage : this.defaultThumbImage); 543 Image.objectFit(ImageFit.Cover); 544 Image.width('100%'); 545 Image.height(this.formStyle.d2 * this.cardScale); 546 Image.backgroundColor(this.thumbImage ? n1 : q1); 547 Image.draggable(false); 548 }, Image); 549 this.observeComponentCreation2((elmtId, isInitialRender) => { 550 Column.create(); 551 Column.alignItems(HorizontalAlign.Start); 552 Column.width('100%'); 553 Column.padding({ 554 left: this.formStyle.t2 * this.cardScale, 555 right: this.formStyle.t2 * this.cardScale 556 }); 557 Column.margin({ bottom: this.formStyle.l2 * this.cardScale }); 558 Column.justifyContent(FlexAlign.Center); 559 }, Column); 560 this.TitleText.bind(this)(); 561 this.observeComponentCreation2((elmtId, isInitialRender) => { 562 Text.create(this.contentFormData?.description); 563 Text.fontSize(this.formStyle.h2 * this.cardScale); 564 Text.fontColor(u1); 565 Text.fontWeight(FontWeight.Regular); 566 Text.maxLines(1); 567 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 568 Text.constraintSize({ 569 minWidth: this.getTextSize(TextType.DESCRIPTION, this.contentFormData?.description) 570 }); 571 Text.height(this.formStyle.i2 * this.cardScale); 572 Text.margin({ top: this.formStyle.j2 * this.cardScale }); 573 Text.backgroundColor(this.getTextBackground(this.contentFormData?.description)); 574 Text.fontWeight(FontWeight.Regular); 575 Text.borderRadius(this.contentFormData?.description ? 0 : l1); 576 Text.direction(this.isMirrorLanguageType ? Direction.Rtl : Direction.Ltr); 577 Text.maxFontScale(1); 578 }, Text); 579 Text.pop(); 580 Column.pop(); 581 this.CardDivider.bind(this)(); 582 this.AppView.bind(this)(); 583 Column.pop(); 584 } 585 586 DescriptionView(parent = null) { 587 this.observeComponentCreation2((elmtId, isInitialRender) => { 588 Text.create(this.contentFormData?.description ? this.contentFormData?.description : ' ', 589 { controller: this.controller }); 590 Text.fontColor(u1); 591 Text.fontWeight(FontWeight.Regular); 592 Text.maxLines(2); 593 Text.fontWeight(FontWeight.Regular); 594 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 595 Text.lineHeight((this.lineCount === 1 ? 596 (this.formStyle.a3 ? this.formStyle.a3 : 597 this.formStyle.i2) : this.formStyle.i2) * this.cardScale); 598 Text.fontSize(this.getDescriptionFontSize()); 599 Text.constraintSize({ 600 minWidth: this.getTextSize(TextType.DESCRIPTION, this.contentFormData?.description) 601 }); 602 Text.backgroundColor(this.getTextBackground(this.contentFormData?.description)); 603 Text.borderRadius(this.contentFormData?.description ? 0 : l1); 604 Text.onAreaChange(() => { 605 let l2 = this.controller.getLayoutManager(); 606 this.lineCount = l2.getLineCount(); 607 }); 608 Text.direction(this.isMirrorLanguageType ? Direction.Rtl : Direction.Ltr); 609 Text.maxFontScale(1); 610 }, Text); 611 Text.pop(); 612 } 613 614 Card4x2(parent = null) { 615 this.observeComponentCreation2((elmtId, isInitialRender) => { 616 Column.create(); 617 Column.size({ width: '100%' }); 618 Column.constraintSize(this.getThumbViewConstraintSize()); 619 }, Column); 620 this.observeComponentCreation2((elmtId, isInitialRender) => { 621 If.create(); 622 if (this.contentFormData?.title === '') { 623 this.ifElseBranchUpdateFunction(0, () => { 624 this.ThumbImage.bind(this)(); 625 }); 626 } else { 627 this.ifElseBranchUpdateFunction(1, () => { 628 this.observeComponentCreation2((elmtId, isInitialRender) => { 629 Row.create(); 630 Row.width('100%'); 631 Row.padding({ 632 left: this.formStyle.t2 * this.cardScale, 633 right: this.formStyle.t2 * this.cardScale 634 }); 635 Row.layoutWeight(1); 636 Row.margin({ bottom: this.formStyle.l2 * this.cardScale }); 637 Row.alignItems(VerticalAlign.Top); 638 }, Row); 639 this.observeComponentCreation2((elmtId, isInitialRender) => { 640 Column.create({ space: this.formStyle.j2 * this.cardScale }); 641 Column.layoutWeight(1); 642 Column.alignItems(HorizontalAlign.Start); 643 }, Column); 644 this.TitleText.bind(this)(); 645 this.DescriptionView.bind(this)(); 646 Column.pop(); 647 this.observeComponentCreation2((elmtId, isInitialRender) => { 648 If.create(); 649 if (this.thumbImage) { 650 this.ifElseBranchUpdateFunction(0, () => { 651 this.observeComponentCreation2((elmtId, isInitialRender) => { 652 Image.create(this.thumbImage); 653 Image.width(this.formStyle.c2 * this.cardScale); 654 Image.height(this.formStyle.d2 * this.cardScale); 655 Image.objectFit(this.thumbImage ? ImageFit.Cover : ImageFit.Contain); 656 Image.borderRadius(4); 657 Image.draggable(false); 658 Image.margin({ 659 right: this.isMirrorLanguageType ? (this.formStyle.w2 * this.cardScale) : 0, 660 left: this.isMirrorLanguageType ? 0 : (this.formStyle.w2 * this.cardScale), 661 top: this.formStyle.g2 * this.cardScale 662 }); 663 }, Image); 664 }); 665 } else { 666 this.ifElseBranchUpdateFunction(1, () => { 667 }); 668 } 669 }, If); 670 If.pop(); 671 Row.pop(); 672 }); 673 } 674 }, If); 675 If.pop(); 676 this.CardDivider.bind(this)(); 677 this.AppView.bind(this)(); 678 Column.pop(); 679 } 680 681 Card2x1(parent = null) { 682 this.observeComponentCreation2((elmtId, isInitialRender) => { 683 Column.create(); 684 Column.size({ width: '100%' }); 685 Column.constraintSize(this.getThumbViewConstraintSize()); 686 }, Column); 687 this.observeComponentCreation2((elmtId, isInitialRender) => { 688 If.create(); 689 if (this.contentFormData?.title === '') { 690 this.ifElseBranchUpdateFunction(0, () => { 691 this.ThumbImage.bind(this)(); 692 }); 693 } else { 694 this.ifElseBranchUpdateFunction(1, () => { 695 this.observeComponentCreation2((elmtId, isInitialRender) => { 696 Column.create(); 697 Column.width('100%'); 698 Column.padding({ 699 left: this.formStyle.t2 * this.cardScale, 700 right: this.formStyle.t2 * this.cardScale 701 }); 702 Column.layoutWeight(1); 703 Column.alignItems(HorizontalAlign.Start); 704 Column.margin({ bottom: this.formStyle.l2 * this.cardScale }); 705 }, Column); 706 this.TitleText.bind(this)(); 707 this.observeComponentCreation2((elmtId, isInitialRender) => { 708 Row.create(); 709 Row.margin({ top: this.formStyle.j2 * this.cardScale }); 710 Row.layoutWeight(1); 711 }, Row); 712 this.observeComponentCreation2((elmtId, isInitialRender) => { 713 Column.create(); 714 Column.layoutWeight(1); 715 Column.alignItems(HorizontalAlign.Start); 716 }, Column); 717 this.DescriptionView.bind(this)(); 718 Column.pop(); 719 this.observeComponentCreation2((elmtId, isInitialRender) => { 720 If.create(); 721 if (this.thumbImage) { 722 this.ifElseBranchUpdateFunction(0, () => { 723 this.observeComponentCreation2((elmtId, isInitialRender) => { 724 Image.create(this.thumbImage); 725 Image.objectFit(ImageFit.Cover); 726 Image.borderRadius({ 727 "id": -1, 728 "type": 10002, 729 params: ['sys.float.corner_radius_level2'], 730 "bundleName": "__harDefaultBundleName__", 731 "moduleName": "__harDefaultModuleName__" 732 }); 733 Image.width(this.formStyle.c2 * this.cardScale); 734 Image.height(this.formStyle.d2 * this.cardScale); 735 Image.draggable(false); 736 Image.margin({ 737 left: this.isMirrorLanguageType ? 0 : (this.formStyle.w2 * this.cardScale), 738 right: this.isMirrorLanguageType ? (this.formStyle.w2 * this.cardScale) : 0 739 }); 740 }, Image); 741 }); 742 } else { 743 this.ifElseBranchUpdateFunction(1, () => { 744 }); 745 } 746 }, If); 747 If.pop(); 748 Row.pop(); 749 Column.pop(); 750 }); 751 } 752 }, If); 753 If.pop(); 754 this.CardDivider.bind(this)(); 755 this.AppView.bind(this)(); 756 Column.pop(); 757 } 758 759 initialRender() { 760 this.observeComponentCreation2((elmtId, isInitialRender) => { 761 Column.create(); 762 Column.borderRadius(this.formStyle.q2 * this.cardScale); 763 Column.clip(true); 764 Column.backgroundColor(n1); 765 Column.backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK, { colorMode: ThemeColorMode.LIGHT, adaptiveColor: AdaptiveColor.DEFAULT, scale: 1.0 }); 766 Column.shadow(ShadowStyle.OUTER_DEFAULT_SM); 767 Column.width(this.cardWidth); 768 Column.onClick(() => { 769 if (!this.contentFormData?.linkUri) { 770 console.warn(`${m}, linkUri is null`); 771 return; 772 } 773 this.handleOnClick(); 774 try { 775 let context = getContext(this); 776 context.openLink(this.contentFormData?.linkUri, { appLinkingOnly: false, parameters: {} }); 777 } 778 catch (err) { 779 let error = err; 780 console.error(`${m}, Failed to openLink, code is ${error.code}, message is ${error.message}`); 781 } 782 }); 783 }, Column); 784 this.observeComponentCreation2((elmtId, isInitialRender) => { 785 If.create(); 786 if (this.initSystemLanguage() && this.formType === FormType.TYPE_BIG) { 787 this.ifElseBranchUpdateFunction(0, () => { 788 this.Card4x4.bind(this)(); 789 }); 790 } 791 else if (this.formType === FormType.TYPE_MID) { 792 this.ifElseBranchUpdateFunction(1, () => { 793 this.Card4x2.bind(this)(); 794 }); 795 } 796 else { 797 this.ifElseBranchUpdateFunction(2, () => { 798 this.Card2x1.bind(this)(); 799 }); 800 } 801 }, If); 802 If.pop(); 803 Column.pop(); 804 } 805 806 initSystemLanguage() { 807 try { 808 this.isMirrorLanguageType = j.isRTL(j.System.getSystemLanguage()); 809 } catch (err) { 810 let error = err; 811 console.error(`${m}, Failed to init system language, code is ${error.code}, message is ${error.message}`); 812 } 813 return true; 814 } 815 816 async getPixelMap(i2, callback) { 817 let j2 = undefined; 818 try { 819 j2 = image.createImageSource(i2.buffer); 820 let k2 = await j2?.createPixelMap(); 821 callback(k2); 822 j2.release(); 823 } catch (err) { 824 let error = err; 825 console.error(`${m}, Failed to create pixelMap, code is ${error.code}, message is ${error.message}`); 826 } 827 } 828 829 transStringToUint8Array(g2) { 830 const arr = g2.split(','); 831 const h2 = new Uint8Array(arr.length); 832 arr.forEach((value, index) => { 833 h2[index] = parseInt(value); 834 }); 835 return h2; 836 } 837 838 createPixelMap() { 839 let f2 = this.transStringToUint8Array(o); 840 this.getPixelMap(f2, (pixelMap) => { 841 this.defaultThumbImage = pixelMap; 842 }); 843 if (this.contentFormData && this.contentFormData?.thumbData) { 844 if (!(this.contentFormData?.thumbData instanceof Uint8Array)) { 845 console.error(`${m}, thumbData is not Uint8Array`); 846 return; 847 } 848 this.getPixelMap(this.contentFormData?.thumbData, (pixelMap) => { 849 this.thumbImage = pixelMap; 850 }); 851 } 852 if (this.contentFormData && this.contentFormData?.appIcon) { 853 if (!(this.contentFormData?.appIcon instanceof Uint8Array)) { 854 console.error(`${m}, appIcon is not Uint8Array`); 855 return; 856 } 857 this.getPixelMap(this.contentFormData?.appIcon, (pixelMap) => { 858 this.appImage = pixelMap; 859 }); 860 } 861 } 862 863 getAspectRatio() { 864 let c2 = this.thumbImage?.getImageInfoSync().size; 865 let d2 = this.formType === FormType.TYPE_MID ? c1 : e1; 866 let e2 = this.formType === FormType.TYPE_MID ? v1 : w1; 867 if (c2 && this.thumbImage) { 868 if ((c2.width / c2.height) > (d2 / (e2 * u))) { 869 return d2 / (e2 * u); 870 } 871 if ((c2.width / c2.height) < (d2 / (e2 * t))) { 872 return d2 / (e2 * t); 873 } 874 return c2.width / c2.height; 875 } 876 return d2 / e2; 877 } 878 879 getTextBackground(text) { 880 if (text && text.length > 0) { 881 return n1; 882 } 883 return s1; 884 } 885 886 getTextSize(textType, text) { 887 if (textType === TextType.TITLE) { 888 if (text === '' || text === undefined || text === null) { 889 if (this.formType === FormType.TYPE_SMALL) { 890 return i1; 891 } 892 return g1; 893 } 894 return m1; 895 } 896 if (textType === TextType.APP_NAME) { 897 if (text === '' || text === undefined || text === null) { 898 if (this.formType === FormType.TYPE_SMALL) { 899 return j1; 900 } 901 return h1; 902 } 903 return m1; 904 } 905 return '100%'; 906 } 907 908 getThumbViewConstraintSize() { 909 if (this.contentFormData?.title !== '') { 910 return { maxHeight: this.cardHeight, minHeight: this.cardHeight }; 911 } else { 912 if (this.formHeight > 0) { 913 return { 914 maxHeight: this.formHeight, 915 minHeight: this.formHeight 916 }; 917 } 918 return { 919 maxHeight: this.cardHeight * t, 920 minHeight: this.cardHeight * u 921 }; 922 } 923 } 924 925 getDescriptionFontSize() { 926 return this.lineCount === 1 ? (this.formStyle.z2 ? this.formStyle.z2 : 927 this.formStyle.h2) : (this.formStyle.h2 * this.cardScale); 928 } 929 930 rerender() { 931 this.updateDirtyElements(); 932 } 933} 934 935export default { ContentFormCard, FormType };