1/* 2 * Copyright (c) 2023-2024 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} 20const KeyCode = requireNapi('multimodalInput.keyCode').KeyCode; 21const MeasureText = requireNapi('measure'); 22const hilog = requireNapi('hilog'); 23const SymbolGlyphModifier = requireNapi('arkui.modifier').SymbolGlyphModifier; 24const LengthMetrics = requireNapi('arkui.node').LengthMetrics; 25const PUBLIC_MORE = { 26 'id': -1, 27 'type': 40000, 28 params: ['sys.symbol.dot_grid_2x2'], 29 'bundleName': '__harDefaultBundleName__', 30 'moduleName': '__harDefaultModuleName__', 31}; 32const TEXT_EDITABLE_DIALOG = '18.3fp'; 33const IMAGE_SIZE = '64vp'; 34const MAX_DIALOG = '256vp'; 35const MIN_DIALOG = '216vp'; 36const RESOURCE_TYPE_SYMBOL = 40000; 37 38class ButtonGestureModifier { 39 constructor(y47) { 40 this.fontSize = 1; 41 this.controller = null; 42 this.controller = y47; 43 } 44 45 applyGesture(x47) { 46 if (this.fontSize >= ButtonGestureModifier.minFontSize) { 47 x47.addGesture(new LongPressGestureHandler({ repeat: false, duration: ButtonGestureModifier.longPressTime }) 48 .onAction(() => { 49 if (x47) { 50 this.controller?.open(); 51 } 52 }) 53 .onActionEnd(() => { 54 this.controller?.close(); 55 })); 56 } else { 57 x47.clearGestures(); 58 } 59 } 60} 61 62ButtonGestureModifier.longPressTime = 500; 63ButtonGestureModifier.minFontSize = 1.75; 64 65export class TabTitleBar extends ViewPU { 66 constructor(r47, s47, t47, u47 = -1, v47 = undefined, w47) { 67 super(r47, t47, u47, w47); 68 if (typeof v47 === 'function') { 69 this.paramsGenerator_ = v47; 70 } 71 this.tabItems = []; 72 this.menuItems = []; 73 this.swiperContent = undefined; 74 this.__tabWidth = new ObservedPropertySimplePU(0, this, 'tabWidth'); 75 this.__currentIndex = new ObservedPropertySimplePU(0, this, 'currentIndex'); 76 this.__fontSize = new ObservedPropertySimplePU(1, this, 'fontSize'); 77 this.menuSectionWidth = 0; 78 this.tabOffsets = []; 79 this.imageWidths = []; 80 this.scroller = new Scroller(); 81 this.swiperController = new SwiperController(); 82 this.settings = new RenderingContextSettings(true); 83 this.leftContext2D = new CanvasRenderingContext2D(this.settings); 84 this.rightContext2D = new CanvasRenderingContext2D(this.settings); 85 this.setInitiallyProvidedValue(s47); 86 this.finalizeConstruction(); 87 } 88 89 setInitiallyProvidedValue(q47) { 90 if (q47.tabItems !== undefined) { 91 this.tabItems = q47.tabItems; 92 } 93 if (q47.menuItems !== undefined) { 94 this.menuItems = q47.menuItems; 95 } 96 if (q47.swiperContent !== undefined) { 97 this.swiperContent = q47.swiperContent; 98 } 99 if (q47.tabWidth !== undefined) { 100 this.tabWidth = q47.tabWidth; 101 } 102 if (q47.currentIndex !== undefined) { 103 this.currentIndex = q47.currentIndex; 104 } 105 if (q47.fontSize !== undefined) { 106 this.fontSize = q47.fontSize; 107 } 108 if (q47.menuSectionWidth !== undefined) { 109 this.menuSectionWidth = q47.menuSectionWidth; 110 } 111 if (q47.tabOffsets !== undefined) { 112 this.tabOffsets = q47.tabOffsets; 113 } 114 if (q47.imageWidths !== undefined) { 115 this.imageWidths = q47.imageWidths; 116 } 117 if (q47.scroller !== undefined) { 118 this.scroller = q47.scroller; 119 } 120 if (q47.swiperController !== undefined) { 121 this.swiperController = q47.swiperController; 122 } 123 if (q47.settings !== undefined) { 124 this.settings = q47.settings; 125 } 126 if (q47.leftContext2D !== undefined) { 127 this.leftContext2D = q47.leftContext2D; 128 } 129 if (q47.rightContext2D !== undefined) { 130 this.rightContext2D = q47.rightContext2D; 131 } 132 } 133 134 updateStateVars(p47) { 135 } 136 137 purgeVariableDependenciesOnElmtId(o47) { 138 this.__tabWidth.purgeDependencyOnElmtId(o47); 139 this.__currentIndex.purgeDependencyOnElmtId(o47); 140 this.__fontSize.purgeDependencyOnElmtId(o47); 141 } 142 143 aboutToBeDeleted() { 144 this.__tabWidth.aboutToBeDeleted(); 145 this.__currentIndex.aboutToBeDeleted(); 146 this.__fontSize.aboutToBeDeleted(); 147 SubscriberManager.Get().delete(this.id__()); 148 this.aboutToBeDeletedInternal(); 149 } 150 151 get tabWidth() { 152 return this.__tabWidth.get(); 153 } 154 155 set tabWidth(n47) { 156 this.__tabWidth.set(n47); 157 } 158 159 get currentIndex() { 160 return this.__currentIndex.get(); 161 } 162 163 set currentIndex(m47) { 164 this.__currentIndex.set(m47); 165 } 166 167 get fontSize() { 168 return this.__fontSize.get(); 169 } 170 171 set fontSize(l47) { 172 this.__fontSize.set(l47); 173 } 174 175 GradientMask(a47, b47, c47, d47, e47, f47 = null) { 176 this.observeComponentCreation2((j47, k47) => { 177 Column.create(); 178 Column.blendMode(BlendMode.DST_OUT); 179 Column.width(TabTitleBar.gradientMaskWidth); 180 Column.height(TabTitleBar.totalHeight); 181 }, Column); 182 this.observeComponentCreation2((g47, h47) => { 183 Canvas.create(a47); 184 Canvas.width(TabTitleBar.gradientMaskWidth); 185 Canvas.height(TabTitleBar.totalHeight); 186 Canvas.onReady(() => { 187 let i47 = a47.createLinearGradient(b47, c47, d47, e47); 188 i47.addColorStop(0.0, '#ffffffff'); 189 i47.addColorStop(1, '#00ffffff'); 190 a47.fillStyle = i47; 191 a47.fillRect(0, 0, TabTitleBar.gradientMaskWidth, TabTitleBar.totalHeight); 192 }); 193 }, Canvas); 194 Canvas.pop(); 195 Column.pop(); 196 } 197 198 emptyBuilder(z46 = null) { 199 } 200 201 aboutToAppear() { 202 if (!this.swiperContent) { 203 this.swiperContent = this.emptyBuilder; 204 } 205 this.tabItems.forEach((y46) => { 206 this.imageWidths.push(0); 207 }); 208 this.loadOffsets(); 209 } 210 211 loadOffsets() { 212 this.tabOffsets.length = 0; 213 let v46 = 0; 214 this.tabOffsets.push(v46); 215 v46 += TabContentItem.marginFirst; 216 this.tabItems.forEach((w46, x46) => { 217 if (w46.icon !== undefined || w46.symbolStyle !== undefined) { 218 if (Math.abs(this.imageWidths[x46]) > TabContentItem.imageHotZoneWidth) { 219 v46 += this.imageWidths[x46]; 220 } else { 221 v46 += TabContentItem.imageHotZoneWidth; 222 } 223 } else { 224 v46 += TabContentItem.paddingLeft; 225 v46 += px2vp(MeasureText.measureText({ 226 textContent: w46.title.toString(), 227 fontSize: 18, 228 fontWeight: FontWeight.Medium, 229 })); 230 v46 += TabContentItem.paddingRight; 231 } 232 this.tabOffsets.push(v46); 233 }); 234 } 235 236 initialRender() { 237 this.observeComponentCreation2((t46, u46) => { 238 Column.create(); 239 }, Column); 240 this.observeComponentCreation2((p46, q46) => { 241 Flex.create({ 242 justifyContent: FlexAlign.SpaceBetween, 243 alignItems: ItemAlign.Stretch 244 }); 245 Flex.backgroundColor({ 246 'id': -1, 247 'type': 10001, 248 params: ['sys.color.ohos_id_color_background'], 249 'bundleName': '__harDefaultBundleName__', 250 'moduleName': '__harDefaultModuleName__', 251 }); 252 Flex.margin({ 253 end: LengthMetrics.resource({ 254 'id': -1, 255 'type': 10002, 256 params: ['sys.float.ohos_id_max_padding_end'], 257 'bundleName': '__harDefaultBundleName__', 258 'moduleName': '__harDefaultModuleName__', 259 }) 260 }); 261 Flex.onAreaChange((r46, s46) => { 262 this.tabWidth = Number(s46.width) - this.menuSectionWidth; 263 }); 264 }, Flex); 265 this.observeComponentCreation2((n46, o46) => { 266 Stack.create({ alignContent: Alignment.End }); 267 Stack.blendMode(BlendMode.SRC_OVER, BlendApplyType.OFFSCREEN); 268 }, Stack); 269 this.observeComponentCreation2((l46, m46) => { 270 Stack.create({ alignContent: Alignment.Start }); 271 }, Stack); 272 this.observeComponentCreation2((j46, k46) => { 273 Column.create(); 274 }, Column); 275 this.observeComponentCreation2((h46, i46) => { 276 List.create({ initialIndex: 0, scroller: this.scroller, space: 0 }); 277 List.width('100%'); 278 List.height(TabTitleBar.totalHeight); 279 List.constraintSize({ maxWidth: this.tabWidth }); 280 List.edgeEffect(EdgeEffect.Spring); 281 List.listDirection(Axis.Horizontal); 282 List.scrollBar(BarState.Off); 283 }, List); 284 this.observeComponentCreation2((k45, l45) => { 285 ForEach.create(); 286 const a18 = (n45, o45) => { 287 const p45 = n45; 288 { 289 const b18 = (f46, g46) => { 290 ViewStackProcessor.StartGetAccessRecordingFor(f46); 291 c18(f46, g46); 292 if (!g46) { 293 ListItem.pop(); 294 } 295 ViewStackProcessor.StopGetAccessRecording(); 296 }; 297 const c18 = (d46, e46) => { 298 ListItem.create(d18, true); 299 }; 300 const d18 = (t45, u45) => { 301 b18(t45, u45); 302 { 303 this.observeComponentCreation2((v45, w45) => { 304 if (w45) { 305 let x45 = new TabContentItem(this, { 306 item: p45, 307 index: o45, 308 maxIndex: this.tabItems.length - 1, 309 currentIndex: this.currentIndex, 310 onCustomClick: (c46) => this.currentIndex = c46, 311 onImageComplete: (b46) => { 312 this.imageWidths[o45] = b46; 313 this.loadOffsets(); 314 } 315 }, undefined, v45, () => { 316 }, { page: 'library/src/main/ets/components/tabtitlebar.ets', line: 174, col: 21 }); 317 ViewPU.create(x45); 318 let e18 = () => { 319 return { 320 item: p45, 321 index: o45, 322 maxIndex: this.tabItems.length - 1, 323 currentIndex: this.currentIndex, 324 onCustomClick: (a46) => this.currentIndex = a46, 325 onImageComplete: (z45) => { 326 this.imageWidths[o45] = z45; 327 this.loadOffsets(); 328 } 329 }; 330 }; 331 x45.paramsGenerator_ = e18; 332 } else { 333 this.updateStateVarsOfChildByElmtId(v45, { 334 currentIndex: this.currentIndex 335 }); 336 } 337 }, { name: 'TabContentItem' }); 338 } 339 ListItem.pop(); 340 }; 341 this.observeComponentCreation2(c18, ListItem); 342 ListItem.pop(); 343 } 344 }; 345 this.forEachUpdateFunction(k45, this.tabItems, a18, undefined, true, false); 346 }, ForEach); 347 ForEach.pop(); 348 List.pop(); 349 Column.pop(); 350 this.GradientMask.bind(this)(this.leftContext2D, 0, TabTitleBar.totalHeight / 2, TabTitleBar.gradientMaskWidth, 351 TabTitleBar.totalHeight / 2); 352 Stack.pop(); 353 this.GradientMask.bind(this)(this.rightContext2D, TabTitleBar.gradientMaskWidth, TabTitleBar.totalHeight / 2, 0, 354 TabTitleBar.totalHeight / 2); 355 Stack.pop(); 356 this.observeComponentCreation2((a45, b45) => { 357 If.create(); 358 if (this.menuItems !== undefined && this.menuItems.length > 0) { 359 this.ifElseBranchUpdateFunction(0, () => { 360 this.observeComponentCreation2((g45, h45) => { 361 __Common__.create(); 362 __Common__.height(TabTitleBar.totalHeight); 363 __Common__.onAreaChange((i45, j45) => { 364 this.menuSectionWidth = Number(j45.width); 365 }); 366 }, __Common__); 367 { 368 this.observeComponentCreation2((c45, d45) => { 369 if (d45) { 370 let e45 = new CollapsibleMenuSection(this, 371 { menuItems: this.menuItems, index: 1 + TabTitleBar.instanceCount++ }, undefined, 372 c45, () => { 373 }, { page: 'library/src/main/ets/components/tabtitlebar.ets', line: 204, col: 11 }); 374 ViewPU.create(e45); 375 let z17 = () => { 376 return { 377 menuItems: this.menuItems, 378 index: 1 + TabTitleBar.instanceCount++ 379 }; 380 }; 381 e45.paramsGenerator_ = z17; 382 } else { 383 this.updateStateVarsOfChildByElmtId(c45, {}); 384 } 385 }, { name: 'CollapsibleMenuSection' }); 386 } 387 __Common__.pop(); 388 }); 389 } else { 390 this.ifElseBranchUpdateFunction(1, () => { 391 }); 392 } 393 }, If); 394 If.pop(); 395 Flex.pop(); 396 this.observeComponentCreation2((y44, z44) => { 397 Column.create(); 398 }, Column); 399 this.observeComponentCreation2((u44, v44) => { 400 Swiper.create(this.swiperController); 401 Swiper.index(this.currentIndex); 402 Swiper.itemSpace(0); 403 Swiper.indicator(false); 404 Swiper.width('100%'); 405 Swiper.height('100%'); 406 Swiper.curve(Curve.Friction); 407 Swiper.onChange((w44) => { 408 const x44 = this.tabOffsets[w44] + TabTitleBar.correctionOffset; 409 this.currentIndex = w44; 410 this.scroller.scrollTo({ 411 xOffset: x44 > 0 ? x44 : 0, 412 yOffset: 0, 413 animation: { 414 duration: 300, 415 curve: Curve.EaseInOut 416 } 417 }); 418 }); 419 Swiper.onAppear(() => { 420 this.scroller.scrollToIndex(this.currentIndex); 421 this.scroller.scrollBy(TabTitleBar.correctionOffset, 0); 422 }); 423 }, Swiper); 424 this.swiperContent.bind(this)(); 425 Swiper.pop(); 426 Column.pop(); 427 Column.pop(); 428 } 429 430 rerender() { 431 this.updateDirtyElements(); 432 } 433} 434TabTitleBar.totalHeight = 56; 435TabTitleBar.correctionOffset = -40.0; 436TabTitleBar.gradientMaskWidth = 24; 437TabTitleBar.instanceCount = 0; 438 439class CollapsibleMenuSection extends ViewPU { 440 constructor(m44, n44, o44, p44 = -1, q44 = undefined, r44) { 441 super(m44, o44, p44, r44); 442 if (typeof q44 === 'function') { 443 this.paramsGenerator_ = q44; 444 } 445 this.menuItems = []; 446 this.index = 0; 447 this.item = { 448 value: PUBLIC_MORE, 449 symbolStyle: new SymbolGlyphModifier(PUBLIC_MORE), 450 label: { 451 'id': -1, 452 'type': 10003, 453 params: ['sys.string.ohos_toolbar_more'], 454 'bundleName': '__harDefaultBundleName__', 455 'moduleName': '__harDefaultModuleName__', 456 }, 457 }; 458 this.minFontSize = 1.75; 459 this.isFollowingSystemFontScale = false; 460 this.maxFontScale = 1; 461 this.systemFontScale = 1; 462 this.firstFocusableIndex = -1; 463 this.__isPopupShown = new ObservedPropertySimplePU(false, this, 'isPopupShown'); 464 this.__isMoreIconOnFocus = new ObservedPropertySimplePU(false, this, 'isMoreIconOnFocus'); 465 this.__isMoreIconOnHover = new ObservedPropertySimplePU(false, this, 'isMoreIconOnHover'); 466 this.__isMoreIconOnClick = new ObservedPropertySimplePU(false, this, 'isMoreIconOnClick'); 467 this.__fontSize = new SynchedPropertySimpleOneWayPU(n44.fontSize, this, 'fontSize'); 468 this.dialogController = new CustomDialogController({ 469 builder: () => { 470 let s44 = new TabTitleBarDialog(this, { 471 cancel: () => { 472 }, 473 confirm: () => { 474 }, 475 tabTitleDialog: this.item, 476 tabTitleBarDialog: this.item.label ? this.item.label : '', 477 fontSize: this.fontSize, 478 }, undefined, -1, () => { 479 }, { page: 'library/src/main/ets/components/tabtitlebar.ets', line: 273, col: 14 }); 480 s44.setController(this.dialogController); 481 ViewPU.create(s44); 482 let y17 = () => { 483 return { 484 cancel: () => { 485 }, 486 confirm: () => { 487 }, 488 tabTitleDialog: this.item, 489 tabTitleBarDialog: this.item.label ? this.item.label : '', 490 fontSize: this.fontSize 491 }; 492 }; 493 s44.paramsGenerator_ = y17; 494 }, 495 maskColor: Color.Transparent, 496 isModal: true, 497 customStyle: true 498 }, this); 499 this.__buttonGestureModifier = 500 new ObservedPropertyObjectPU(new ButtonGestureModifier(this.dialogController), this, 501 'buttonGestureModifier'); 502 this.setInitiallyProvidedValue(n44); 503 this.declareWatch('fontSize', this.onFontSizeUpdated); 504 this.finalizeConstruction(); 505 } 506 507 setInitiallyProvidedValue(l44) { 508 if (l44.menuItems !== undefined) { 509 this.menuItems = l44.menuItems; 510 } 511 if (l44.index !== undefined) { 512 this.index = l44.index; 513 } 514 if (l44.item !== undefined) { 515 this.item = l44.item; 516 } 517 if (l44.minFontSize !== undefined) { 518 this.minFontSize = l44.minFontSize; 519 } 520 if (l44.isFollowingSystemFontScale !== undefined) { 521 this.isFollowingSystemFontScale = l44.isFollowingSystemFontScale; 522 } 523 if (l44.maxFontScale !== undefined) { 524 this.maxFontScale = l44.maxFontScale; 525 } 526 if (l44.systemFontScale !== undefined) { 527 this.systemFontScale = l44.systemFontScale; 528 } 529 if (l44.firstFocusableIndex !== undefined) { 530 this.firstFocusableIndex = l44.firstFocusableIndex; 531 } 532 if (l44.isPopupShown !== undefined) { 533 this.isPopupShown = l44.isPopupShown; 534 } 535 if (l44.isMoreIconOnFocus !== undefined) { 536 this.isMoreIconOnFocus = l44.isMoreIconOnFocus; 537 } 538 if (l44.isMoreIconOnHover !== undefined) { 539 this.isMoreIconOnHover = l44.isMoreIconOnHover; 540 } 541 if (l44.isMoreIconOnClick !== undefined) { 542 this.isMoreIconOnClick = l44.isMoreIconOnClick; 543 } 544 if (l44.fontSize === undefined) { 545 this.__fontSize.set(1); 546 } 547 if (l44.dialogController !== undefined) { 548 this.dialogController = l44.dialogController; 549 } 550 if (l44.buttonGestureModifier !== undefined) { 551 this.buttonGestureModifier = l44.buttonGestureModifier; 552 } 553 } 554 555 updateStateVars(k44) { 556 this.__fontSize.reset(k44.fontSize); 557 } 558 559 purgeVariableDependenciesOnElmtId(j44) { 560 this.__isPopupShown.purgeDependencyOnElmtId(j44); 561 this.__isMoreIconOnFocus.purgeDependencyOnElmtId(j44); 562 this.__isMoreIconOnHover.purgeDependencyOnElmtId(j44); 563 this.__isMoreIconOnClick.purgeDependencyOnElmtId(j44); 564 this.__fontSize.purgeDependencyOnElmtId(j44); 565 this.__buttonGestureModifier.purgeDependencyOnElmtId(j44); 566 } 567 568 aboutToBeDeleted() { 569 this.__isPopupShown.aboutToBeDeleted(); 570 this.__isMoreIconOnFocus.aboutToBeDeleted(); 571 this.__isMoreIconOnHover.aboutToBeDeleted(); 572 this.__isMoreIconOnClick.aboutToBeDeleted(); 573 this.__fontSize.aboutToBeDeleted(); 574 this.__buttonGestureModifier.aboutToBeDeleted(); 575 SubscriberManager.Get().delete(this.id__()); 576 this.aboutToBeDeletedInternal(); 577 } 578 579 get isPopupShown() { 580 return this.__isPopupShown.get(); 581 } 582 583 set isPopupShown(i44) { 584 this.__isPopupShown.set(i44); 585 } 586 587 get isMoreIconOnFocus() { 588 return this.__isMoreIconOnFocus.get(); 589 } 590 591 set isMoreIconOnFocus(h44) { 592 this.__isMoreIconOnFocus.set(h44); 593 } 594 595 get isMoreIconOnHover() { 596 return this.__isMoreIconOnHover.get(); 597 } 598 599 set isMoreIconOnHover(g44) { 600 this.__isMoreIconOnHover.set(g44); 601 } 602 603 get isMoreIconOnClick() { 604 return this.__isMoreIconOnClick.get(); 605 } 606 607 set isMoreIconOnClick(f44) { 608 this.__isMoreIconOnClick.set(f44); 609 } 610 611 get fontSize() { 612 return this.__fontSize.get(); 613 } 614 615 set fontSize(e44) { 616 this.__fontSize.set(e44); 617 } 618 619 get buttonGestureModifier() { 620 return this.__buttonGestureModifier.get(); 621 } 622 623 set buttonGestureModifier(d44) { 624 this.__buttonGestureModifier.set(d44); 625 } 626 627 getMoreIconFgColor() { 628 return this.isMoreIconOnClick 629 ? { 630 'id': -1, 631 'type': 10001, 632 params: ['sys.color.ohos_id_color_titlebar_icon_pressed'], 633 'bundleName': '__harDefaultBundleName__', 634 'moduleName': '__harDefaultModuleName__', 635 } : { 636 'id': -1, 637 'type': 10001, 638 params: ['sys.color.ohos_id_color_titlebar_icon'], 639 'bundleName': '__harDefaultBundleName__', 640 'moduleName': '__harDefaultModuleName__', 641 }; 642 } 643 644 getMoreIconBgColor() { 645 if (this.isMoreIconOnClick) { 646 return { 647 'id': -1, 648 'type': 10001, 649 params: ['sys.color.ohos_id_color_click_effect'], 650 'bundleName': '__harDefaultBundleName__', 651 'moduleName': '__harDefaultModuleName__', 652 }; 653 } else if (this.isMoreIconOnHover) { 654 return { 655 'id': -1, 656 'type': 10001, 657 params: ['sys.color.ohos_id_color_hover'], 658 'bundleName': '__harDefaultBundleName__', 659 'moduleName': '__harDefaultModuleName__', 660 }; 661 } else { 662 return Color.Transparent; 663 } 664 } 665 666 aboutToAppear() { 667 try { 668 let c44 = this.getUIContext(); 669 this.isFollowingSystemFontScale = c44.isFollowingSystemFontScale(); 670 this.maxFontScale = c44.getMaxFontScale(); 671 } catch (z43) { 672 let a44 = z43?.code; 673 let b44 = z43?.message; 674 hilog.error(0x3900, 'Ace', `Faild to decideFontScale,cause, code: ${a44}, message: ${b44}`); 675 } 676 this.menuItems.forEach((x43, y43) => { 677 if (x43.isEnabled && this.firstFocusableIndex === -1 && 678 y43 > CollapsibleMenuSection.maxCountOfVisibleItems - 2) { 679 this.firstFocusableIndex = this.index * 1000 + y43 + 1; 680 } 681 }); 682 this.fontSize = this.decideFontScale(); 683 } 684 685 decideFontScale() { 686 let w43 = this.getUIContext(); 687 this.systemFontScale = w43.getHostContext()?.config?.fontSizeScale ?? 1; 688 if (!this.isFollowingSystemFontScale) { 689 return 1; 690 } 691 return Math.min(this.systemFontScale, this.maxFontScale); 692 } 693 694 onFontSizeUpdated() { 695 this.buttonGestureModifier.fontSize = this.fontSize; 696 } 697 698 initialRender() { 699 this.observeComponentCreation2((u43, v43) => { 700 Column.create(); 701 Column.height('100%'); 702 Column.justifyContent(FlexAlign.Center); 703 }, Column); 704 this.observeComponentCreation2((s43, t43) => { 705 Row.create(); 706 }, Row); 707 this.observeComponentCreation2((o42, p42) => { 708 If.create(); 709 if (this.menuItems.length <= CollapsibleMenuSection.maxCountOfVisibleItems) { 710 this.ifElseBranchUpdateFunction(0, () => { 711 this.observeComponentCreation2((i43, j43) => { 712 ForEach.create(); 713 const w17 = (l43, m43) => { 714 const n43 = l43; 715 { 716 this.observeComponentCreation2((o43, p43) => { 717 if (p43) { 718 let q43 = 719 new ImageMenuItem(this, { item: n43, index: this.index * 1000 + m43 + 1 }, 720 undefined, o43, () => { 721 }, { 722 page: 'library/src/main/ets/components/tabtitlebar.ets', 723 line: 342, 724 col: 13 725 }); 726 ViewPU.create(q43); 727 let x17 = () => { 728 return { 729 item: n43, 730 index: this.index * 1000 + m43 + 1 731 }; 732 }; 733 q43.paramsGenerator_ = x17; 734 } else { 735 this.updateStateVarsOfChildByElmtId(o43, {}); 736 } 737 }, { name: 'ImageMenuItem' }); 738 } 739 }; 740 this.forEachUpdateFunction(i43, this.menuItems, w17, undefined, true, false); 741 }, ForEach); 742 ForEach.pop(); 743 }); 744 } else { 745 this.ifElseBranchUpdateFunction(1, () => { 746 this.observeComponentCreation2((y42, z42) => { 747 ForEach.create(); 748 const u17 = (b43, c43) => { 749 const d43 = b43; 750 { 751 this.observeComponentCreation2((e43, f43) => { 752 if (f43) { 753 let g43 = 754 new ImageMenuItem(this, { item: d43, index: this.index * 1000 + c43 + 1 }, 755 undefined, e43, () => { 756 }, { 757 page: 'library/src/main/ets/components/tabtitlebar.ets', 758 line: 347, 759 col: 15 760 }); 761 ViewPU.create(g43); 762 let v17 = () => { 763 return { 764 item: d43, 765 index: this.index * 1000 + c43 + 1 766 }; 767 }; 768 g43.paramsGenerator_ = v17; 769 } else { 770 this.updateStateVarsOfChildByElmtId(e43, {}); 771 } 772 }, { name: 'ImageMenuItem' }); 773 } 774 }; 775 this.forEachUpdateFunction(y42, 776 this.menuItems.slice(0, CollapsibleMenuSection.maxCountOfVisibleItems - 1), u17, undefined, 777 true, false); 778 }, ForEach); 779 ForEach.pop(); 780 this.observeComponentCreation2((s42, t42) => { 781 Button.createWithChild({ type: ButtonType.Normal, stateEffect: true }); 782 Button.accessibilityText({ 783 'id': -1, 784 'type': 10003, 785 params: ['sys.string.ohos_toolbar_more'], 786 'bundleName': '__harDefaultBundleName__', 787 'moduleName': '__harDefaultModuleName__', 788 }); 789 Button.width(ImageMenuItem.imageHotZoneWidth); 790 Button.height(ImageMenuItem.imageHotZoneWidth); 791 Button.borderRadius(ImageMenuItem.buttonBorderRadius); 792 Button.foregroundColor(this.getMoreIconFgColor()); 793 Button.backgroundColor(this.getMoreIconBgColor()); 794 ViewStackProcessor.visualState('focused'); 795 Button.border({ 796 radius: { 797 'id': -1, 798 'type': 10002, 799 params: ['sys.float.ohos_id_corner_radius_clicked'], 800 'bundleName': '__harDefaultBundleName__', 801 'moduleName': '__harDefaultModuleName__', 802 }, 803 width: ImageMenuItem.focusBorderWidth, 804 color: { 805 'id': -1, 806 'type': 10001, 807 params: ['sys.color.ohos_id_color_focused_outline'], 808 'bundleName': '__harDefaultBundleName__', 809 'moduleName': '__harDefaultModuleName__', 810 }, 811 style: BorderStyle.Solid 812 }); 813 ViewStackProcessor.visualState('normal'); 814 Button.border({ 815 radius: { 816 'id': -1, 817 'type': 10002, 818 params: ['sys.float.ohos_id_corner_radius_clicked'], 819 'bundleName': '__harDefaultBundleName__', 820 'moduleName': '__harDefaultModuleName__', 821 }, 822 width: 0 823 }); 824 ViewStackProcessor.visualState(); 825 Button.onFocus(() => this.isMoreIconOnFocus = true); 826 Button.onBlur(() => this.isMoreIconOnFocus = false); 827 Button.onHover((x42) => this.isMoreIconOnHover = x42); 828 Button.onKeyEvent((w42) => { 829 if (w42.keyCode !== KeyCode.KEYCODE_ENTER && w42.keyCode !== KeyCode.KEYCODE_SPACE) { 830 return; 831 } 832 if (w42.type === KeyType.Down) { 833 this.isMoreIconOnClick = true; 834 } 835 if (w42.type === KeyType.Up) { 836 this.isMoreIconOnClick = false; 837 } 838 }); 839 Button.onTouch((v42) => { 840 if (v42.type === TouchType.Down) { 841 this.isMoreIconOnClick = true; 842 } 843 if (v42.type === TouchType.Up || v42.type === TouchType.Cancel) { 844 this.isMoreIconOnClick = false; 845 if (this.fontSize >= this.minFontSize) { 846 this.dialogController?.close(); 847 } 848 } 849 }); 850 Button.onClick(() => this.isPopupShown = true); 851 Button.gestureModifier(ObservedObject.GetRawObject(this.buttonGestureModifier)); 852 Button.bindPopup(this.isPopupShown, { 853 builder: { builder: this.popupBuilder.bind(this) }, 854 placement: Placement.Bottom, 855 popupColor: Color.White, 856 enableArrow: false, 857 onStateChange: (u42) => { 858 this.isPopupShown = u42.isVisible; 859 if (!u42.isVisible) { 860 this.isMoreIconOnClick = false; 861 } 862 } 863 }); 864 }, Button); 865 this.observeComponentCreation2((q42, r42) => { 866 SymbolGlyph.create(PUBLIC_MORE); 867 SymbolGlyph.fontSize(TabContentItem.symbolSize); 868 SymbolGlyph.draggable(false); 869 SymbolGlyph.fontColor([{ 870 'id': -1, 871 'type': 10001, 872 params: ['sys.color.icon_primary'], 873 'bundleName': '__harDefaultBundleName__', 874 'moduleName': '__harDefaultModuleName__', 875 }]); 876 SymbolGlyph.focusable(true); 877 }, SymbolGlyph); 878 Button.pop(); 879 }); 880 } 881 }, If); 882 If.pop(); 883 Row.pop(); 884 Column.pop(); 885 } 886 887 onPlaceChildren(k42, l42, m42) { 888 l42.forEach((n42) => { 889 n42.layout({ x: 0, y: 0 }); 890 }); 891 this.fontSize = this.decideFontScale(); 892 } 893 894 popupBuilder(x41 = null) { 895 this.observeComponentCreation2((i42, j42) => { 896 Column.create(); 897 Column.width(ImageMenuItem.imageHotZoneWidth + 898 CollapsibleMenuSection.focusPadding * CollapsibleMenuSection.marginsNum); 899 Column.margin({ top: CollapsibleMenuSection.focusPadding, bottom: CollapsibleMenuSection.focusPadding }); 900 Column.onAppear(() => { 901 focusControl.requestFocus(ImageMenuItem.focusablePrefix + this.firstFocusableIndex); 902 }); 903 }, Column); 904 this.observeComponentCreation2((y41, z41) => { 905 ForEach.create(); 906 const s17 = (b42, c42) => { 907 const d42 = b42; 908 { 909 this.observeComponentCreation2((e42, f42) => { 910 if (f42) { 911 let g42 = new ImageMenuItem(this, { 912 item: d42, index: this.index * 1000 + 913 CollapsibleMenuSection.maxCountOfVisibleItems + c42 914 }, undefined, e42, () => { 915 }, { page: 'library/src/main/ets/components/tabtitlebar.ets', line: 437, col: 11 }); 916 ViewPU.create(g42); 917 let t17 = () => { 918 return { 919 item: d42, 920 index: this.index * 1000 + 921 CollapsibleMenuSection.maxCountOfVisibleItems + c42 922 }; 923 }; 924 g42.paramsGenerator_ = t17; 925 } else { 926 this.updateStateVarsOfChildByElmtId(e42, {}); 927 } 928 }, { name: 'ImageMenuItem' }); 929 } 930 }; 931 this.forEachUpdateFunction(y41, 932 this.menuItems.slice(CollapsibleMenuSection.maxCountOfVisibleItems - 1, this.menuItems.length), s17, 933 undefined, true, false); 934 }, ForEach); 935 ForEach.pop(); 936 Column.pop(); 937 } 938 939 rerender() { 940 this.updateDirtyElements(); 941 } 942} 943 944CollapsibleMenuSection.maxCountOfVisibleItems = 1; 945CollapsibleMenuSection.focusPadding = 4; 946CollapsibleMenuSection.marginsNum = 2; 947 948class TabContentItem extends ViewPU { 949 constructor(r41, s41, t41, u41 = -1, v41 = undefined, w41) { 950 super(r41, t41, u41, w41); 951 if (typeof v41 === 'function') { 952 this.paramsGenerator_ = v41; 953 } 954 this.item = { title: '' }; 955 this.index = 0; 956 this.maxIndex = 0; 957 this.onCustomClick = undefined; 958 this.onImageComplete = undefined; 959 this.__currentIndex = new SynchedPropertySimpleOneWayPU(s41.currentIndex, this, 'currentIndex'); 960 this.__isOnFocus = new ObservedPropertySimplePU(false, this, 'isOnFocus'); 961 this.__isOnHover = new ObservedPropertySimplePU(false, this, 'isOnHover'); 962 this.__isOnClick = new ObservedPropertySimplePU(false, this, 'isOnClick'); 963 this.__tabWidth = new ObservedPropertySimplePU(0, this, 'tabWidth'); 964 this.__imageWidth = new ObservedPropertySimplePU(24, this, 'imageWidth'); 965 this.__imageHeight = new ObservedPropertySimplePU(24, this, 'imageHeight'); 966 this.setInitiallyProvidedValue(s41); 967 this.finalizeConstruction(); 968 } 969 970 setInitiallyProvidedValue(q41) { 971 if (q41.item !== undefined) { 972 this.item = q41.item; 973 } 974 if (q41.index !== undefined) { 975 this.index = q41.index; 976 } 977 if (q41.maxIndex !== undefined) { 978 this.maxIndex = q41.maxIndex; 979 } 980 if (q41.onCustomClick !== undefined) { 981 this.onCustomClick = q41.onCustomClick; 982 } 983 if (q41.onImageComplete !== undefined) { 984 this.onImageComplete = q41.onImageComplete; 985 } 986 if (q41.isOnFocus !== undefined) { 987 this.isOnFocus = q41.isOnFocus; 988 } 989 if (q41.isOnHover !== undefined) { 990 this.isOnHover = q41.isOnHover; 991 } 992 if (q41.isOnClick !== undefined) { 993 this.isOnClick = q41.isOnClick; 994 } 995 if (q41.tabWidth !== undefined) { 996 this.tabWidth = q41.tabWidth; 997 } 998 if (q41.imageWidth !== undefined) { 999 this.imageWidth = q41.imageWidth; 1000 } 1001 if (q41.imageHeight !== undefined) { 1002 this.imageHeight = q41.imageHeight; 1003 } 1004 } 1005 1006 updateStateVars(p41) { 1007 this.__currentIndex.reset(p41.currentIndex); 1008 } 1009 1010 purgeVariableDependenciesOnElmtId(o41) { 1011 this.__currentIndex.purgeDependencyOnElmtId(o41); 1012 this.__isOnFocus.purgeDependencyOnElmtId(o41); 1013 this.__isOnHover.purgeDependencyOnElmtId(o41); 1014 this.__isOnClick.purgeDependencyOnElmtId(o41); 1015 this.__tabWidth.purgeDependencyOnElmtId(o41); 1016 this.__imageWidth.purgeDependencyOnElmtId(o41); 1017 this.__imageHeight.purgeDependencyOnElmtId(o41); 1018 } 1019 1020 aboutToBeDeleted() { 1021 this.__currentIndex.aboutToBeDeleted(); 1022 this.__isOnFocus.aboutToBeDeleted(); 1023 this.__isOnHover.aboutToBeDeleted(); 1024 this.__isOnClick.aboutToBeDeleted(); 1025 this.__tabWidth.aboutToBeDeleted(); 1026 this.__imageWidth.aboutToBeDeleted(); 1027 this.__imageHeight.aboutToBeDeleted(); 1028 SubscriberManager.Get().delete(this.id__()); 1029 this.aboutToBeDeletedInternal(); 1030 } 1031 1032 get currentIndex() { 1033 return this.__currentIndex.get(); 1034 } 1035 1036 set currentIndex(n41) { 1037 this.__currentIndex.set(n41); 1038 } 1039 1040 get isOnFocus() { 1041 return this.__isOnFocus.get(); 1042 } 1043 1044 set isOnFocus(m41) { 1045 this.__isOnFocus.set(m41); 1046 } 1047 1048 get isOnHover() { 1049 return this.__isOnHover.get(); 1050 } 1051 1052 set isOnHover(l41) { 1053 this.__isOnHover.set(l41); 1054 } 1055 1056 get isOnClick() { 1057 return this.__isOnClick.get(); 1058 } 1059 1060 set isOnClick(k41) { 1061 this.__isOnClick.set(k41); 1062 } 1063 1064 get tabWidth() { 1065 return this.__tabWidth.get(); 1066 } 1067 1068 set tabWidth(j41) { 1069 this.__tabWidth.set(j41); 1070 } 1071 1072 get imageWidth() { 1073 return this.__imageWidth.get(); 1074 } 1075 1076 set imageWidth(i41) { 1077 this.__imageWidth.set(i41); 1078 } 1079 1080 get imageHeight() { 1081 return this.__imageHeight.get(); 1082 } 1083 1084 set imageHeight(h41) { 1085 this.__imageHeight.set(h41); 1086 } 1087 1088 getBgColor() { 1089 if (this.isOnClick) { 1090 return { 1091 'id': -1, 1092 'type': 10001, 1093 params: ['sys.color.ohos_id_color_click_effect'], 1094 'bundleName': '__harDefaultBundleName__', 1095 'moduleName': '__harDefaultModuleName__', 1096 }; 1097 } else if (this.isOnHover) { 1098 return { 1099 'id': -1, 1100 'type': 10001, 1101 params: ['sys.color.ohos_id_color_hover'], 1102 'bundleName': '__harDefaultBundleName__', 1103 'moduleName': '__harDefaultModuleName__', 1104 }; 1105 } else { 1106 return Color.Transparent; 1107 } 1108 } 1109 1110 getBorderAttr() { 1111 if (this.isOnFocus) { 1112 return { 1113 radius: { 1114 'id': -1, 1115 'type': 10002, 1116 params: ['sys.float.ohos_id_corner_radius_clicked'], 1117 'bundleName': '__harDefaultBundleName__', 1118 'moduleName': '__harDefaultModuleName__', 1119 }, 1120 width: TabContentItem.focusBorderWidth, 1121 color: { 1122 'id': -1, 1123 'type': 10001, 1124 params: ['sys.color.ohos_id_color_focused_outline'], 1125 'bundleName': '__harDefaultBundleName__', 1126 'moduleName': '__harDefaultModuleName__', 1127 }, 1128 style: BorderStyle.Solid 1129 }; 1130 } 1131 return { width: 0 }; 1132 } 1133 1134 getImageScaleFactor() { 1135 return this.index === this.currentIndex ? TabContentItem.imageMagnificationFactor : 1; 1136 } 1137 1138 getImageLayoutWidth() { 1139 return TabContentItem.imageSize / Math.max(this.imageHeight, 1.0) * this.imageWidth; 1140 } 1141 1142 toStringFormat(c41) { 1143 if (typeof c41 === 'string') { 1144 return c41; 1145 } else if (typeof c41 === 'undefined') { 1146 return ''; 1147 } else { 1148 let d41 = ''; 1149 try { 1150 d41 = getContext()?.resourceManager?.getStringSync(c41); 1151 } catch (e41) { 1152 let f41 = e41?.code; 1153 let g41 = e41?.message; 1154 hilog.error(0x3900, 'Ace', `Faild to TabTitleBar toStringFormat,code: ${f41},message:${g41}`); 1155 } 1156 return d41; 1157 } 1158 } 1159 1160 initialRender() { 1161 this.observeComponentCreation2((a41, b41) => { 1162 Stack.create(); 1163 Stack.margin({ 1164 left: this.index === 0 ? TabContentItem.marginFirst : 0, 1165 right: this.index === this.maxIndex ? 12 : 0 1166 }); 1167 }, Stack); 1168 this.observeComponentCreation2((w40, x40) => { 1169 Row.create(); 1170 Row.height(TabTitleBar.totalHeight); 1171 Row.alignItems(VerticalAlign.Center); 1172 Row.justifyContent(FlexAlign.Center); 1173 Row.borderRadius(TabContentItem.buttonBorderRadius); 1174 Row.backgroundColor(this.getBgColor()); 1175 Row.onAreaChange((y40, z40) => { 1176 this.tabWidth = Number(z40.width); 1177 }); 1178 }, Row); 1179 this.observeComponentCreation2((u40, v40) => { 1180 Column.create(); 1181 Column.justifyContent(FlexAlign.Center); 1182 }, Column); 1183 this.observeComponentCreation2((w39, x39) => { 1184 If.create(); 1185 if (this.item.icon === undefined && this.item.symbolStyle === undefined) { 1186 this.ifElseBranchUpdateFunction(0, () => { 1187 this.observeComponentCreation2((p40, q40) => { 1188 Text.create(this.item.title); 1189 Context.animation({ duration: 300 }); 1190 Text.fontSize(this.index === this.currentIndex 1191 ? { 1192 'id': -1, 1193 'type': 10002, 1194 params: ['sys.float.ohos_id_text_size_headline7'], 1195 'bundleName': '__harDefaultBundleName__', 1196 'moduleName': '__harDefaultModuleName__', 1197 } : { 1198 'id': -1, 1199 'type': 10002, 1200 params: ['sys.float.ohos_id_text_size_headline9'], 1201 'bundleName': '__harDefaultBundleName__', 1202 'moduleName': '__harDefaultModuleName__', 1203 }); 1204 Text.fontColor(this.index === this.currentIndex 1205 ? { 1206 'id': -1, 1207 'type': 10001, 1208 params: ['sys.color.ohos_id_color_titlebar_text'], 1209 'bundleName': '__harDefaultBundleName__', 1210 'moduleName': '__harDefaultModuleName__', 1211 } : { 1212 'id': -1, 1213 'type': 10001, 1214 params: ['sys.color.ohos_id_color_titlebar_text_off'], 1215 'bundleName': '__harDefaultBundleName__', 1216 'moduleName': '__harDefaultModuleName__', 1217 }); 1218 Text.fontWeight(FontWeight.Medium); 1219 Text.focusable(true); 1220 Context.animation(null); 1221 Text.padding({ 1222 top: this.index === this.currentIndex ? 6 : 10, 1223 left: TabContentItem.paddingLeft, 1224 bottom: 2, 1225 right: TabContentItem.paddingRight 1226 }); 1227 Text.onFocus(() => this.isOnFocus = true); 1228 Text.onBlur(() => this.isOnFocus = false); 1229 Text.onHover((t40) => this.isOnHover = t40); 1230 Text.onKeyEvent((s40) => { 1231 if (s40.keyCode !== KeyCode.KEYCODE_ENTER && s40.keyCode !== KeyCode.KEYCODE_SPACE) { 1232 return; 1233 } 1234 if (s40.type === KeyType.Down) { 1235 this.isOnClick = true; 1236 } 1237 if (s40.type === KeyType.Up) { 1238 this.isOnClick = false; 1239 } 1240 }); 1241 Text.onTouch((r40) => { 1242 if (r40.type === TouchType.Down) { 1243 this.isOnClick = true; 1244 } 1245 if (r40.type === TouchType.Up || r40.type === TouchType.Cancel) { 1246 this.isOnClick = false; 1247 } 1248 }); 1249 Text.onClick(() => this.onCustomClick && this.onCustomClick(this.index)); 1250 Text.accessibilitySelected(this.index === this.currentIndex); 1251 }, Text); 1252 Text.pop(); 1253 }); 1254 } else { 1255 this.ifElseBranchUpdateFunction(1, () => { 1256 this.observeComponentCreation2((k40, l40) => { 1257 Row.create(); 1258 Context.animation({ duration: 300 }); 1259 Row.width(this.getImageLayoutWidth() * this.getImageScaleFactor() + 1260 TabContentItem.paddingLeft + TabContentItem.paddingRight); 1261 Row.constraintSize({ 1262 minWidth: TabContentItem.imageHotZoneWidth, 1263 minHeight: TabContentItem.imageHotZoneWidth 1264 }); 1265 Context.animation(null); 1266 Row.justifyContent(FlexAlign.Center); 1267 Row.onFocus(() => this.isOnFocus = true); 1268 Row.onBlur(() => this.isOnFocus = false); 1269 Row.onHover((o40) => this.isOnHover = o40); 1270 Row.onKeyEvent((n40) => { 1271 if (n40.keyCode !== KeyCode.KEYCODE_ENTER && n40.keyCode !== KeyCode.KEYCODE_SPACE) { 1272 return; 1273 } 1274 if (n40.type === KeyType.Down) { 1275 this.isOnClick = true; 1276 } 1277 if (n40.type === KeyType.Up) { 1278 this.isOnClick = false; 1279 } 1280 }); 1281 Row.onTouch((m40) => { 1282 if (m40.type === TouchType.Down) { 1283 this.isOnClick = true; 1284 } 1285 if (m40.type === TouchType.Up || m40.type === TouchType.Cancel) { 1286 this.isOnClick = false; 1287 } 1288 }); 1289 Row.onClick(() => this.onCustomClick && this.onCustomClick(this.index)); 1290 Row.accessibilitySelected(this.index === this.currentIndex); 1291 }, Row); 1292 this.observeComponentCreation2((y39, z39) => { 1293 If.create(); 1294 if (this.item.symbolStyle) { 1295 this.ifElseBranchUpdateFunction(0, () => { 1296 this.observeComponentCreation2((i40, j40) => { 1297 SymbolGlyph.create(); 1298 Context.animation({ duration: 300 }); 1299 SymbolGlyph.fontColor([{ 1300 'id': -1, 1301 'type': 10001, 1302 params: ['sys.color.icon_primary'], 1303 'bundleName': '__harDefaultBundleName__', 1304 'moduleName': '__harDefaultModuleName__', 1305 }]); 1306 SymbolGlyph.attributeModifier.bind(this)(this.item.symbolStyle); 1307 SymbolGlyph.fontSize(TabContentItem.symbolSize); 1308 SymbolGlyph.width(this.getImageLayoutWidth()); 1309 SymbolGlyph.height(TabContentItem.imageSize); 1310 SymbolGlyph.accessibilityText(this.item.title); 1311 SymbolGlyph.scale({ 1312 x: this.getImageScaleFactor(), 1313 y: this.getImageScaleFactor() 1314 }); 1315 Context.animation(null); 1316 SymbolGlyph.hitTestBehavior(HitTestMode.None); 1317 SymbolGlyph.focusable(true); 1318 SymbolGlyph.symbolEffect(new SymbolEffect(), false); 1319 }, SymbolGlyph); 1320 }); 1321 } else { 1322 this.ifElseBranchUpdateFunction(1, () => { 1323 this.observeComponentCreation2((a40, b40) => { 1324 If.create(); 1325 if (Util.isSymbolResource(this.item.icon)) { 1326 this.ifElseBranchUpdateFunction(0, () => { 1327 this.observeComponentCreation2((g40, h40) => { 1328 SymbolGlyph.create(this.item.icon); 1329 Context.animation({ duration: 300 }); 1330 SymbolGlyph.fontColor([{ 1331 'id': -1, 1332 'type': 10001, 1333 params: ['sys.color.icon_primary'], 1334 'bundleName': '__harDefaultBundleName__', 1335 'moduleName': '__harDefaultModuleName__', 1336 }]); 1337 SymbolGlyph.fontSize(TabContentItem.symbolSize); 1338 SymbolGlyph.width(this.getImageLayoutWidth()); 1339 SymbolGlyph.height(TabContentItem.imageSize); 1340 SymbolGlyph.accessibilityText(this.item.title); 1341 SymbolGlyph.scale({ 1342 x: this.getImageScaleFactor(), 1343 y: this.getImageScaleFactor() 1344 }); 1345 Context.animation(null); 1346 SymbolGlyph.hitTestBehavior(HitTestMode.None); 1347 SymbolGlyph.focusable(true); 1348 }, SymbolGlyph); 1349 }); 1350 } else { 1351 this.ifElseBranchUpdateFunction(1, () => { 1352 this.observeComponentCreation2((c40, d40) => { 1353 Image.create(this.item.icon); 1354 Context.animation({ duration: 300 }); 1355 Image.alt(this.item.title); 1356 Image.width(this.getImageLayoutWidth()); 1357 Image.height(TabContentItem.imageSize); 1358 Image.objectFit(ImageFit.Fill); 1359 Image.accessibilityText(this.item.title); 1360 Image.scale({ 1361 x: this.getImageScaleFactor(), 1362 y: this.getImageScaleFactor() 1363 }); 1364 Context.animation(null); 1365 Image.hitTestBehavior(HitTestMode.None); 1366 Image.focusable(true); 1367 Image.onComplete((f40) => { 1368 if (!this.onImageComplete) { 1369 return; 1370 } 1371 this.imageWidth = px2vp(f40?.width); 1372 this.imageHeight = px2vp(f40?.height); 1373 this.onImageComplete(px2vp(f40?.componentWidth) + 1374 TabContentItem.paddingLeft + TabContentItem.paddingRight); 1375 }); 1376 Image.onError((e40) => { 1377 if (!this.onImageComplete) { 1378 return; 1379 } 1380 this.onImageComplete(px2vp(e40.componentWidth) + 1381 TabContentItem.paddingLeft + TabContentItem.paddingRight); 1382 }); 1383 }, Image); 1384 }); 1385 } 1386 }, If); 1387 If.pop(); 1388 }); 1389 } 1390 }, If); 1391 If.pop(); 1392 Row.pop(); 1393 }); 1394 } 1395 }, If); 1396 If.pop(); 1397 Column.pop(); 1398 Row.pop(); 1399 this.observeComponentCreation2((s39, t39) => { 1400 If.create(); 1401 if (this.isOnFocus && this.tabWidth > 0) { 1402 this.ifElseBranchUpdateFunction(0, () => { 1403 this.observeComponentCreation2((u39, v39) => { 1404 Row.create(); 1405 Row.width(this.tabWidth); 1406 Row.height(TabTitleBar.totalHeight); 1407 Row.hitTestBehavior(HitTestMode.None); 1408 Row.borderRadius(TabContentItem.buttonBorderRadius); 1409 ViewStackProcessor.visualState('focused'); 1410 Row.border(this.getBorderAttr()); 1411 ViewStackProcessor.visualState('normal'); 1412 Row.border({ 1413 radius: { 1414 'id': -1, 1415 'type': 10002, 1416 params: ['sys.float.ohos_id_corner_radius_clicked'], 1417 'bundleName': '__harDefaultBundleName__', 1418 'moduleName': '__harDefaultModuleName__', 1419 }, 1420 width: 0 1421 }); 1422 ViewStackProcessor.visualState(); 1423 }, Row); 1424 Row.pop(); 1425 }); 1426 } else { 1427 this.ifElseBranchUpdateFunction(1, () => { 1428 }); 1429 } 1430 }, If); 1431 If.pop(); 1432 Stack.pop(); 1433 } 1434 1435 rerender() { 1436 this.updateDirtyElements(); 1437 } 1438} 1439 1440TabContentItem.imageSize = 24; 1441TabContentItem.symbolSize = '24vp'; 1442TabContentItem.imageHotZoneWidth = 48; 1443TabContentItem.imageMagnificationFactor = 1.4; 1444TabContentItem.buttonBorderRadius = 8; 1445TabContentItem.focusBorderWidth = 2; 1446TabContentItem.paddingLeft = 8; 1447TabContentItem.paddingRight = 8; 1448TabContentItem.marginFirst = 16; 1449 1450class ImageMenuItem extends ViewPU { 1451 constructor(m39, n39, o39, p39 = -1, q39 = undefined, r39) { 1452 super(m39, o39, p39, r39); 1453 if (typeof q39 === 'function') { 1454 this.paramsGenerator_ = q39; 1455 } 1456 this.item = { value: '' }; 1457 this.index = 0; 1458 this.__isOnFocus = new ObservedPropertySimplePU(false, this, 'isOnFocus'); 1459 this.__isOnHover = new ObservedPropertySimplePU(false, this, 'isOnHover'); 1460 this.__isOnClick = new ObservedPropertySimplePU(false, this, 'isOnClick'); 1461 this.setInitiallyProvidedValue(n39); 1462 this.finalizeConstruction(); 1463 } 1464 1465 setInitiallyProvidedValue(l39) { 1466 if (l39.item !== undefined) { 1467 this.item = l39.item; 1468 } 1469 if (l39.index !== undefined) { 1470 this.index = l39.index; 1471 } 1472 if (l39.isOnFocus !== undefined) { 1473 this.isOnFocus = l39.isOnFocus; 1474 } 1475 if (l39.isOnHover !== undefined) { 1476 this.isOnHover = l39.isOnHover; 1477 } 1478 if (l39.isOnClick !== undefined) { 1479 this.isOnClick = l39.isOnClick; 1480 } 1481 } 1482 1483 updateStateVars(k39) { 1484 } 1485 1486 purgeVariableDependenciesOnElmtId(j39) { 1487 this.__isOnFocus.purgeDependencyOnElmtId(j39); 1488 this.__isOnHover.purgeDependencyOnElmtId(j39); 1489 this.__isOnClick.purgeDependencyOnElmtId(j39); 1490 } 1491 1492 aboutToBeDeleted() { 1493 this.__isOnFocus.aboutToBeDeleted(); 1494 this.__isOnHover.aboutToBeDeleted(); 1495 this.__isOnClick.aboutToBeDeleted(); 1496 SubscriberManager.Get().delete(this.id__()); 1497 this.aboutToBeDeletedInternal(); 1498 } 1499 1500 get isOnFocus() { 1501 return this.__isOnFocus.get(); 1502 } 1503 1504 set isOnFocus(i39) { 1505 this.__isOnFocus.set(i39); 1506 } 1507 1508 get isOnHover() { 1509 return this.__isOnHover.get(); 1510 } 1511 1512 set isOnHover(h39) { 1513 this.__isOnHover.set(h39); 1514 } 1515 1516 get isOnClick() { 1517 return this.__isOnClick.get(); 1518 } 1519 1520 set isOnClick(g39) { 1521 this.__isOnClick.set(g39); 1522 } 1523 1524 getFgColor() { 1525 return this.isOnClick 1526 ? { 1527 'id': -1, 1528 'type': 10001, 1529 params: ['sys.color.ohos_id_color_titlebar_icon_pressed'], 1530 'bundleName': '__harDefaultBundleName__', 1531 'moduleName': '__harDefaultModuleName__', 1532 } : { 1533 'id': -1, 1534 'type': 10001, 1535 params: ['sys.color.ohos_id_color_titlebar_icon'], 1536 'bundleName': '__harDefaultBundleName__', 1537 'moduleName': '__harDefaultModuleName__', 1538 }; 1539 } 1540 1541 getBgColor() { 1542 if (this.isOnClick) { 1543 return { 1544 'id': -1, 1545 'type': 10001, 1546 params: ['sys.color.ohos_id_color_click_effect'], 1547 'bundleName': '__harDefaultBundleName__', 1548 'moduleName': '__harDefaultModuleName__', 1549 }; 1550 } else if (this.isOnHover) { 1551 return { 1552 'id': -1, 1553 'type': 10001, 1554 params: ['sys.color.ohos_id_color_hover'], 1555 'bundleName': '__harDefaultBundleName__', 1556 'moduleName': '__harDefaultModuleName__', 1557 }; 1558 } else { 1559 return Color.Transparent; 1560 } 1561 } 1562 1563 toStringFormat(b39) { 1564 if (typeof b39 === 'string') { 1565 return b39; 1566 } else if (typeof b39 === 'undefined') { 1567 return ''; 1568 } else { 1569 let c39 = ''; 1570 try { 1571 c39 = getContext()?.resourceManager?.getStringSync(b39); 1572 } catch (d39) { 1573 let e39 = d39?.code; 1574 let f39 = d39?.message; 1575 hilog.error(0x3900, 'Ace', `Faild to TabTitleBar toStringFormat,code: ${e39},message:${f39}`); 1576 } 1577 return c39; 1578 } 1579 } 1580 1581 getAccessibilityReadText() { 1582 if (this.item.value === PUBLIC_MORE) { 1583 try { 1584 return getContext()?.resourceManager?.getStringByNameSync('ohos_toolbar_more'); 1585 } catch (d39) { 1586 let e39 = d39?.code; 1587 let f39 = d39?.message; 1588 hilog.error(0x3900, 'Ace', `Faild to TabTitleBar toStringFormat,code: ${e39},message:${f39}`); 1589 } 1590 } else if (this.item.accessibilityText) { 1591 return this.item.accessibilityText; 1592 } else if (this.item.label) { 1593 return this.item.label; 1594 } 1595 return ' '; 1596 } 1597 1598 initialRender() { 1599 this.observeComponentCreation2((w38, x38) => { 1600 Button.createWithChild({ type: ButtonType.Normal, stateEffect: this.item.isEnabled }); 1601 Button.accessibilityText(this.getAccessibilityReadText()); 1602 Button.accessibilityLevel(this.item?.accessibilityLevel ?? 'auto'); 1603 Button.accessibilityDescription(this.item?.accessibilityDescription); 1604 Button.width(ImageMenuItem.imageHotZoneWidth); 1605 Button.height(ImageMenuItem.imageHotZoneWidth); 1606 Button.borderRadius(ImageMenuItem.buttonBorderRadius); 1607 Button.foregroundColor(this.getFgColor()); 1608 Button.backgroundColor(this.getBgColor()); 1609 Button.enabled(this.item.isEnabled ? this.item.isEnabled : false); 1610 ViewStackProcessor.visualState('focused'); 1611 Button.border({ 1612 radius: { 1613 'id': -1, 1614 'type': 10002, 1615 params: ['sys.float.ohos_id_corner_radius_clicked'], 1616 'bundleName': '__harDefaultBundleName__', 1617 'moduleName': '__harDefaultModuleName__', 1618 }, 1619 width: ImageMenuItem.focusBorderWidth, 1620 color: { 1621 'id': -1, 1622 'type': 10001, 1623 params: ['sys.color.ohos_id_color_focused_outline'], 1624 'bundleName': '__harDefaultBundleName__', 1625 'moduleName': '__harDefaultModuleName__', 1626 }, 1627 style: BorderStyle.Solid 1628 }); 1629 ViewStackProcessor.visualState('normal'); 1630 Button.border({ 1631 radius: { 1632 'id': -1, 1633 'type': 10002, 1634 params: ['sys.float.ohos_id_corner_radius_clicked'], 1635 'bundleName': '__harDefaultBundleName__', 1636 'moduleName': '__harDefaultModuleName__', 1637 }, 1638 width: 0 1639 }); 1640 ViewStackProcessor.visualState(); 1641 Button.onFocus(() => { 1642 if (!this.item.isEnabled) { 1643 return; 1644 } 1645 this.isOnFocus = true; 1646 }); 1647 Button.onBlur(() => this.isOnFocus = false); 1648 Button.onHover((a39) => { 1649 if (!this.item.isEnabled) { 1650 return; 1651 } 1652 this.isOnHover = a39; 1653 }); 1654 Button.onKeyEvent((z38) => { 1655 if (!this.item.isEnabled) { 1656 return; 1657 } 1658 if (z38.keyCode !== KeyCode.KEYCODE_ENTER && z38.keyCode !== KeyCode.KEYCODE_SPACE) { 1659 return; 1660 } 1661 if (z38.type === KeyType.Down) { 1662 this.isOnClick = true; 1663 } 1664 if (z38.type === KeyType.Up) { 1665 this.isOnClick = false; 1666 } 1667 }); 1668 Button.onTouch((y38) => { 1669 if (!this.item.isEnabled) { 1670 return; 1671 } 1672 if (y38.type === TouchType.Down) { 1673 this.isOnClick = true; 1674 } 1675 if (y38.type === TouchType.Up || y38.type === TouchType.Cancel) { 1676 this.isOnClick = false; 1677 } 1678 }); 1679 Button.onClick(() => this.item.isEnabled && this.item.action && this.item.action()); 1680 }, Button); 1681 this.observeComponentCreation2((m38, n38) => { 1682 If.create(); 1683 if (this.item.symbolStyle) { 1684 this.ifElseBranchUpdateFunction(0, () => { 1685 this.observeComponentCreation2((u38, v38) => { 1686 SymbolGlyph.create(); 1687 SymbolGlyph.fontColor([{ 1688 'id': -1, 1689 'type': 10001, 1690 params: ['sys.color.font_primary'], 1691 'bundleName': '__harDefaultBundleName__', 1692 'moduleName': '__harDefaultModuleName__', 1693 }]); 1694 SymbolGlyph.attributeModifier.bind(this)(this.item.symbolStyle); 1695 SymbolGlyph.fontSize(TabContentItem.symbolSize); 1696 SymbolGlyph.draggable(false); 1697 SymbolGlyph.focusable(this.item?.isEnabled); 1698 SymbolGlyph.key(ImageMenuItem.focusablePrefix + this.index); 1699 SymbolGlyph.symbolEffect(new SymbolEffect(), false); 1700 }, SymbolGlyph); 1701 }); 1702 } else { 1703 this.ifElseBranchUpdateFunction(1, () => { 1704 this.observeComponentCreation2((o38, p38) => { 1705 If.create(); 1706 if (Util.isSymbolResource(this.item.value)) { 1707 this.ifElseBranchUpdateFunction(0, () => { 1708 this.observeComponentCreation2((s38, t38) => { 1709 SymbolGlyph.create(this.item.value); 1710 SymbolGlyph.fontColor([{ 1711 'id': -1, 1712 'type': 10001, 1713 params: ['sys.color.font_primary'], 1714 'bundleName': '__harDefaultBundleName__', 1715 'moduleName': '__harDefaultModuleName__', 1716 }]); 1717 SymbolGlyph.fontSize(TabContentItem.symbolSize); 1718 SymbolGlyph.draggable(false); 1719 SymbolGlyph.focusable(this.item?.isEnabled); 1720 SymbolGlyph.key(ImageMenuItem.focusablePrefix + this.index); 1721 }, SymbolGlyph); 1722 }); 1723 } else { 1724 this.ifElseBranchUpdateFunction(1, () => { 1725 this.observeComponentCreation2((q38, r38) => { 1726 Image.create(this.item.value); 1727 Image.width(ImageMenuItem.imageSize); 1728 Image.height(ImageMenuItem.imageSize); 1729 Image.focusable(this.item.isEnabled); 1730 Image.key(ImageMenuItem.focusablePrefix + this.index); 1731 Image.draggable(false); 1732 }, Image); 1733 }); 1734 } 1735 }, If); 1736 If.pop(); 1737 }); 1738 } 1739 }, If); 1740 If.pop(); 1741 Button.pop(); 1742 } 1743 1744 rerender() { 1745 this.updateDirtyElements(); 1746 } 1747} 1748 1749ImageMenuItem.imageSize = 24; 1750ImageMenuItem.imageHotZoneWidth = 48; 1751ImageMenuItem.buttonBorderRadius = 8; 1752ImageMenuItem.focusBorderWidth = 2; 1753ImageMenuItem.disabledImageOpacity = 0.4; 1754ImageMenuItem.focusablePrefix = 'Id-TabTitleBar-ImageMenuItem-'; 1755 1756class TabTitleBarDialog extends ViewPU { 1757 constructor(g38, h38, i38, j38 = -1, k38 = undefined, l38) { 1758 super(g38, i38, j38, l38); 1759 if (typeof k38 === 'function') { 1760 this.paramsGenerator_ = k38; 1761 } 1762 this.tabTitleDialog = { value: '' }; 1763 this.callbackId = undefined; 1764 this.tabTitleBarDialog = ''; 1765 this.mainWindowStage = undefined; 1766 this.controller = undefined; 1767 this.minFontSize = 1.75; 1768 this.maxFontSize = 3.2; 1769 this.screenWidth = 640; 1770 this.verticalScreenLines = 6; 1771 this.horizontalsScreenLines = 1; 1772 this.__mainWindow = this.createStorageLink('mainWindow', undefined, 'mainWindow'); 1773 this.__fontSize = new ObservedPropertySimplePU(1, this, 'fontSize'); 1774 this.__maxLines = new ObservedPropertySimplePU(1, this, 'maxLines'); 1775 this.__windowStandardHeight = this.createStorageProp('windowStandardHeight', 0, 'windowStandardHeight'); 1776 this.cancel = () => { 1777 }; 1778 this.confirm = () => { 1779 }; 1780 this.setInitiallyProvidedValue(h38); 1781 this.finalizeConstruction(); 1782 } 1783 1784 setInitiallyProvidedValue(f38) { 1785 if (f38.tabTitleDialog !== undefined) { 1786 this.tabTitleDialog = f38.tabTitleDialog; 1787 } 1788 if (f38.callbackId !== undefined) { 1789 this.callbackId = f38.callbackId; 1790 } 1791 if (f38.tabTitleBarDialog !== undefined) { 1792 this.tabTitleBarDialog = f38.tabTitleBarDialog; 1793 } 1794 if (f38.mainWindowStage !== undefined) { 1795 this.mainWindowStage = f38.mainWindowStage; 1796 } 1797 if (f38.controller !== undefined) { 1798 this.controller = f38.controller; 1799 } 1800 if (f38.minFontSize !== undefined) { 1801 this.minFontSize = f38.minFontSize; 1802 } 1803 if (f38.maxFontSize !== undefined) { 1804 this.maxFontSize = f38.maxFontSize; 1805 } 1806 if (f38.screenWidth !== undefined) { 1807 this.screenWidth = f38.screenWidth; 1808 } 1809 if (f38.verticalScreenLines !== undefined) { 1810 this.verticalScreenLines = f38.verticalScreenLines; 1811 } 1812 if (f38.horizontalsScreenLines !== undefined) { 1813 this.horizontalsScreenLines = f38.horizontalsScreenLines; 1814 } 1815 if (f38.fontSize !== undefined) { 1816 this.fontSize = f38.fontSize; 1817 } 1818 if (f38.maxLines !== undefined) { 1819 this.maxLines = f38.maxLines; 1820 } 1821 if (f38.cancel !== undefined) { 1822 this.cancel = f38.cancel; 1823 } 1824 if (f38.confirm !== undefined) { 1825 this.confirm = f38.confirm; 1826 } 1827 } 1828 1829 updateStateVars(e38) { 1830 } 1831 1832 purgeVariableDependenciesOnElmtId(d38) { 1833 this.__mainWindow.purgeDependencyOnElmtId(d38); 1834 this.__fontSize.purgeDependencyOnElmtId(d38); 1835 this.__maxLines.purgeDependencyOnElmtId(d38); 1836 this.__windowStandardHeight.purgeDependencyOnElmtId(d38); 1837 } 1838 1839 aboutToBeDeleted() { 1840 this.__mainWindow.aboutToBeDeleted(); 1841 this.__fontSize.aboutToBeDeleted(); 1842 this.__maxLines.aboutToBeDeleted(); 1843 this.__windowStandardHeight.aboutToBeDeleted(); 1844 SubscriberManager.Get().delete(this.id__()); 1845 this.aboutToBeDeletedInternal(); 1846 } 1847 1848 setController(c38) { 1849 this.controller = c38; 1850 } 1851 1852 get mainWindow() { 1853 return this.__mainWindow.get(); 1854 } 1855 1856 set mainWindow(b38) { 1857 this.__mainWindow.set(b38); 1858 } 1859 1860 get fontSize() { 1861 return this.__fontSize.get(); 1862 } 1863 1864 set fontSize(a38) { 1865 this.__fontSize.set(a38); 1866 } 1867 1868 get maxLines() { 1869 return this.__maxLines.get(); 1870 } 1871 1872 set maxLines(z37) { 1873 this.__maxLines.set(z37); 1874 } 1875 1876 get windowStandardHeight() { 1877 return this.__windowStandardHeight.get(); 1878 } 1879 1880 set windowStandardHeight(y37) { 1881 this.__windowStandardHeight.set(y37); 1882 } 1883 1884 initialRender() { 1885 this.observeComponentCreation2((u36, v36) => { 1886 If.create(); 1887 if (this.tabTitleBarDialog) { 1888 this.ifElseBranchUpdateFunction(0, () => { 1889 this.observeComponentCreation2((w37, x37) => { 1890 Column.create(); 1891 Column.width(this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG); 1892 Column.constraintSize({ 1893 minHeight: this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG 1894 }); 1895 Column.backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK, undefined, 1896 { disableSystemAdaptation: true }); 1897 Column.shadow(ShadowStyle.OUTER_DEFAULT_LG); 1898 Column.borderRadius({ 1899 'id': -1, 1900 'type': 10002, 1901 params: ['sys.float.corner_radius_level10'], 1902 'bundleName': '__harDefaultBundleName__', 1903 'moduleName': '__harDefaultModuleName__', 1904 }); 1905 }, Column); 1906 this.observeComponentCreation2((m37, n37) => { 1907 If.create(); 1908 if (this.tabTitleDialog.symbolStyle) { 1909 this.ifElseBranchUpdateFunction(0, () => { 1910 this.observeComponentCreation2((u37, v37) => { 1911 SymbolGlyph.create(); 1912 SymbolGlyph.fontColor([{ 1913 'id': -1, 1914 'type': 10001, 1915 params: ['sys.color.font_primary'], 1916 'bundleName': '__harDefaultBundleName__', 1917 'moduleName': '__harDefaultModuleName__', 1918 }]); 1919 SymbolGlyph.attributeModifier.bind(this)(this.tabTitleDialog.symbolStyle); 1920 SymbolGlyph.fontSize(IMAGE_SIZE); 1921 SymbolGlyph.draggable(false); 1922 SymbolGlyph.focusable(this.tabTitleDialog?.isEnabled); 1923 SymbolGlyph.margin({ 1924 top: { 1925 'id': -1, 1926 'type': 10002, 1927 params: ['sys.float.padding_level24'], 1928 'bundleName': '__harDefaultBundleName__', 1929 'moduleName': '__harDefaultModuleName__', 1930 }, 1931 bottom: { 1932 'id': -1, 1933 'type': 10002, 1934 params: ['sys.float.padding_level8'], 1935 'bundleName': '__harDefaultBundleName__', 1936 'moduleName': '__harDefaultModuleName__', 1937 }, 1938 }); 1939 SymbolGlyph.symbolEffect(new SymbolEffect(), false); 1940 }, SymbolGlyph); 1941 }); 1942 } else if (this.tabTitleDialog.value) { 1943 this.ifElseBranchUpdateFunction(1, () => { 1944 this.observeComponentCreation2((o37, p37) => { 1945 If.create(); 1946 if (Util.isSymbolResource(this.tabTitleDialog.value)) { 1947 this.ifElseBranchUpdateFunction(0, () => { 1948 this.observeComponentCreation2((s37, t37) => { 1949 SymbolGlyph.create(this.tabTitleDialog.value); 1950 SymbolGlyph.fontColor([{ 1951 'id': -1, 1952 'type': 10001, 1953 params: ['sys.color.font_primary'], 1954 'bundleName': '__harDefaultBundleName__', 1955 'moduleName': '__harDefaultModuleName__', 1956 }]); 1957 SymbolGlyph.fontSize(IMAGE_SIZE); 1958 SymbolGlyph.draggable(false); 1959 SymbolGlyph.focusable(this.tabTitleDialog?.isEnabled); 1960 SymbolGlyph.margin({ 1961 top: { 1962 'id': -1, 1963 'type': 10002, 1964 params: ['sys.float.padding_level24'], 1965 'bundleName': '__harDefaultBundleName__', 1966 'moduleName': '__harDefaultModuleName__', 1967 }, 1968 bottom: { 1969 'id': -1, 1970 'type': 10002, 1971 params: ['sys.float.padding_level8'], 1972 'bundleName': '__harDefaultBundleName__', 1973 'moduleName': '__harDefaultModuleName__', 1974 }, 1975 }); 1976 }, SymbolGlyph); 1977 }); 1978 } else { 1979 this.ifElseBranchUpdateFunction(1, () => { 1980 this.observeComponentCreation2((q37, r37) => { 1981 Image.create(this.tabTitleDialog.value); 1982 Image.width(IMAGE_SIZE); 1983 Image.height(IMAGE_SIZE); 1984 Image.margin({ 1985 top: { 1986 'id': -1, 1987 'type': 10002, 1988 params: ['sys.float.padding_level24'], 1989 'bundleName': '__harDefaultBundleName__', 1990 'moduleName': '__harDefaultModuleName__', 1991 }, 1992 bottom: { 1993 'id': -1, 1994 'type': 10002, 1995 params: ['sys.float.padding_level8'], 1996 'bundleName': '__harDefaultBundleName__', 1997 'moduleName': '__harDefaultModuleName__', 1998 }, 1999 }); 2000 Image.fillColor({ 2001 'id': -1, 2002 'type': 10001, 2003 params: ['sys.color.icon_primary'], 2004 'bundleName': '__harDefaultBundleName__', 2005 'moduleName': '__harDefaultModuleName__', 2006 }); 2007 }, Image); 2008 }); 2009 } 2010 }, If); 2011 If.pop(); 2012 }); 2013 } else { 2014 this.ifElseBranchUpdateFunction(2, () => { 2015 }); 2016 } 2017 }, If); 2018 If.pop(); 2019 this.observeComponentCreation2((k37, l37) => { 2020 Column.create(); 2021 Column.width('100%'); 2022 Column.padding({ 2023 left: { 2024 'id': -1, 2025 'type': 10002, 2026 params: ['sys.float.padding_level4'], 2027 'bundleName': '__harDefaultBundleName__', 2028 'moduleName': '__harDefaultModuleName__', 2029 }, 2030 right: { 2031 'id': -1, 2032 'type': 10002, 2033 params: ['sys.float.padding_level4'], 2034 'bundleName': '__harDefaultBundleName__', 2035 'moduleName': '__harDefaultModuleName__', 2036 }, 2037 bottom: { 2038 'id': -1, 2039 'type': 10002, 2040 params: ['sys.float.padding_level12'], 2041 'bundleName': '__harDefaultBundleName__', 2042 'moduleName': '__harDefaultModuleName__', 2043 }, 2044 }); 2045 }, Column); 2046 this.observeComponentCreation2((i37, j37) => { 2047 Text.create(this.tabTitleBarDialog); 2048 Text.fontSize(TEXT_EDITABLE_DIALOG); 2049 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 2050 Text.maxLines(this.maxLines); 2051 Text.width('100%'); 2052 Text.textAlign(TextAlign.Center); 2053 Text.fontColor({ 2054 'id': -1, 2055 'type': 10001, 2056 params: ['sys.color.font_primary'], 2057 'bundleName': '__harDefaultBundleName__', 2058 'moduleName': '__harDefaultModuleName__', 2059 }); 2060 }, Text); 2061 Text.pop(); 2062 Column.pop(); 2063 Column.pop(); 2064 }); 2065 } else { 2066 this.ifElseBranchUpdateFunction(1, () => { 2067 this.observeComponentCreation2((g37, h37) => { 2068 Column.create(); 2069 Column.width(this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG); 2070 Column.constraintSize({ 2071 minHeight: this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG 2072 }); 2073 Column.backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK, undefined, 2074 { disableSystemAdaptation: true }); 2075 Column.shadow(ShadowStyle.OUTER_DEFAULT_LG); 2076 Column.borderRadius({ 2077 'id': -1, 2078 'type': 10002, 2079 params: ['sys.float.corner_radius_level10'], 2080 'bundleName': '__harDefaultBundleName__', 2081 'moduleName': '__harDefaultModuleName__', 2082 }); 2083 Column.justifyContent(FlexAlign.Center); 2084 }, Column); 2085 this.observeComponentCreation2((w36, x36) => { 2086 If.create(); 2087 if (this.tabTitleDialog.symbolStyle) { 2088 this.ifElseBranchUpdateFunction(0, () => { 2089 this.observeComponentCreation2((e37, f37) => { 2090 SymbolGlyph.create(); 2091 SymbolGlyph.fontColor([{ 2092 'id': -1, 2093 'type': 10001, 2094 params: ['sys.color.font_primary'], 2095 'bundleName': '__harDefaultBundleName__', 2096 'moduleName': '__harDefaultModuleName__', 2097 }]); 2098 SymbolGlyph.attributeModifier.bind(this)(this.tabTitleDialog.symbolStyle); 2099 SymbolGlyph.fontSize(IMAGE_SIZE); 2100 SymbolGlyph.draggable(false); 2101 SymbolGlyph.focusable(this.tabTitleDialog?.isEnabled); 2102 SymbolGlyph.symbolEffect(new SymbolEffect(), false); 2103 }, SymbolGlyph); 2104 }); 2105 } else if (this.tabTitleDialog.value) { 2106 this.ifElseBranchUpdateFunction(1, () => { 2107 this.observeComponentCreation2((y36, z36) => { 2108 If.create(); 2109 if (Util.isSymbolResource(this.tabTitleDialog.value)) { 2110 this.ifElseBranchUpdateFunction(0, () => { 2111 this.observeComponentCreation2((c37, d37) => { 2112 SymbolGlyph.create(this.tabTitleDialog.value); 2113 SymbolGlyph.fontColor([{ 2114 'id': -1, 2115 'type': 10001, 2116 params: ['sys.color.font_primary'], 2117 'bundleName': '__harDefaultBundleName__', 2118 'moduleName': '__harDefaultModuleName__', 2119 }]); 2120 SymbolGlyph.fontSize(IMAGE_SIZE); 2121 SymbolGlyph.draggable(false); 2122 SymbolGlyph.focusable(this.tabTitleDialog?.isEnabled); 2123 SymbolGlyph.margin({ 2124 top: { 2125 'id': -1, 2126 'type': 10002, 2127 params: ['sys.float.padding_level24'], 2128 'bundleName': '__harDefaultBundleName__', 2129 'moduleName': '__harDefaultModuleName__', 2130 }, 2131 bottom: { 2132 'id': -1, 2133 'type': 10002, 2134 params: ['sys.float.padding_level8'], 2135 'bundleName': '__harDefaultBundleName__', 2136 'moduleName': '__harDefaultModuleName__', 2137 }, 2138 }); 2139 }, SymbolGlyph); 2140 }); 2141 } else { 2142 this.ifElseBranchUpdateFunction(1, () => { 2143 this.observeComponentCreation2((a37, b37) => { 2144 Image.create(this.tabTitleDialog.value); 2145 Image.width(IMAGE_SIZE); 2146 Image.height(IMAGE_SIZE); 2147 Image.fillColor({ 2148 'id': -1, 2149 'type': 10001, 2150 params: ['sys.color.icon_primary'], 2151 'bundleName': '__harDefaultBundleName__', 2152 'moduleName': '__harDefaultModuleName__', 2153 }); 2154 }, Image); 2155 }); 2156 } 2157 }, If); 2158 If.pop(); 2159 }); 2160 } else { 2161 this.ifElseBranchUpdateFunction(2, () => { 2162 }); 2163 } 2164 }, If); 2165 If.pop(); 2166 Column.pop(); 2167 }); 2168 } 2169 }, If); 2170 If.pop(); 2171 } 2172 2173 async aboutToAppear() { 2174 try { 2175 let r36 = this.getUIContext().getHostContext(); 2176 this.mainWindowStage = r36.windowStage.getMainWindowSync(); 2177 let s36 = this.mainWindowStage.getWindowProperties(); 2178 let t36 = s36.windowRect; 2179 if (px2vp(t36.height) > this.screenWidth) { 2180 this.maxLines = this.verticalScreenLines; 2181 } else { 2182 this.maxLines = this.horizontalsScreenLines; 2183 } 2184 } catch (z43) { 2185 let a44 = z43?.code; 2186 let b44 = z43?.message; 2187 hilog.error(0x3900, 'tabTitleBar', `Faild to getSystemFontScale,cause, code: ${a44}, message: ${b44}`); 2188 } 2189 } 2190 2191 rerender() { 2192 this.updateDirtyElements(); 2193 } 2194} 2195 2196class Util { 2197 static isSymbolResource(p36) { 2198 if (!Util.isResourceType(p36)) { 2199 return false; 2200 } 2201 let q36 = p36; 2202 return q36.type === RESOURCE_TYPE_SYMBOL; 2203 } 2204 2205 static isResourceType(o36) { 2206 if (!o36) { 2207 return false; 2208 } 2209 if (typeof o36 === 'string' || typeof o36 === 'undefined') { 2210 return false; 2211 } 2212 return true; 2213 } 2214} 2215 2216export default { 2217 TabTitleBar: TabTitleBar 2218};