1/* 2 * Copyright (c) 2023-2023 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 16const KeyCode = requireNapi("multimodalInput.keyCode").KeyCode; 17const SPACE_MARGIN = 8; 18const MARGIN_NUM = 4; 19const IMAGE_WIDTH_NUM = 16; 20const IMAGE_HEIGHT_NUM = 24; 21const BUTTON_SIZE = 32; 22const SINGLE_LINE_HEIGHT = 48; 23const DOUBLE_LINE_HEIGHT = 64; 24const BUTTON_HEIGHT = 28; 25const IMAGE_WIDTH = 12; 26const BORDER_WIDTH = 2; 27const DIVIDEND_WIDTH = 3; 28const SINGLE_LINE_NUM = 1; 29const DOUBLE_LINE_NUM = 2; 30const MIN_FONT_SIZE = 14; 31const MAIN_TEXT_SIZE = 10; 32const CONSTRAINT_NUM = 44; 33const CONTENT_NUM = 40; 34 35export var OperationType; 36!function(e){ 37 e[e.TEXT_ARROW=0] = "TEXT_ARROW"; 38 e[e.BUTTON=1] = "BUTTON"; 39 e[e.ICON_GROUP=2] = "ICON_GROUP"; 40 e[e.LOADING=3] = "LOADING" 41}(OperationType || (OperationType = {})); 42 43class IconGroup extends ViewPU { 44 constructor(e, t, o, r = -1) { 45 super(e, o, r); 46 this.__bgColor = new ObservedPropertyObjectPU({ 47 id: -1, 48 type: 10001, 49 params: ["sys.color.ohos_id_color_sub_background_transparent"], 50 bundleName: "", 51 moduleName: "" 52 }, this, "bgColor"); 53 this.__isFocus = new ObservedPropertySimplePU(!1, this, "isFocus"); 54 this.item = void 0; 55 this.focusBorderWidth = 2; 56 this.setInitiallyProvidedValue(t) 57 } 58 59 setInitiallyProvidedValue(e) { 60 void 0 !== e.bgColor && (this.bgColor = e.bgColor); 61 void 0 !== e.isFocus && (this.isFocus = e.isFocus); 62 void 0 !== e.item && (this.item = e.item); 63 void 0 !== e.focusBorderWidth && (this.focusBorderWidth = e.focusBorderWidth) 64 } 65 66 updateStateVars(e) { 67 } 68 69 purgeVariableDependenciesOnElmtId(e) { 70 this.__bgColor.purgeDependencyOnElmtId(e); 71 this.__isFocus.purgeDependencyOnElmtId(e) 72 } 73 74 aboutToBeDeleted() { 75 this.__bgColor.aboutToBeDeleted(); 76 this.__isFocus.aboutToBeDeleted(); 77 SubscriberManager.Get().delete(this.id__()); 78 this.aboutToBeDeletedInternal() 79 } 80 81 get bgColor() { 82 return this.__bgColor.get() 83 } 84 85 set bgColor(e) { 86 this.__bgColor.set(e) 87 } 88 89 get isFocus() { 90 return this.__isFocus.get() 91 } 92 93 set isFocus(e) { 94 this.__isFocus.set(e) 95 } 96 97 initialRender() { 98 this.observeComponentCreation(((e, t) => { 99 ViewStackProcessor.StartGetAccessRecordingFor(e); 100 Row.create(); 101 Row.focusable(!0); 102 Row.width(32); 103 Row.height(32); 104 Row.margin({ right: 8, bottom: 4 }); 105 Row.justifyContent(FlexAlign.Center); 106 Row.borderRadius({ 107 id: -1, 108 type: 10002, 109 params: ["sys.float.ohos_id_corner_radius_clicked"], 110 bundleName: "", 111 moduleName: "" 112 }); 113 Row.backgroundColor(ObservedObject.GetRawObject(this.bgColor)); 114 Row.onTouch((e => { 115 if (e.type === TouchType.Down) { 116 this.item.action && this.item.action(); 117 this.bgColor = { 118 id: -1, 119 type: 10001, 120 params: ["sys.color.ohos_id_color_click_effect"], 121 bundleName: "", 122 moduleName: "" 123 } 124 } 125 e.type === TouchType.Up && (this.bgColor = { 126 id: -1, 127 type: 10001, 128 params: ["sys.color.ohos_id_color_sub_background_transparent"], 129 bundleName: "", 130 moduleName: "" 131 }) 132 })); 133 Row.onHover((e => { 134 this.bgColor = e ? { 135 id: -1, 136 type: 10001, 137 params: ["sys.color.ohos_id_color_hover"], 138 bundleName: "", 139 moduleName: "" 140 } : { 141 id: -1, 142 type: 10001, 143 params: ["sys.color.ohos_id_color_sub_background_transparent"], 144 bundleName: "", 145 moduleName: "" 146 } 147 })); 148 ViewStackProcessor.visualState("focused"); 149 Row.border({ 150 radius: { 151 id: -1, 152 type: 10002, 153 params: ["sys.float.ohos_id_corner_radius_clicked"], 154 bundleName: "", 155 moduleName: "" 156 }, 157 width: this.focusBorderWidth, 158 color: { 159 id: -1, 160 type: 10001, 161 params: ["sys.color.ohos_id_color_focused_outline"], 162 bundleName: "", 163 moduleName: "" 164 }, 165 style: BorderStyle.Solid 166 }); 167 ViewStackProcessor.visualState("normal"); 168 Row.border({ 169 radius: { 170 id: -1, 171 type: 10002, 172 params: ["sys.float.ohos_id_corner_radius_clicked"], 173 bundleName: "", 174 moduleName: "" 175 }, 176 width: 0 177 }); 178 ViewStackProcessor.visualState(); 179 Row.onKeyEvent((e => { 180 e.keyCode !== KeyCode.KEYCODE_ENTER && e.keyCode !== KeyCode.KEYCODE_SPACE || this.item.action && this.item.action() 181 })); 182 t || Row.pop(); 183 ViewStackProcessor.StopGetAccessRecording() 184 })); 185 this.observeComponentCreation(((e, t) => { 186 ViewStackProcessor.StartGetAccessRecordingFor(e); 187 Image.create(this.item.value); 188 Image.fillColor({ 189 id: -1, 190 type: 10001, 191 params: ["sys.color.ohos_id_color_primary"], 192 bundleName: "", 193 moduleName: "" 194 }); 195 Image.width(24); 196 Image.height(24); 197 Image.focusable(!0); 198 t || Image.pop(); 199 ViewStackProcessor.StopGetAccessRecording() 200 })); 201 Row.pop() 202 } 203 204 rerender() { 205 this.updateDirtyElements() 206 } 207} 208 209export class SubHeader extends ViewPU { 210 constructor(e, t, o, r = -1) { 211 super(e, o, r); 212 this.__icon = new SynchedPropertyObjectOneWayPU(t.icon, this, "icon"); 213 this.__primaryTitle = new SynchedPropertySimpleOneWayPU(t.primaryTitle, this, "primaryTitle"); 214 this.__secondaryTitle = new SynchedPropertySimpleOneWayPU(t.secondaryTitle, this, "secondaryTitle"); 215 this.__select = new SynchedPropertyObjectOneWayPU(t.select, this, "select"); 216 this.__operationType = new SynchedPropertySimpleOneWayPU(t.operationType, this, "operationType"); 217 this.operationItem = void 0; 218 this.__isDuplicateLine = new ObservedPropertySimplePU(!1, this, "isDuplicateLine"); 219 this.__textArrowBgColor = new ObservedPropertyObjectPU({ 220 id: -1, 221 type: 10001, 222 params: ["sys.color.ohos_id_color_sub_background_transparent"], 223 bundleName: "", 224 moduleName: "" 225 }, this, "textArrowBgColor"); 226 this.__buttonBgColor = new ObservedPropertyObjectPU({ 227 id: -1, 228 type: 10001, 229 params: ["sys.color.ohos_id_color_sub_background_transparent"], 230 bundleName: "", 231 moduleName: "" 232 }, this, "buttonBgColor"); 233 this.__flexWidth = new ObservedPropertySimplePU(0, this, "flexWidth"); 234 this.__textArrowWidth = new ObservedPropertySimplePU(0, this, "textArrowWidth"); 235 this.__textArrowFocus = new ObservedPropertySimplePU(!1, this, "textArrowFocus"); 236 this.__buttonFocus = new ObservedPropertySimplePU(!1, this, "buttonFocus"); 237 this.__arrowWidth = new ObservedPropertySimplePU(0, this, "arrowWidth"); 238 this.__buttonWidth = new ObservedPropertySimplePU(0, this, "buttonWidth"); 239 this.focusBorderWidth = 2; 240 this.setInitiallyProvidedValue(t) 241 } 242 243 setInitiallyProvidedValue(e) { 244 void 0 !== e.operationType ? this.__operationType.set(e.operationType) : this.__operationType.set(OperationType.BUTTON); 245 void 0 !== e.operationItem && (this.operationItem = e.operationItem); 246 void 0 !== e.isDuplicateLine && (this.isDuplicateLine = e.isDuplicateLine); 247 void 0 !== e.textArrowBgColor && (this.textArrowBgColor = e.textArrowBgColor); 248 void 0 !== e.buttonBgColor && (this.buttonBgColor = e.buttonBgColor); 249 void 0 !== e.flexWidth && (this.flexWidth = e.flexWidth); 250 void 0 !== e.textArrowWidth && (this.textArrowWidth = e.textArrowWidth); 251 void 0 !== e.textArrowFocus && (this.textArrowFocus = e.textArrowFocus); 252 void 0 !== e.buttonFocus && (this.buttonFocus = e.buttonFocus); 253 void 0 !== e.arrowWidth && (this.arrowWidth = e.arrowWidth); 254 void 0 !== e.buttonWidth && (this.buttonWidth = e.buttonWidth); 255 void 0 !== e.focusBorderWidth && (this.focusBorderWidth = e.focusBorderWidth) 256 } 257 258 updateStateVars(e) { 259 this.__icon.reset(e.icon); 260 this.__primaryTitle.reset(e.primaryTitle); 261 this.__secondaryTitle.reset(e.secondaryTitle); 262 this.__select.reset(e.select); 263 this.__operationType.reset(e.operationType) 264 } 265 266 purgeVariableDependenciesOnElmtId(e) { 267 this.__icon.purgeDependencyOnElmtId(e); 268 this.__primaryTitle.purgeDependencyOnElmtId(e); 269 this.__secondaryTitle.purgeDependencyOnElmtId(e); 270 this.__select.purgeDependencyOnElmtId(e); 271 this.__operationType.purgeDependencyOnElmtId(e); 272 this.__isDuplicateLine.purgeDependencyOnElmtId(e); 273 this.__textArrowBgColor.purgeDependencyOnElmtId(e); 274 this.__buttonBgColor.purgeDependencyOnElmtId(e); 275 this.__flexWidth.purgeDependencyOnElmtId(e); 276 this.__textArrowWidth.purgeDependencyOnElmtId(e); 277 this.__textArrowFocus.purgeDependencyOnElmtId(e); 278 this.__buttonFocus.purgeDependencyOnElmtId(e); 279 this.__arrowWidth.purgeDependencyOnElmtId(e); 280 this.__buttonWidth.purgeDependencyOnElmtId(e) 281 } 282 283 aboutToBeDeleted() { 284 this.__icon.aboutToBeDeleted(); 285 this.__primaryTitle.aboutToBeDeleted(); 286 this.__secondaryTitle.aboutToBeDeleted(); 287 this.__select.aboutToBeDeleted(); 288 this.__operationType.aboutToBeDeleted(); 289 this.__isDuplicateLine.aboutToBeDeleted(); 290 this.__textArrowBgColor.aboutToBeDeleted(); 291 this.__buttonBgColor.aboutToBeDeleted(); 292 this.__flexWidth.aboutToBeDeleted(); 293 this.__textArrowWidth.aboutToBeDeleted(); 294 this.__textArrowFocus.aboutToBeDeleted(); 295 this.__buttonFocus.aboutToBeDeleted(); 296 this.__arrowWidth.aboutToBeDeleted(); 297 this.__buttonWidth.aboutToBeDeleted(); 298 SubscriberManager.Get().delete(this.id__()); 299 this.aboutToBeDeletedInternal() 300 } 301 302 get icon() { 303 return this.__icon.get() 304 } 305 306 set icon(e) { 307 this.__icon.set(e) 308 } 309 310 get primaryTitle() { 311 return this.__primaryTitle.get() 312 } 313 314 set primaryTitle(e) { 315 this.__primaryTitle.set(e) 316 } 317 318 get secondaryTitle() { 319 return this.__secondaryTitle.get() 320 } 321 322 set secondaryTitle(e) { 323 this.__secondaryTitle.set(e) 324 } 325 326 get select() { 327 return this.__select.get() 328 } 329 330 set select(e) { 331 this.__select.set(e) 332 } 333 334 get operationType() { 335 return this.__operationType.get() 336 } 337 338 set operationType(e) { 339 this.__operationType.set(e) 340 } 341 342 get isDuplicateLine() { 343 return this.__isDuplicateLine.get() 344 } 345 346 set isDuplicateLine(e) { 347 this.__isDuplicateLine.set(e) 348 } 349 350 get textArrowBgColor() { 351 return this.__textArrowBgColor.get() 352 } 353 354 set textArrowBgColor(e) { 355 this.__textArrowBgColor.set(e) 356 } 357 358 get buttonBgColor() { 359 return this.__buttonBgColor.get() 360 } 361 362 set buttonBgColor(e) { 363 this.__buttonBgColor.set(e) 364 } 365 366 get flexWidth() { 367 return this.__flexWidth.get() 368 } 369 370 set flexWidth(e) { 371 this.__flexWidth.set(e) 372 } 373 374 get textArrowWidth() { 375 return this.__textArrowWidth.get() 376 } 377 378 set textArrowWidth(e) { 379 this.__textArrowWidth.set(e) 380 } 381 382 get textArrowFocus() { 383 return this.__textArrowFocus.get() 384 } 385 386 set textArrowFocus(e) { 387 this.__textArrowFocus.set(e) 388 } 389 390 get buttonFocus() { 391 return this.__buttonFocus.get() 392 } 393 394 set buttonFocus(e) { 395 this.__buttonFocus.set(e) 396 } 397 398 get arrowWidth() { 399 return this.__arrowWidth.get() 400 } 401 402 set arrowWidth(e) { 403 this.__arrowWidth.set(e) 404 } 405 406 get buttonWidth() { 407 return this.__buttonWidth.get() 408 } 409 410 set buttonWidth(e) { 411 this.__buttonWidth.set(e) 412 } 413 414 ListTextStyle(e, t = null) { 415 this.observeComponentCreation(((t, o) => { 416 ViewStackProcessor.StartGetAccessRecordingFor(t); 417 Text.create(e.content); 418 Text.fontColor({ 419 id: -1, 420 type: 10001, 421 params: ["sys.color.ohos_id_color_text_secondary"], 422 bundleName: "", 423 moduleName: "" 424 }); 425 Text.fontSize({ 426 id: -1, 427 type: 10002, 428 params: ["sys.float.ohos_id_text_size_sub_title3"], 429 bundleName: "", 430 moduleName: "" 431 }); 432 Text.fontWeight(FontWeight.Medium); 433 Text.maxLines(2); 434 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 435 Text.margin({ 436 left: { 437 id: -1, 438 type: 10002, 439 params: ["sys.float.ohos_id_max_padding_end"], 440 bundleName: "", 441 moduleName: "" 442 }, 443 bottom: 8, 444 right: 4 445 }); 446 o || Text.pop(); 447 ViewStackProcessor.StopGetAccessRecording() 448 })); 449 Text.pop() 450 } 451 452 ListIconStyle(e, t, o = null) { 453 this.observeComponentCreation(((e, t) => { 454 ViewStackProcessor.StartGetAccessRecordingFor(e); 455 Row.create(); 456 Row.margin({ 457 left: { 458 id: -1, 459 type: 10002, 460 params: ["sys.float.ohos_id_max_padding_end"], 461 bundleName: "", 462 moduleName: "" 463 }, 464 bottom: 8, 465 right: 4 466 }); 467 t || Row.pop(); 468 ViewStackProcessor.StopGetAccessRecording() 469 })); 470 this.observeComponentCreation(((e, o) => { 471 ViewStackProcessor.StartGetAccessRecordingFor(e); 472 Image.create(t); 473 Image.width(16); 474 Image.height(16); 475 Image.margin({ right: 8 }); 476 o || Image.pop(); 477 ViewStackProcessor.StopGetAccessRecording() 478 })); 479 this.observeComponentCreation(((t, o) => { 480 ViewStackProcessor.StartGetAccessRecordingFor(t); 481 Text.create(e.content); 482 Text.fontColor({ 483 id: -1, 484 type: 10001, 485 params: ["sys.color.ohos_id_color_text_secondary"], 486 bundleName: "", 487 moduleName: "" 488 }); 489 Text.fontSize({ 490 id: -1, 491 type: 10002, 492 params: ["sys.float.ohos_id_text_size_sub_title3"], 493 bundleName: "", 494 moduleName: "" 495 }); 496 Text.fontWeight(FontWeight.Medium); 497 Text.maxLines(2); 498 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 499 o || Text.pop(); 500 ViewStackProcessor.StopGetAccessRecording() 501 })); 502 Text.pop(); 503 Row.pop() 504 } 505 506 ContentTextStyle(e, t = null) { 507 this.observeComponentCreation(((t, o) => { 508 ViewStackProcessor.StartGetAccessRecordingFor(t); 509 Text.create(e.content); 510 Text.fontColor({ 511 id: -1, 512 type: 10001, 513 params: ["sys.color.ohos_id_color_text_primary"], 514 bundleName: "", 515 moduleName: "" 516 }); 517 Text.fontSize({ 518 id: -1, 519 type: 10002, 520 params: ["sys.float.ohos_id_text_size_sub_title1"], 521 bundleName: "", 522 moduleName: "" 523 }); 524 Text.fontWeight(FontWeight.Medium); 525 Text.maxLines(2); 526 Text.maxFontSize({ 527 id: -1, 528 type: 10002, 529 params: ["sys.float.ohos_id_text_size_sub_title1"], 530 bundleName: "", 531 moduleName: "" 532 }); 533 Text.minFontSize(14); 534 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 535 Text.margin({ 536 left: { 537 id: -1, 538 type: 10002, 539 params: ["sys.float.ohos_id_max_padding_start"], 540 bundleName: "", 541 moduleName: "" 542 }, 543 right: 4, 544 bottom: 8 545 }); 546 o || Text.pop(); 547 ViewStackProcessor.StopGetAccessRecording() 548 })); 549 Text.pop() 550 } 551 552 SubTextStyle(e, t = null) { 553 this.observeComponentCreation(((e, t) => { 554 ViewStackProcessor.StartGetAccessRecordingFor(e); 555 Column.create(); 556 Column.alignItems(HorizontalAlign.Start); 557 Column.onAppear((() => { 558 this.isDuplicateLine = !0 559 })); 560 Column.margin({ 561 left: { 562 id: -1, 563 type: 10002, 564 params: ["sys.float.ohos_id_max_padding_start"], 565 bundleName: "", 566 moduleName: "" 567 }, 568 right: 4, 569 bottom: 8 570 }); 571 t || Column.pop(); 572 ViewStackProcessor.StopGetAccessRecording() 573 })); 574 this.observeComponentCreation(((t, o) => { 575 ViewStackProcessor.StartGetAccessRecordingFor(t); 576 Text.create(e.content); 577 Text.fontColor({ 578 id: -1, 579 type: 10001, 580 params: ["sys.color.ohos_id_color_text_primary"], 581 bundleName: "", 582 moduleName: "" 583 }); 584 Text.fontSize({ 585 id: -1, 586 type: 10002, 587 params: ["sys.float.ohos_id_text_size_sub_title1"], 588 bundleName: "", 589 moduleName: "" 590 }); 591 Text.fontWeight(FontWeight.Medium); 592 Text.maxLines(1); 593 Text.maxFontSize({ 594 id: -1, 595 type: 10002, 596 params: ["sys.float.ohos_id_text_size_sub_title1"], 597 bundleName: "", 598 moduleName: "" 599 }); 600 Text.minFontSize(14); 601 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 602 o || Text.pop(); 603 ViewStackProcessor.StopGetAccessRecording() 604 })); 605 Text.pop(); 606 this.observeComponentCreation(((t, o) => { 607 ViewStackProcessor.StartGetAccessRecordingFor(t); 608 Text.create(e.subContent); 609 Text.fontColor({ 610 id: -1, 611 type: 10001, 612 params: ["sys.color.ohos_id_color_text_secondary"], 613 bundleName: "", 614 moduleName: "" 615 }); 616 Text.fontSize({ 617 id: -1, 618 type: 10002, 619 params: ["sys.float.ohos_id_text_size_sub_title3"], 620 bundleName: "", 621 moduleName: "" 622 }); 623 Text.fontWeight(FontWeight.Medium); 624 Text.maxLines(1); 625 Text.maxFontSize({ 626 id: -1, 627 type: 10002, 628 params: ["sys.float.ohos_id_text_size_sub_title3"], 629 bundleName: "", 630 moduleName: "" 631 }); 632 Text.minFontSize(10); 633 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 634 o || Text.pop(); 635 ViewStackProcessor.StopGetAccessRecording() 636 })); 637 Text.pop(); 638 Column.pop() 639 } 640 641 SelectStyle(e, t = null) { 642 this.observeComponentCreation(((t, o) => { 643 ViewStackProcessor.StartGetAccessRecordingFor(t); 644 Select.create(e.options); 645 Select.selected(e.selected); 646 Select.value(e.value); 647 Select.onSelect(((t, o) => { 648 e.onSelect && e.onSelect(t, o) 649 })); 650 Select.font({ 651 size: { 652 id: -1, 653 type: 10002, 654 params: ["sys.float.ohos_id_text_size_sub_title1"], 655 bundleName: "", 656 moduleName: "" 657 }, 658 weight: FontWeight.Medium 659 }); 660 Select.margin({ 661 left: { 662 id: -1, 663 type: 10002, 664 params: ["sys.float.ohos_id_default_padding_start"], 665 bundleName: "", 666 moduleName: "" 667 }, 668 right: 4 669 }); 670 o || Select.pop(); 671 ViewStackProcessor.StopGetAccessRecording() 672 })); 673 Select.pop() 674 } 675 676 LoadingProcessStyle(e = null) { 677 this.observeComponentCreation(((e, t) => { 678 ViewStackProcessor.StartGetAccessRecordingFor(e); 679 LoadingProgress.create(); 680 LoadingProgress.width(24); 681 LoadingProgress.height(24); 682 LoadingProgress.focusable(!0); 683 LoadingProgress.margin({ 684 right: { 685 id: -1, 686 type: 10002, 687 params: ["sys.float.ohos_id_default_padding_end"], 688 bundleName: "", 689 moduleName: "" 690 }, 691 bottom: 4 692 }); 693 t || LoadingProgress.pop(); 694 ViewStackProcessor.StopGetAccessRecording() 695 })) 696 } 697 698 TextArrowStyle(e, t = null) { 699 this.observeComponentCreation(((e, t) => { 700 ViewStackProcessor.StartGetAccessRecordingFor(e); 701 Row.create(); 702 Row.onAreaChange(((e, t) => { 703 this.textArrowWidth = Number(parseInt(t.width.toString(), 0)) 704 })); 705 Row.constraintSize({ minWidth: this.flexWidth / 3 }); 706 Row.justifyContent(FlexAlign.End); 707 Row.margin({ left: 8 }); 708 t || Row.pop(); 709 ViewStackProcessor.StopGetAccessRecording() 710 })); 711 this.observeComponentCreation(((e, t) => { 712 ViewStackProcessor.StartGetAccessRecordingFor(e); 713 Stack.create(); 714 t || Stack.pop(); 715 ViewStackProcessor.StopGetAccessRecording() 716 })); 717 this.observeComponentCreation(((t, o) => { 718 ViewStackProcessor.StartGetAccessRecordingFor(t); 719 Row.create(); 720 Row.height(32); 721 Row.justifyContent(FlexAlign.End); 722 Row.onFocus((() => { 723 this.textArrowFocus = !0 724 })); 725 Row.onBlur((() => { 726 this.textArrowFocus = !1 727 })); 728 Row.borderRadius(4); 729 Row.focusable(!0); 730 Row.margin({ left: 4, right: 4 }); 731 Row.backgroundColor(ObservedObject.GetRawObject(this.textArrowBgColor)); 732 Row.onTouch((t => { 733 if (t.type === TouchType.Down) { 734 e.action && e.action(); 735 this.textArrowBgColor = { 736 id: -1, 737 type: 10001, 738 params: ["sys.color.ohos_id_color_click_effect"], 739 bundleName: "", 740 moduleName: "" 741 } 742 } 743 t.type === TouchType.Up && (this.textArrowBgColor = { 744 id: -1, 745 type: 10001, 746 params: ["sys.color.ohos_id_color_sub_background_transparent"], 747 bundleName: "", 748 moduleName: "" 749 }) 750 })); 751 Row.onHover((e => { 752 this.textArrowBgColor = e ? { 753 id: -1, 754 type: 10001, 755 params: ["sys.color.ohos_id_color_hover"], 756 bundleName: "", 757 moduleName: "" 758 } : { 759 id: -1, 760 type: 10001, 761 params: ["sys.color.ohos_id_color_sub_background_transparent"], 762 bundleName: "", 763 moduleName: "" 764 } 765 })); 766 Row.onKeyEvent((t => { 767 t.keyCode !== KeyCode.KEYCODE_ENTER && t.keyCode !== KeyCode.KEYCODE_SPACE || e.action && e.action() 768 })); 769 Row.onAreaChange(((e, t) => { 770 this.arrowWidth = Number(parseInt(t.width.toString(), 0)) 771 })); 772 o || Row.pop(); 773 ViewStackProcessor.StopGetAccessRecording() 774 })); 775 this.observeComponentCreation(((e, t) => { 776 ViewStackProcessor.StartGetAccessRecordingFor(e); 777 Row.create(); 778 Row.margin({ left: 8, right: 8 }); 779 t || Row.pop(); 780 ViewStackProcessor.StopGetAccessRecording() 781 })); 782 this.observeComponentCreation(((t, o) => { 783 ViewStackProcessor.StartGetAccessRecordingFor(t); 784 If.create(); 785 null != e ? this.ifElseBranchUpdateFunction(0, (() => { 786 this.observeComponentCreation(((t, o) => { 787 ViewStackProcessor.StartGetAccessRecordingFor(t); 788 Text.create(e.value); 789 Text.fontColor({ 790 id: -1, 791 type: 10001, 792 params: ["sys.color.ohos_id_color_text_secondary"], 793 bundleName: "", 794 moduleName: "" 795 }); 796 Text.fontSize({ 797 id: -1, 798 type: 10002, 799 params: ["sys.float.ohos_id_text_size_body2"], 800 bundleName: "", 801 moduleName: "" 802 }); 803 Text.margin({ right: 4 }); 804 Text.focusable(!0); 805 Text.maxLines(1); 806 Text.constraintSize({ maxWidth: this.textArrowWidth - 40 }); 807 o || Text.pop(); 808 ViewStackProcessor.StopGetAccessRecording() 809 })); 810 Text.pop() 811 })) : If.branchId(1); 812 o || If.pop(); 813 ViewStackProcessor.StopGetAccessRecording() 814 })); 815 If.pop(); 816 this.observeComponentCreation(((e, t) => { 817 ViewStackProcessor.StartGetAccessRecordingFor(e); 818 Image.create({ 819 id: -1, 820 type: 2e4, 821 params: ["sys.media.ohos_ic_public_arrow_right"], 822 bundleName: "", 823 moduleName: "" 824 }); 825 Image.fillColor({ 826 id: -1, 827 type: 10001, 828 params: ["sys.color.ohos_id_color_tertiary"], 829 bundleName: "", 830 moduleName: "" 831 }); 832 Image.width(12); 833 Image.height(24); 834 Image.focusable(!0); 835 t || Image.pop(); 836 ViewStackProcessor.StopGetAccessRecording() 837 })); 838 Row.pop(); 839 Row.pop(); 840 this.observeComponentCreation(((e, t) => { 841 ViewStackProcessor.StartGetAccessRecordingFor(e); 842 If.create(); 843 this.textArrowFocus ? this.ifElseBranchUpdateFunction(0, (() => { 844 this.observeComponentCreation(((e, t) => { 845 ViewStackProcessor.StartGetAccessRecordingFor(e); 846 Row.create(); 847 Row.height(32); 848 Row.width(this.arrowWidth); 849 Row.hitTestBehavior(HitTestMode.None); 850 Row.border({ 851 width: 2, 852 color: { 853 id: -1, 854 type: 10001, 855 params: ["sys.color.ohos_id_color_focused_outline"], 856 bundleName: "", 857 moduleName: "" 858 } 859 }); 860 Row.borderRadius(4); 861 t || Row.pop(); 862 ViewStackProcessor.StopGetAccessRecording() 863 })); 864 Row.pop() 865 })) : If.branchId(1); 866 t || If.pop(); 867 ViewStackProcessor.StopGetAccessRecording() 868 })); 869 If.pop(); 870 Stack.pop(); 871 Row.pop() 872 } 873 874 ButtonStyle(e, t = null) { 875 this.observeComponentCreation(((e, t) => { 876 ViewStackProcessor.StartGetAccessRecordingFor(e); 877 Row.create(); 878 Row.constraintSize({ minWidth: this.flexWidth / 3 }); 879 Row.justifyContent(FlexAlign.End); 880 Row.focusable(!0); 881 Row.margin({ left: 8 }); 882 t || Row.pop(); 883 ViewStackProcessor.StopGetAccessRecording() 884 })); 885 this.observeComponentCreation(((e, t) => { 886 ViewStackProcessor.StartGetAccessRecordingFor(e); 887 Stack.create(); 888 t || Stack.pop(); 889 ViewStackProcessor.StopGetAccessRecording() 890 })); 891 this.observeComponentCreation(((t, o) => { 892 ViewStackProcessor.StartGetAccessRecordingFor(t); 893 Row.create(); 894 Row.justifyContent(FlexAlign.End); 895 Row.alignItems(VerticalAlign.Center); 896 Row.focusable(!0); 897 Row.height(28); 898 Row.margin({ left: 8, right: 8 }); 899 Row.borderRadius(16); 900 Row.backgroundColor(ObservedObject.GetRawObject(this.buttonBgColor)); 901 Row.onFocus((() => { 902 this.buttonFocus = !0 903 })); 904 Row.onBlur((() => { 905 this.buttonFocus = !1 906 })); 907 Row.onTouch((t => { 908 if (t.type === TouchType.Down) { 909 e.action && e.action(); 910 this.buttonBgColor = { 911 id: -1, 912 type: 10001, 913 params: ["sys.color.ohos_id_color_click_effect"], 914 bundleName: "", 915 moduleName: "" 916 } 917 } 918 t.type === TouchType.Up && (this.buttonBgColor = { 919 id: -1, 920 type: 10001, 921 params: ["sys.color.ohos_id_color_sub_background_transparent"], 922 bundleName: "", 923 moduleName: "" 924 }) 925 })); 926 Row.onHover((e => { 927 this.buttonBgColor = e ? { 928 id: -1, 929 type: 10001, 930 params: ["sys.color.ohos_id_color_hover"], 931 bundleName: "", 932 moduleName: "" 933 } : { 934 id: -1, 935 type: 10001, 936 params: ["sys.color.ohos_id_color_sub_background_transparent"], 937 bundleName: "", 938 moduleName: "" 939 } 940 })); 941 Row.onKeyEvent((t => { 942 t.keyCode !== KeyCode.KEYCODE_ENTER && t.keyCode !== KeyCode.KEYCODE_SPACE || e.action && e.action() 943 })); 944 Row.onAreaChange(((e, t) => { 945 let o = Number(parseInt(t.width.toString(), 0)); 946 this.buttonWidth = o 947 })); 948 o || Row.pop(); 949 ViewStackProcessor.StopGetAccessRecording() 950 })); 951 this.observeComponentCreation(((t, o) => { 952 ViewStackProcessor.StartGetAccessRecordingFor(t); 953 If.create(); 954 null != e ? this.ifElseBranchUpdateFunction(0, (() => { 955 this.observeComponentCreation(((t, o) => { 956 ViewStackProcessor.StartGetAccessRecordingFor(t); 957 Text.create(e.value); 958 Text.maxLines(1); 959 Text.fontColor({ 960 id: -1, 961 type: 10001, 962 params: ["sys.color.ohos_id_color_text_primary_activated"], 963 bundleName: "", 964 moduleName: "" 965 }); 966 Text.fontSize({ 967 id: -1, 968 type: 10002, 969 params: ["sys.float.ohos_id_text_size_button2"], 970 bundleName: "", 971 moduleName: "" 972 }); 973 Text.fontWeight(FontWeight.Medium); 974 Text.margin({ left: 8, right: 8 }); 975 Text.focusable(!0); 976 o || Text.pop(); 977 ViewStackProcessor.StopGetAccessRecording() 978 })); 979 Text.pop() 980 })) : If.branchId(1); 981 o || If.pop(); 982 ViewStackProcessor.StopGetAccessRecording() 983 })); 984 If.pop(); 985 Row.pop(); 986 this.observeComponentCreation(((e, t) => { 987 ViewStackProcessor.StartGetAccessRecordingFor(e); 988 If.create(); 989 this.buttonFocus ? this.ifElseBranchUpdateFunction(0, (() => { 990 this.observeComponentCreation(((e, t) => { 991 ViewStackProcessor.StartGetAccessRecordingFor(e); 992 Row.create(); 993 Row.height(28); 994 Row.width(this.buttonWidth); 995 Row.hitTestBehavior(HitTestMode.None); 996 Row.border({ 997 width: 2, 998 color: { 999 id: -1, 1000 type: 10001, 1001 params: ["sys.color.ohos_id_color_focused_outline"], 1002 bundleName: "", 1003 moduleName: "" 1004 } 1005 }); 1006 Row.borderRadius(16); 1007 t || Row.pop(); 1008 ViewStackProcessor.StopGetAccessRecording() 1009 })); 1010 Row.pop() 1011 })) : If.branchId(1); 1012 t || If.pop(); 1013 ViewStackProcessor.StopGetAccessRecording() 1014 })); 1015 If.pop(); 1016 Stack.pop(); 1017 Row.pop() 1018 } 1019 1020 initialRender() { 1021 this.observeComponentCreation(((e, t) => { 1022 ViewStackProcessor.StartGetAccessRecordingFor(e); 1023 Flex.create({ justifyContent: FlexAlign.SpaceBetween, alignItems: ItemAlign.End }); 1024 Flex.focusable(!0); 1025 Flex.onAreaChange(((e, t) => { 1026 let o = Number(parseInt(t.width.toString(), 0)); 1027 this.flexWidth = o - 44 1028 })); 1029 Flex.padding({ 1030 right: { 1031 id: -1, 1032 type: 10002, 1033 params: ["sys.float.ohos_id_default_padding_end"], 1034 bundleName: "", 1035 moduleName: "" 1036 } 1037 }); 1038 Flex.height(this.isDuplicateLine ? 64 : 48); 1039 t || Flex.pop(); 1040 ViewStackProcessor.StopGetAccessRecording() 1041 })); 1042 this.observeComponentCreation(((e, t) => { 1043 ViewStackProcessor.StartGetAccessRecordingFor(e); 1044 If.create(); 1045 null != this.secondaryTitle && null != this.icon ? this.ifElseBranchUpdateFunction(0, (() => { 1046 this.observeComponentCreation(((e, t) => { 1047 ViewStackProcessor.StartGetAccessRecordingFor(e); 1048 Row.create(); 1049 Row.margin({ right: 8 }); 1050 t || Row.pop(); 1051 ViewStackProcessor.StopGetAccessRecording() 1052 })); 1053 this.ListIconStyle.bind(this)({ content: this.secondaryTitle }, ObservedObject.GetRawObject(this.icon)); 1054 Row.pop() 1055 })) : null != this.secondaryTitle && null != this.primaryTitle ? this.ifElseBranchUpdateFunction(1, (() => { 1056 this.SubTextStyle.bind(this)(makeBuilderParameterProxy("SubTextStyle", { 1057 content: () => this.__primaryTitle ? this.__primaryTitle : this.primaryTitle, 1058 subContent: () => this.__secondaryTitle ? this.__secondaryTitle : this.secondaryTitle 1059 })) 1060 })) : null != this.secondaryTitle ? this.ifElseBranchUpdateFunction(2, (() => { 1061 this.ListTextStyle.bind(this)(makeBuilderParameterProxy("ListTextStyle", { 1062 content: () => this.__secondaryTitle ? this.__secondaryTitle : this.secondaryTitle 1063 })) 1064 })) : null != this.select ? this.ifElseBranchUpdateFunction(3, (() => { 1065 this.SelectStyle.bind(this)(ObservedObject.GetRawObject(this.select)) 1066 })) : null != this.primaryTitle && this.ifElseBranchUpdateFunction(4, (() => { 1067 this.ContentTextStyle.bind(this)(makeBuilderParameterProxy("ContentTextStyle", { 1068 content: () => this.__primaryTitle ? this.__primaryTitle : this.primaryTitle 1069 })) 1070 })); 1071 t || If.pop(); 1072 ViewStackProcessor.StopGetAccessRecording() 1073 })); 1074 If.pop(); 1075 this.observeComponentCreation(((e, t) => { 1076 ViewStackProcessor.StartGetAccessRecordingFor(e); 1077 Row.create(); 1078 t || Row.pop(); 1079 ViewStackProcessor.StopGetAccessRecording() 1080 })); 1081 this.observeComponentCreation(((e, t) => { 1082 ViewStackProcessor.StartGetAccessRecordingFor(e); 1083 If.create(); 1084 this.operationType === OperationType.BUTTON && null != this.operationItem ? this.ifElseBranchUpdateFunction(0, (() => { 1085 this.ButtonStyle.bind(this)(this.operationItem[0]) 1086 })) : If.branchId(1); 1087 t || If.pop(); 1088 ViewStackProcessor.StopGetAccessRecording() 1089 })); 1090 If.pop(); 1091 this.observeComponentCreation(((e, t) => { 1092 ViewStackProcessor.StartGetAccessRecordingFor(e); 1093 If.create(); 1094 this.operationType === OperationType.ICON_GROUP && null != this.operationItem ? this.ifElseBranchUpdateFunction(0, (() => { 1095 this.observeComponentCreation(((e, t) => { 1096 ViewStackProcessor.StartGetAccessRecordingFor(e); 1097 Row.create(); 1098 t || Row.pop(); 1099 ViewStackProcessor.StopGetAccessRecording() 1100 })); 1101 this.observeComponentCreation(((e, t) => { 1102 ViewStackProcessor.StartGetAccessRecordingFor(e); 1103 ForEach.create(); 1104 this.forEachUpdateFunction(e, this.operationItem, ((e, t) => { 1105 const o = e; 1106 this.observeComponentCreation(((e, r) => { 1107 ViewStackProcessor.StartGetAccessRecordingFor(e); 1108 If.create(); 1109 0 == t ? this.ifElseBranchUpdateFunction(0, (() => { 1110 this.observeComponentCreation(((e, t) => { 1111 ViewStackProcessor.StartGetAccessRecordingFor(e); 1112 t ? ViewPU.create(new IconGroup(this, { 1113 item: o 1114 }, void 0, e)) : this.updateStateVarsOfChildByElmtId(e, {}); 1115 ViewStackProcessor.StopGetAccessRecording() 1116 })) 1117 })) : If.branchId(1); 1118 r || If.pop(); 1119 ViewStackProcessor.StopGetAccessRecording() 1120 })); 1121 If.pop(); 1122 this.observeComponentCreation(((e, r) => { 1123 ViewStackProcessor.StartGetAccessRecordingFor(e); 1124 If.create(); 1125 1 == t ? this.ifElseBranchUpdateFunction(0, (() => { 1126 this.observeComponentCreation(((e, t) => { 1127 ViewStackProcessor.StartGetAccessRecordingFor(e); 1128 t ? ViewPU.create(new IconGroup(this, { 1129 item: o 1130 }, void 0, e)) : this.updateStateVarsOfChildByElmtId(e, {}); 1131 ViewStackProcessor.StopGetAccessRecording() 1132 })) 1133 })) : If.branchId(1); 1134 r || If.pop(); 1135 ViewStackProcessor.StopGetAccessRecording() 1136 })); 1137 If.pop(); 1138 this.observeComponentCreation(((e, r) => { 1139 ViewStackProcessor.StartGetAccessRecordingFor(e); 1140 If.create(); 1141 2 == t ? this.ifElseBranchUpdateFunction(0, (() => { 1142 this.observeComponentCreation(((e, t) => { 1143 ViewStackProcessor.StartGetAccessRecordingFor(e); 1144 t ? ViewPU.create(new IconGroup(this, { 1145 item: o 1146 }, void 0, e)) : this.updateStateVarsOfChildByElmtId(e, {}); 1147 ViewStackProcessor.StopGetAccessRecording() 1148 })) 1149 })) : If.branchId(1); 1150 r || If.pop(); 1151 ViewStackProcessor.StopGetAccessRecording() 1152 })); 1153 If.pop() 1154 }), void 0,!0,!1); 1155 t || ForEach.pop(); 1156 ViewStackProcessor.StopGetAccessRecording() 1157 })); 1158 ForEach.pop(); 1159 Row.pop() 1160 })) : If.branchId(1); 1161 t || If.pop(); 1162 ViewStackProcessor.StopGetAccessRecording() 1163 })); 1164 If.pop(); 1165 this.observeComponentCreation(((e, t) => { 1166 ViewStackProcessor.StartGetAccessRecordingFor(e); 1167 If.create(); 1168 this.operationType === OperationType.TEXT_ARROW && null != this.operationItem ? this.ifElseBranchUpdateFunction(0, (() => { 1169 this.TextArrowStyle.bind(this)(this.operationItem[0]) 1170 })) : If.branchId(1); 1171 t || If.pop(); 1172 ViewStackProcessor.StopGetAccessRecording() 1173 })); 1174 If.pop(); 1175 this.observeComponentCreation(((e, t) => { 1176 ViewStackProcessor.StartGetAccessRecordingFor(e); 1177 If.create(); 1178 this.operationType === OperationType.LOADING ? this.ifElseBranchUpdateFunction(0, (() => { 1179 this.LoadingProcessStyle.bind(this)() 1180 })) : If.branchId(1); 1181 t || If.pop(); 1182 ViewStackProcessor.StopGetAccessRecording() 1183 })); 1184 If.pop(); 1185 Row.pop(); 1186 Flex.pop() 1187 } 1188 1189 rerender() { 1190 this.updateDirtyElements() 1191 } 1192} 1193 1194export default { OperationType, SubHeader }