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 hilog = requireNapi('hilog'); 21const KeyCode = requireNapi('multimodalInput.keyCode').KeyCode; 22const resourceManager = requireNapi('resourceManager'); 23const LengthMetrics = requireNapi('arkui.node').LengthMetrics; 24 25export var EditableLeftIconType; 26(function (EditableLeftIconType) { 27 EditableLeftIconType[EditableLeftIconType['Back'] = 0] = 'Back'; 28 EditableLeftIconType[EditableLeftIconType['Cancel'] = 1] = 'Cancel'; 29})(EditableLeftIconType || (EditableLeftIconType = {})); 30var ItemType; 31(function (ItemType) { 32 ItemType[ItemType['Image'] = 0] = 'Image'; 33 ItemType[ItemType['Icon'] = 1] = 'Icon'; 34 ItemType[ItemType['LeftIcon'] = 2] = 'LeftIcon'; 35})(ItemType || (ItemType = {})); 36const PUBLIC_CANCEL = { 37 'id': -1, 38 'type': 40000, 39 params: ['sys.symbol.xmark'], 40 'bundleName': '__harDefaultBundleName__', 41 'moduleName': '__harDefaultModuleName__', 42}; 43const PUBLIC_OK = { 44 'id': -1, 45 'type': 40000, 46 params: ['sys.symbol.checkmark'], 47 'bundleName': '__harDefaultBundleName__', 48 'moduleName': '__harDefaultModuleName__', 49}; 50const PUBLIC_BACK = { 51 'id': -1, 52 'type': 40000, 53 params: ['sys.symbol.chevron_backward'], 54 'bundleName': '__harDefaultBundleName__', 55 'moduleName': '__harDefaultModuleName__', 56}; 57const PUBLIC_IMAGE_BACK = { 58 'id': -1, 59 'type': 20000, 60 params: ['sys.media.ohos_ic_compnent_titlebar_back'], 61 'bundleName': '__harDefaultBundleName__', 62 'moduleName': '__harDefaultModuleName__', 63}; 64const DEFAULT_TITLE_BAR_HEIGHT = 56; 65const DEFAULT_TITLE_PADDING = 2; 66const MAX_LINE_ONE = 1; 67const MAX_LINES_TWO = 2; 68const MAX_MAIN_TITLE_PERCENT = 0.65; 69const MAX_SUB_TITLE_PERCENT = 0.35; 70const MIN_SUBTITLE_SIZE = '10.0vp'; 71const TEXT_EDITABLE_DIALOG = '18.3fp'; 72const IMAGE_SIZE = '64vp'; 73const MAX_DIALOG = '256vp'; 74const MIN_DIALOG = '216vp'; 75const SYMBOL_SIZE = '24vp'; 76const SYMBOL_TITLE_SIZE = '64vp'; 77const TITLE_VP = 20; 78const SUBTITLE_VP = 14; 79// 'sys.float.titlebar_title_tertiary_size' id,value: 20vp 80const TITLE_F = getNumberByResource(125831095, TITLE_VP); 81// 'sys.float.titlebar_subheader_size' id,value: 14vp 82const SUBTITLE_F = getNumberByResource(125831097, SUBTITLE_VP); 83const TITLE_F_VP = (TITLE_F > 0 ? TITLE_F : TITLE_VP) + 'vp'; 84const SUBTITLE_F_VP = (SUBTITLE_F > 0 ? SUBTITLE_F : SUBTITLE_VP) + 'vp'; 85 86class EditableTitleBarTheme { 87 constructor() { 88 this.iconColor = { 89 'id': -1, 90 'type': 10001, 91 params: ['sys.color.titlebar_icon_color'], 92 'bundleName': '__harDefaultBundleName__', 93 'moduleName': '__harDefaultModuleName__', 94 }; 95 this.iconBackgroundColor = { 96 'id': -1, 97 'type': 10001, 98 params: ['sys.color.titlebar_icon_background_color'], 99 'bundleName': '__harDefaultBundleName__', 100 'moduleName': '__harDefaultModuleName__', 101 }; 102 this.iconBackgroundPressedColor = { 103 'id': -1, 104 'type': 10001, 105 params: ['sys.color.titlebar_icon_background_pressed_color'], 106 'bundleName': '__harDefaultBundleName__', 107 'moduleName': '__harDefaultModuleName__', 108 }; 109 this.iconBackgroundHoverColor = { 110 'id': -1, 111 'type': 10001, 112 params: ['sys.color.titlebar_icon_background_hover_color'], 113 'bundleName': '__harDefaultBundleName__', 114 'moduleName': '__harDefaultModuleName__', 115 }; 116 this.iconBackgroundFocusOutlineColor = { 117 'id': -1, 118 'type': 10001, 119 params: ['sys.color.titlebar_icon_background_focus_outline_color'], 120 'bundleName': '__harDefaultBundleName__', 121 'moduleName': '__harDefaultModuleName__', 122 }; 123 this.titleColor = { 124 'id': -1, 125 'type': 10001, 126 params: ['sys.color.titlebar_title_tertiary_color'], 127 'bundleName': '__harDefaultBundleName__', 128 'moduleName': '__harDefaultModuleName__', 129 }; 130 this.subTitleColor = { 131 'id': -1, 132 'type': 10001, 133 params: ['sys.color.titlebar_subheader_color'], 134 'bundleName': '__harDefaultBundleName__', 135 'moduleName': '__harDefaultModuleName__', 136 }; 137 } 138} 139 140class ButtonGestureModifier { 141 constructor(controller) { 142 this.fontSize = 1; 143 this.controller = null; 144 this.controller = controller; 145 } 146 147 applyGesture(event) { 148 if (this.fontSize >= ButtonGestureModifier.minFontSize) { 149 event.addGesture(new LongPressGestureHandler({ 150 repeat: false, 151 duration: ButtonGestureModifier.longPressTime 152 }) 153 .onAction(() => { 154 if (event) { 155 this.controller?.open(); 156 } 157 }) 158 .onActionEnd(() => { 159 this.controller?.close(); 160 })); 161 } else { 162 event.clearGestures(); 163 } 164 } 165} 166 167ButtonGestureModifier.longPressTime = 500; 168ButtonGestureModifier.minFontSize = 1.75; 169 170export class EditableTitleBar extends ViewPU { 171 constructor(parent, params, __localStorage, elmtId = -1, paramsLambda = undefined, extraInfo) { 172 super(parent, __localStorage, elmtId, extraInfo); 173 if (typeof paramsLambda === 'function') { 174 this.paramsGenerator_ = paramsLambda; 175 } 176 this.leftIconStyle = EditableLeftIconType.Back; 177 this.title = ''; 178 this.subtitle = ''; 179 this.isSaveIconRequired = true; 180 this.imageItem = undefined; 181 this.menuItems = undefined; 182 this.options = {}; 183 this.onSave = undefined; 184 this.onCancel = undefined; 185 this.constraintWidth = 0; 186 this.leftIconDefaultFocus = false; 187 this.saveIconDefaultFocus = false; 188 this.isFollowingSystemFontScale = false; 189 this.maxFontScale = 1; 190 this.systemFontScale = 1; 191 this.__editableTitleBarTheme = 192 new ObservedPropertyObjectPU(new EditableTitleBarTheme(), this, 'editableTitleBarTheme'); 193 this.addProvidedVar('editableTitleBarTheme', this.__editableTitleBarTheme, false); 194 this.__contentMargin = new SynchedPropertyObjectOneWayPU(params.contentMargin, this, 'contentMargin'); 195 this.__titleBarMargin = new ObservedPropertyObjectPU({ 196 start: LengthMetrics.resource({ 197 'id': -1, 198 'type': 10002, 199 params: ['sys.float.margin_left'], 200 'bundleName': '__harDefaultBundleName__', 201 'moduleName': '__harDefaultModuleName__', 202 }), 203 end: LengthMetrics.resource({ 204 'id': -1, 205 'type': 10002, 206 params: ['sys.float.margin_right'], 207 'bundleName': '__harDefaultBundleName__', 208 'moduleName': '__harDefaultModuleName__', 209 }), 210 }, this, 'titleBarMargin'); 211 this.__fontSize = new ObservedPropertySimplePU(1, this, 'fontSize'); 212 this.setInitiallyProvidedValue(params); 213 this.finalizeConstruction(); 214 } 215 216 setInitiallyProvidedValue(params) { 217 if (params.leftIconStyle !== undefined) { 218 this.leftIconStyle = params.leftIconStyle; 219 } 220 if (params.title !== undefined) { 221 this.title = params.title; 222 } 223 if (params.subtitle !== undefined) { 224 this.subtitle = params.subtitle; 225 } 226 if (params.isSaveIconRequired !== undefined) { 227 this.isSaveIconRequired = params.isSaveIconRequired; 228 } 229 if (params.imageItem !== undefined) { 230 this.imageItem = params.imageItem; 231 } 232 if (params.menuItems !== undefined) { 233 this.menuItems = params.menuItems; 234 } 235 if (params.options !== undefined) { 236 this.options = params.options; 237 } 238 if (params.onSave !== undefined) { 239 this.onSave = params.onSave; 240 } 241 if (params.onCancel !== undefined) { 242 this.onCancel = params.onCancel; 243 } 244 if (params.constraintWidth !== undefined) { 245 this.constraintWidth = params.constraintWidth; 246 } 247 if (params.leftIconDefaultFocus !== undefined) { 248 this.leftIconDefaultFocus = params.leftIconDefaultFocus; 249 } 250 if (params.saveIconDefaultFocus !== undefined) { 251 this.saveIconDefaultFocus = params.saveIconDefaultFocus; 252 } 253 if (params.isFollowingSystemFontScale !== undefined) { 254 this.isFollowingSystemFontScale = params.isFollowingSystemFontScale; 255 } 256 if (params.maxFontScale !== undefined) { 257 this.maxFontScale = params.maxFontScale; 258 } 259 if (params.systemFontScale !== undefined) { 260 this.systemFontScale = params.systemFontScale; 261 } 262 if (params.editableTitleBarTheme !== undefined) { 263 this.editableTitleBarTheme = params.editableTitleBarTheme; 264 } 265 if (params.titleBarMargin !== undefined) { 266 this.titleBarMargin = params.titleBarMargin; 267 } 268 if (params.fontSize !== undefined) { 269 this.fontSize = params.fontSize; 270 } 271 } 272 273 updateStateVars(params) { 274 this.__contentMargin.reset(params.contentMargin); 275 } 276 277 purgeVariableDependenciesOnElmtId(rmElmtId) { 278 this.__editableTitleBarTheme.purgeDependencyOnElmtId(rmElmtId); 279 this.__contentMargin.purgeDependencyOnElmtId(rmElmtId); 280 this.__titleBarMargin.purgeDependencyOnElmtId(rmElmtId); 281 this.__fontSize.purgeDependencyOnElmtId(rmElmtId); 282 } 283 284 aboutToBeDeleted() { 285 this.__editableTitleBarTheme.aboutToBeDeleted(); 286 this.__contentMargin.aboutToBeDeleted(); 287 this.__titleBarMargin.aboutToBeDeleted(); 288 this.__fontSize.aboutToBeDeleted(); 289 SubscriberManager.Get().delete(this.id__()); 290 this.aboutToBeDeletedInternal(); 291 } 292 293 get editableTitleBarTheme() { 294 return this.__editableTitleBarTheme.get(); 295 } 296 297 set editableTitleBarTheme(newValue) { 298 this.__editableTitleBarTheme.set(newValue); 299 } 300 301 get contentMargin() { 302 return this.__contentMargin.get(); 303 } 304 305 set contentMargin(newValue) { 306 this.__contentMargin.set(newValue); 307 } 308 309 get titleBarMargin() { 310 return this.__titleBarMargin.get(); 311 } 312 313 set titleBarMargin(newValue) { 314 this.__titleBarMargin.set(newValue); 315 } 316 317 get fontSize() { 318 return this.__fontSize.get(); 319 } 320 321 set fontSize(newValue) { 322 this.__fontSize.set(newValue); 323 } 324 325 onWillApplyTheme(theme) { 326 this.editableTitleBarTheme.iconColor = theme.colors.iconPrimary; 327 this.editableTitleBarTheme.titleColor = theme.colors.fontPrimary; 328 this.editableTitleBarTheme.subTitleColor = theme.colors.fontSecondary; 329 this.editableTitleBarTheme.iconBackgroundPressedColor = theme.colors.interactivePressed; 330 this.editableTitleBarTheme.iconBackgroundHoverColor = theme.colors.interactiveHover; 331 this.editableTitleBarTheme.iconBackgroundFocusOutlineColor = theme.colors.interactiveFocus; 332 } 333 334 aboutToAppear() { 335 try { 336 let uiContent = this.getUIContext(); 337 this.isFollowingSystemFontScale = uiContent.isFollowingSystemFontScale(); 338 this.maxFontScale = uiContent.getMaxFontScale(); 339 } catch (exception) { 340 let code = exception?.code; 341 let message = exception?.message; 342 hilog.error(0x3900, 'Ace', `Faild to init fontsizescale info,cause, code: ${code}, message: ${message}`); 343 } 344 } 345 346 decideFontScale() { 347 let uiContent = this.getUIContext(); 348 this.systemFontScale = uiContent.getHostContext()?.config?.fontSizeScale ?? 1; 349 if (!this.isFollowingSystemFontScale) { 350 return 1; 351 } 352 return Math.min(this.systemFontScale, this.maxFontScale); 353 } 354 355 initialRender() { 356 this.observeComponentCreation2((elmtId, isInitialRender) => { 357 Flex.create({ 358 justifyContent: FlexAlign.SpaceBetween, 359 alignItems: ItemAlign.Stretch, 360 }); 361 Flex.backgroundColor(this.options.backgroundColor ?? EditableTitleBar.noneColor); 362 Flex.backgroundBlurStyle(this.options.backgroundBlurStyle ?? BlurStyle.NONE, undefined, 363 { disableSystemAdaptation: true }); 364 Flex.expandSafeArea(this.options.safeAreaTypes ? this.options.safeAreaTypes : [SafeAreaType.SYSTEM], 365 this.options.safeAreaEdges ? this.options.safeAreaEdges : [SafeAreaEdge.TOP]); 366 }, Flex); 367 this.observeComponentCreation2((elmtId, isInitialRender) => { 368 Row.create(); 369 Row.width('100%'); 370 Row.margin(this.contentMargin ?? this.titleBarMargin); 371 Row.height(EditableTitleBar.totalHeight); 372 }, Row); 373 this.observeComponentCreation2((elmtId, isInitialRender) => { 374 Row.create(); 375 Row.flexShrink(0); 376 }, Row); 377 this.leftIconLayout.bind(this)(); 378 Row.pop(); 379 this.observeComponentCreation2((elmtId, isInitialRender) => { 380 Row.create(); 381 Row.width('100%'); 382 Row.flexShrink(1); 383 Row.accessibilityGroup(true); 384 Row.accessibilityDescription({ 385 'id': -1, 386 'type': 10003, 387 params: ['sys.string.subheader_accessibility_title'], 388 'bundleName': '__harDefaultBundleName__', 389 'moduleName': '__harDefaultModuleName__', 390 }); 391 }, Row); 392 this.observeComponentCreation2((elmtId, isInitialRender) => { 393 If.create(); 394 if (this.imageItem) { 395 this.ifElseBranchUpdateFunction(0, () => { 396 this.observeComponentCreation2((elmtId, isInitialRender) => { 397 Row.create(); 398 Row.flexShrink(0); 399 }, Row); 400 this.imageItemLayout.bind(this)(); 401 Row.pop(); 402 }); 403 } else { 404 this.ifElseBranchUpdateFunction(1, () => { 405 }); 406 } 407 }, If); 408 If.pop(); 409 this.observeComponentCreation2((elmtId, isInitialRender) => { 410 Row.create(); 411 Row.width('100%'); 412 Row.flexShrink(1); 413 }, Row); 414 this.titleLayout.bind(this)(); 415 Row.pop(); 416 Row.pop(); 417 this.observeComponentCreation2((elmtId, isInitialRender) => { 418 Row.create(); 419 Row.flexShrink(0); 420 }, Row); 421 this.rightMenuItemsLayout.bind(this)(); 422 Row.pop(); 423 Row.pop(); 424 Flex.pop(); 425 } 426 427 imageItemLayout(parent = null) { 428 { 429 this.observeComponentCreation2((elmtId, isInitialRender) => { 430 if (isInitialRender) { 431 let componentCall = new ImageMenuItem(this, { 432 item: this.imageItem, 433 attribute: ItemType.Image, 434 }, undefined, elmtId, () => { 435 }, { page: 'library/src/main/ets/components/MainPage.ets', line: 254, col: 5 }); 436 ViewPU.create(componentCall); 437 let paramsLambda = () => { 438 return { 439 item: this.imageItem, 440 attribute: ItemType.Image 441 }; 442 }; 443 componentCall.paramsGenerator_ = paramsLambda; 444 } else { 445 this.updateStateVarsOfChildByElmtId(elmtId, {}); 446 } 447 }, { name: 'ImageMenuItem' }); 448 } 449 } 450 451 leftIconLayout(parent = null) { 452 this.observeComponentCreation2((elmtId, isInitialRender) => { 453 If.create(); 454 if (this.leftIconStyle === EditableLeftIconType.Back) { 455 this.ifElseBranchUpdateFunction(0, () => { 456 { 457 this.observeComponentCreation2((elmtId, isInitialRender) => { 458 if (isInitialRender) { 459 let componentCall = new ImageMenuItem(this, { 460 item: { 461 value: PUBLIC_BACK, 462 isEnabled: true, 463 action: () => this.onCancel ? this.onCancel() : 464 this.getUIContext()?.getRouter()?.back(), 465 defaultFocus: this.leftIconDefaultFocus 466 }, 467 fontSize: this.fontSize, 468 attribute: ItemType.LeftIcon, 469 imageMenuItemId: `BackMenuItem_${this.getUniqueId()}` 470 }, undefined, elmtId, () => { 471 }, { page: 'library/src/main/ets/components/MainPage.ets', line: 263, col: 7 }); 472 ViewPU.create(componentCall); 473 let paramsLambda = () => { 474 return { 475 item: { 476 value: PUBLIC_BACK, 477 isEnabled: true, 478 action: () => this.onCancel ? this.onCancel() : 479 this.getUIContext()?.getRouter()?.back(), 480 defaultFocus: this.leftIconDefaultFocus 481 }, 482 fontSize: this.fontSize, 483 attribute: ItemType.LeftIcon, 484 imageMenuItemId: `BackMenuItem_${this.getUniqueId()}` 485 }; 486 }; 487 componentCall.paramsGenerator_ = paramsLambda; 488 } else { 489 this.updateStateVarsOfChildByElmtId(elmtId, {}); 490 } 491 }, { name: 'ImageMenuItem' }); 492 } 493 }); 494 } else { 495 this.ifElseBranchUpdateFunction(1, () => { 496 { 497 this.observeComponentCreation2((elmtId, isInitialRender) => { 498 if (isInitialRender) { 499 let componentCall = new ImageMenuItem(this, { 500 item: { 501 value: PUBLIC_CANCEL, 502 isEnabled: true, 503 action: () => this.onCancel && this.onCancel(), 504 defaultFocus: this.leftIconDefaultFocus 505 }, 506 fontSize: this.fontSize, 507 attribute: ItemType.LeftIcon, 508 imageMenuItemId: `CancelMenuItem_${this.getUniqueId()}` 509 }, undefined, elmtId, () => { 510 }, { page: 'library/src/main/ets/components/MainPage.ets', line: 275, col: 7 }); 511 ViewPU.create(componentCall); 512 let paramsLambda = () => { 513 return { 514 item: { 515 value: PUBLIC_CANCEL, 516 isEnabled: true, 517 action: () => this.onCancel && this.onCancel(), 518 defaultFocus: this.leftIconDefaultFocus 519 }, 520 fontSize: this.fontSize, 521 attribute: ItemType.LeftIcon, 522 imageMenuItemId: `CancelMenuItem_${this.getUniqueId()}` 523 }; 524 }; 525 componentCall.paramsGenerator_ = paramsLambda; 526 } else { 527 this.updateStateVarsOfChildByElmtId(elmtId, {}); 528 } 529 }, { name: 'ImageMenuItem' }); 530 } 531 }); 532 } 533 }, If); 534 If.pop(); 535 } 536 537 titleLayout(parent = null) { 538 this.observeComponentCreation2((elmtId, isInitialRender) => { 539 Column.create(); 540 Column.height(EditableTitleBar.totalHeight); 541 Column.justifyContent(FlexAlign.Center); 542 Column.margin({ 543 // 'sys.float.titlebar_icon_background_space_horizontal' id,value: 8vp 544 start: LengthMetrics.resource({ 545 'id': -1, 546 'type': 10002, 547 params: ['sys.float.titlebar_icon_background_space_horizontal'], 548 'bundleName': '__harDefaultBundleName__', 549 'moduleName': '__harDefaultModuleName__', 550 }), 551 }); 552 Column.alignItems(HorizontalAlign.Start); 553 }, Column); 554 this.observeComponentCreation2((elmtId, isInitialRender) => { 555 Row.create(); 556 Row.justifyContent(FlexAlign.Start); 557 }, Row); 558 this.observeComponentCreation2((elmtId, isInitialRender) => { 559 Text.create(this.title); 560 Text.maxFontSize(TITLE_F_VP); 561 Text.minFontSize(SUBTITLE_F_VP); 562 Text.fontColor(this.editableTitleBarTheme.titleColor); 563 Text.maxLines(this.subtitle ? MAX_LINE_ONE : MAX_LINES_TWO); 564 Text.fontWeight(FontWeight.Bold); 565 Text.textAlign(TextAlign.Start); 566 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 567 Text.heightAdaptivePolicy(this.subtitle ? 568 TextHeightAdaptivePolicy.MAX_LINES_FIRST : TextHeightAdaptivePolicy.MIN_FONT_SIZE_FIRST); 569 Text.constraintSize({ 570 maxHeight: this.subtitle ? EditableTitleBar.maxMainTitleHeight : EditableTitleBar.totalHeight, 571 }); 572 }, Text); 573 Text.pop(); 574 Row.pop(); 575 this.observeComponentCreation2((elmtId, isInitialRender) => { 576 If.create(); 577 if (this.subtitle) { 578 this.ifElseBranchUpdateFunction(0, () => { 579 this.observeComponentCreation2((elmtId, isInitialRender) => { 580 Row.create(); 581 Row.margin({ 582 top: { 583 'id': -1, 584 'type': 10002, 585 params: ['sys.float.padding_level1'], 586 'bundleName': '__harDefaultBundleName__', 587 'moduleName': '__harDefaultModuleName__', 588 }, 589 }); 590 Row.justifyContent(FlexAlign.Start); 591 }, Row); 592 this.observeComponentCreation2((elmtId, isInitialRender) => { 593 Text.create(this.subtitle); 594 Text.maxFontSize(SUBTITLE_F_VP); 595 Text.minFontSize(MIN_SUBTITLE_SIZE); 596 Text.fontColor(this.editableTitleBarTheme.subTitleColor); 597 Text.maxLines(MAX_LINE_ONE); 598 Text.fontWeight(FontWeight.Regular); 599 Text.textAlign(TextAlign.Start); 600 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 601 Text.heightAdaptivePolicy(TextHeightAdaptivePolicy.MAX_LINES_FIRST); 602 Text.constraintSize({ 603 maxHeight: this.title ? EditableTitleBar.maxSubTitleHeight : EditableTitleBar.totalHeight, 604 }); 605 }, Text); 606 Text.pop(); 607 Row.pop(); 608 }); 609 } else { 610 this.ifElseBranchUpdateFunction(1, () => { 611 }); 612 } 613 }, If); 614 If.pop(); 615 Column.pop(); 616 } 617 618 rightMenuItemsLayout(parent = null) { 619 { 620 this.observeComponentCreation2((elmtId, isInitialRender) => { 621 if (isInitialRender) { 622 let componentCall = new EditableTitleBarMenuSection(this, { 623 menuItems: this.menuItems, 624 onSave: this.onSave, 625 isSaveEnabled: this.isSaveIconRequired, 626 fontSize: this.fontSize, 627 parentUniqueId: this.getUniqueId(), 628 saveIconDefaultFocus: this.saveIconDefaultFocus 629 }, undefined, elmtId, () => { 630 }, { page: 'library/src/main/ets/components/MainPage.ets', line: 341, col: 5 }); 631 ViewPU.create(componentCall); 632 let paramsLambda = () => { 633 return { 634 menuItems: this.menuItems, 635 onSave: this.onSave, 636 isSaveEnabled: this.isSaveIconRequired, 637 fontSize: this.fontSize, 638 parentUniqueId: this.getUniqueId(), 639 saveIconDefaultFocus: this.saveIconDefaultFocus 640 }; 641 }; 642 componentCall.paramsGenerator_ = paramsLambda; 643 } else { 644 this.updateStateVarsOfChildByElmtId(elmtId, { 645 fontSize: this.fontSize, 646 parentUniqueId: this.getUniqueId() 647 }); 648 } 649 }, { name: 'EditableTitleBarMenuSection' }); 650 } 651 } 652 653 onPlaceChildren(selfLayoutInfo, children, constraint) { 654 children.forEach((child) => { 655 child.layout({ x: 0, y: 0 }); 656 }); 657 } 658 659 onMeasureSize(selfLayoutInfo, children, constraint) { 660 let result = { width: selfLayoutInfo.width, height: selfLayoutInfo.height }; 661 this.fontSize = this.decideFontScale(); 662 children.forEach((child) => { 663 result.height = child.measure(constraint).height; 664 result.width = Number(constraint.maxWidth); 665 }); 666 return result; 667 } 668 669 rerender() { 670 this.updateDirtyElements(); 671 } 672} 673EditableTitleBar.maxCountOfExtraItems = 3; 674EditableTitleBar.maxOtherCountOfExtraItems = 2; 675EditableTitleBar.commonZero = 0; 676EditableTitleBar.noneColor = '#00000000'; 677// 'sys.float.titlebar_default_height' id,value: 56vp 678EditableTitleBar.defaultHeight = getNumberByResource(125831115, DEFAULT_TITLE_BAR_HEIGHT); 679// 'sys.float.padding_level1' id,value: 2vp 680EditableTitleBar.defaultTitlePadding = getNumberByResource(125830920, DEFAULT_TITLE_PADDING); 681EditableTitleBar.totalHeight = 682 EditableTitleBar.defaultHeight === EditableTitleBar.commonZero ? DEFAULT_TITLE_BAR_HEIGHT : 683 EditableTitleBar.defaultHeight; 684EditableTitleBar.titlePadding = EditableTitleBar.defaultTitlePadding === EditableTitleBar.commonZero ? 685 DEFAULT_TITLE_PADDING : EditableTitleBar.defaultTitlePadding; 686EditableTitleBar.maxMainTitleHeight = 687 (EditableTitleBar.totalHeight - EditableTitleBar.titlePadding) * MAX_MAIN_TITLE_PERCENT; 688EditableTitleBar.maxSubTitleHeight = 689 (EditableTitleBar.totalHeight - EditableTitleBar.titlePadding) * MAX_SUB_TITLE_PERCENT; 690 691class EditableTitleBarMenuSection extends ViewPU { 692 constructor(parent, params, __localStorage, elmtId = -1, paramsLambda = undefined, extraInfo) { 693 super(parent, __localStorage, elmtId, extraInfo); 694 if (typeof paramsLambda === 'function') { 695 this.paramsGenerator_ = paramsLambda; 696 } 697 this.menuItems = undefined; 698 this.onSave = undefined; 699 this.isSaveEnabled = true; 700 this.saveIconDefaultFocus = false; 701 this.__fontSize = new SynchedPropertySimpleOneWayPU(params.fontSize, this, 'fontSize'); 702 this.__parentUniqueId = new SynchedPropertySimpleOneWayPU(params.parentUniqueId, this, 'parentUniqueId'); 703 this.setInitiallyProvidedValue(params); 704 this.finalizeConstruction(); 705 } 706 707 setInitiallyProvidedValue(params) { 708 if (params.menuItems !== undefined) { 709 this.menuItems = params.menuItems; 710 } 711 if (params.onSave !== undefined) { 712 this.onSave = params.onSave; 713 } 714 if (params.isSaveEnabled !== undefined) { 715 this.isSaveEnabled = params.isSaveEnabled; 716 } 717 if (params.saveIconDefaultFocus !== undefined) { 718 this.saveIconDefaultFocus = params.saveIconDefaultFocus; 719 } 720 if (params.fontSize === undefined) { 721 this.__fontSize.set(1); 722 } 723 } 724 725 updateStateVars(params) { 726 this.__fontSize.reset(params.fontSize); 727 this.__parentUniqueId.reset(params.parentUniqueId); 728 } 729 730 purgeVariableDependenciesOnElmtId(rmElmtId) { 731 this.__fontSize.purgeDependencyOnElmtId(rmElmtId); 732 this.__parentUniqueId.purgeDependencyOnElmtId(rmElmtId); 733 } 734 735 aboutToBeDeleted() { 736 this.__fontSize.aboutToBeDeleted(); 737 this.__parentUniqueId.aboutToBeDeleted(); 738 SubscriberManager.Get().delete(this.id__()); 739 this.aboutToBeDeletedInternal(); 740 } 741 742 get fontSize() { 743 return this.__fontSize.get(); 744 } 745 746 set fontSize(newValue) { 747 this.__fontSize.set(newValue); 748 } 749 750 get parentUniqueId() { 751 return this.__parentUniqueId.get(); 752 } 753 754 set parentUniqueId(newValue) { 755 this.__parentUniqueId.set(newValue); 756 } 757 758 initialRender() { 759 this.observeComponentCreation2((elmtId, isInitialRender) => { 760 Column.create(); 761 Column.justifyContent(FlexAlign.Center); 762 }, Column); 763 this.observeComponentCreation2((elmtId, isInitialRender) => { 764 Row.create(); 765 }, Row); 766 this.observeComponentCreation2((elmtId, isInitialRender) => { 767 If.create(); 768 if (this.menuItems !== undefined && this.menuItems.length > EditableTitleBar.commonZero) { 769 this.ifElseBranchUpdateFunction(0, () => { 770 this.observeComponentCreation2((elmtId, isInitialRender) => { 771 ForEach.create(); 772 const forEachItemGenFunction = (_item, index) => { 773 const item = _item; 774 { 775 this.observeComponentCreation2((elmtId, isInitialRender) => { 776 if (isInitialRender) { 777 let componentCall = new ImageMenuItem(this, { 778 item: item, 779 attribute: ItemType.Icon, 780 imageMenuItemId: `ImageMenuItem_${this.parentUniqueId}_${index}` 781 }, undefined, elmtId, () => { 782 }, { 783 page: 'library/src/main/ets/components/MainPage.ets', 784 line: 385, 785 col: 15 786 }); 787 ViewPU.create(componentCall); 788 let paramsLambda = () => { 789 return { 790 item: item, 791 attribute: ItemType.Icon, 792 imageMenuItemId: `ImageMenuItem_${this.parentUniqueId}_${index}` 793 }; 794 }; 795 componentCall.paramsGenerator_ = paramsLambda; 796 } else { 797 this.updateStateVarsOfChildByElmtId(elmtId, {}); 798 } 799 }, { name: 'ImageMenuItem' }); 800 } 801 }; 802 this.forEachUpdateFunction(elmtId, 803 this.menuItems.slice(EditableTitleBar.commonZero, this.isSaveEnabled ? 804 EditableTitleBar.maxOtherCountOfExtraItems : EditableTitleBar.maxCountOfExtraItems), 805 forEachItemGenFunction, undefined, true, false); 806 }, ForEach); 807 ForEach.pop(); 808 }); 809 } else { 810 this.ifElseBranchUpdateFunction(1, () => { 811 }); 812 } 813 }, If); 814 If.pop(); 815 this.observeComponentCreation2((elmtId, isInitialRender) => { 816 If.create(); 817 if (this.isSaveEnabled) { 818 this.ifElseBranchUpdateFunction(0, () => { 819 { 820 this.observeComponentCreation2((elmtId, isInitialRender) => { 821 if (isInitialRender) { 822 let componentCall = new ImageMenuItem(this, { 823 item: { 824 value: PUBLIC_OK, 825 isEnabled: true, 826 action: () => this.onSave && this.onSave(), 827 defaultFocus: this.saveIconDefaultFocus 828 }, 829 fontSize: this.fontSize, 830 attribute: ItemType.Icon, 831 imageMenuItemId: `SaveMenuItem_${this.parentUniqueId}` 832 }, undefined, elmtId, () => { 833 }, { page: 'library/src/main/ets/components/MainPage.ets', line: 393, col: 11 }); 834 ViewPU.create(componentCall); 835 let paramsLambda = () => { 836 return { 837 item: { 838 value: PUBLIC_OK, 839 isEnabled: true, 840 action: () => this.onSave && this.onSave(), 841 defaultFocus: this.saveIconDefaultFocus 842 }, 843 fontSize: this.fontSize, 844 attribute: ItemType.Icon, 845 imageMenuItemId: `SaveMenuItem_${this.parentUniqueId}` 846 }; 847 }; 848 componentCall.paramsGenerator_ = paramsLambda; 849 } else { 850 this.updateStateVarsOfChildByElmtId(elmtId, {}); 851 } 852 }, { name: 'ImageMenuItem' }); 853 } 854 }); 855 } else { 856 this.ifElseBranchUpdateFunction(1, () => { 857 }); 858 } 859 }, If); 860 If.pop(); 861 Row.pop(); 862 Column.pop(); 863 } 864 865 rerender() { 866 this.updateDirtyElements(); 867 } 868} 869 870class ImageMenuItem extends ViewPU { 871 constructor(parent, params, __localStorage, elmtId = -1, paramsLambda = undefined, extraInfo) { 872 super(parent, __localStorage, elmtId, extraInfo); 873 if (typeof paramsLambda === 'function') { 874 this.paramsGenerator_ = paramsLambda; 875 } 876 this.item = { 877 value: '', 878 isEnabled: true, 879 label: '', 880 accessibilityLevel: 'auto', 881 accessibilityText: '', 882 accessibilityDescription: '', 883 }; 884 this.attribute = ItemType.Image; 885 this.callbackId = undefined; 886 this.minFontSize = 1.75; 887 this.maxFontSize = 3.2; 888 this.longPressTime = 500; 889 this.systemFontScale = 1; 890 this.isFollowingSystemFontScale = this.getUIContext().isFollowingSystemFontScale(); 891 this.maxFontScale = this.getUIContext().getMaxFontScale(); 892 this.__fontSize = new ObservedPropertySimplePU(1, this, 'fontSize'); 893 this.__isOnFocus = new ObservedPropertySimplePU(false, this, 'isOnFocus'); 894 this.__isOnHover = new ObservedPropertySimplePU(false, this, 'isOnHover'); 895 this.__isOnClick = new ObservedPropertySimplePU(false, this, 'isOnClick'); 896 this.imageMenuItemId = undefined; 897 this.__editableTitleBarTheme = this.initializeConsume('editableTitleBarTheme', 'editableTitleBarTheme'); 898 this.dialogController = new CustomDialogController({ 899 builder: () => { 900 let jsDialog = new EditableTitleBarDialog(this, { 901 cancel: () => { 902 }, 903 confirm: () => { 904 }, 905 itemEditableDialog: this.item, 906 textEditableTitleBarDialog: this.item.label ? this.item.label : this.textDialog(), 907 fontSize: this.fontSize, 908 }, undefined, -1, () => { 909 }, { page: 'library/src/main/ets/components/MainPage.ets', line: 436, col: 14 }); 910 jsDialog.setController(this.dialogController); 911 ViewPU.create(jsDialog); 912 let paramsLambda = () => { 913 return { 914 cancel: () => { 915 }, 916 confirm: () => { 917 }, 918 itemEditableDialog: this.item, 919 textEditableTitleBarDialog: this.item.label ? this.item.label : this.textDialog(), 920 fontSize: this.fontSize 921 }; 922 }; 923 jsDialog.paramsGenerator_ = paramsLambda; 924 }, 925 maskColor: Color.Transparent, 926 isModal: true, 927 customStyle: true 928 }, this); 929 this.__buttonGestureModifier = 930 new ObservedPropertyObjectPU(new ButtonGestureModifier(this.dialogController), this, 931 'buttonGestureModifier'); 932 this.envCallback = { 933 onConfigurationUpdated: (config) => { 934 if (config === undefined || !this.isFollowingSystemFontScale) { 935 this.fontSize = 1; 936 return; 937 } 938 try { 939 this.fontSize = Math.min(this.maxFontScale, config.fontSizeScale ?? 1); 940 this.buttonGestureModifier.fontSize = this.fontSize; 941 } catch (paramError) { 942 let code = paramError?.code; 943 let message = paramError?.message; 944 hilog.error(0x3900, 'Ace', `EditableTitleBar environmentCallback error: ${code}, ${message}`); 945 } 946 }, 947 onMemoryLevel: (level) => { 948 } 949 }; 950 this.setInitiallyProvidedValue(params); 951 this.finalizeConstruction(); 952 } 953 954 setInitiallyProvidedValue(params) { 955 if (params.item !== undefined) { 956 this.item = params.item; 957 } 958 if (params.attribute !== undefined) { 959 this.attribute = params.attribute; 960 } 961 if (params.callbackId !== undefined) { 962 this.callbackId = params.callbackId; 963 } 964 if (params.minFontSize !== undefined) { 965 this.minFontSize = params.minFontSize; 966 } 967 if (params.maxFontSize !== undefined) { 968 this.maxFontSize = params.maxFontSize; 969 } 970 if (params.longPressTime !== undefined) { 971 this.longPressTime = params.longPressTime; 972 } 973 if (params.systemFontScale !== undefined) { 974 this.systemFontScale = params.systemFontScale; 975 } 976 if (params.isFollowingSystemFontScale !== undefined) { 977 this.isFollowingSystemFontScale = params.isFollowingSystemFontScale; 978 } 979 if (params.maxFontScale !== undefined) { 980 this.maxFontScale = params.maxFontScale; 981 } 982 if (params.fontSize !== undefined) { 983 this.fontSize = params.fontSize; 984 } 985 if (params.isOnFocus !== undefined) { 986 this.isOnFocus = params.isOnFocus; 987 } 988 if (params.isOnHover !== undefined) { 989 this.isOnHover = params.isOnHover; 990 } 991 if (params.isOnClick !== undefined) { 992 this.isOnClick = params.isOnClick; 993 } 994 if (params.imageMenuItemId !== undefined) { 995 this.imageMenuItemId = params.imageMenuItemId; 996 } 997 if (params.dialogController !== undefined) { 998 this.dialogController = params.dialogController; 999 } 1000 if (params.buttonGestureModifier !== undefined) { 1001 this.buttonGestureModifier = params.buttonGestureModifier; 1002 } 1003 if (params.envCallback !== undefined) { 1004 this.envCallback = params.envCallback; 1005 } 1006 } 1007 1008 updateStateVars(params) { 1009 } 1010 1011 purgeVariableDependenciesOnElmtId(rmElmtId) { 1012 this.__fontSize.purgeDependencyOnElmtId(rmElmtId); 1013 this.__isOnFocus.purgeDependencyOnElmtId(rmElmtId); 1014 this.__isOnHover.purgeDependencyOnElmtId(rmElmtId); 1015 this.__isOnClick.purgeDependencyOnElmtId(rmElmtId); 1016 this.__editableTitleBarTheme.purgeDependencyOnElmtId(rmElmtId); 1017 this.__buttonGestureModifier.purgeDependencyOnElmtId(rmElmtId); 1018 } 1019 1020 aboutToBeDeleted() { 1021 this.__fontSize.aboutToBeDeleted(); 1022 this.__isOnFocus.aboutToBeDeleted(); 1023 this.__isOnHover.aboutToBeDeleted(); 1024 this.__isOnClick.aboutToBeDeleted(); 1025 this.__editableTitleBarTheme.aboutToBeDeleted(); 1026 this.__buttonGestureModifier.aboutToBeDeleted(); 1027 SubscriberManager.Get().delete(this.id__()); 1028 this.aboutToBeDeletedInternal(); 1029 } 1030 1031 get fontSize() { 1032 return this.__fontSize.get(); 1033 } 1034 1035 set fontSize(newValue) { 1036 this.__fontSize.set(newValue); 1037 } 1038 1039 get isOnFocus() { 1040 return this.__isOnFocus.get(); 1041 } 1042 1043 set isOnFocus(newValue) { 1044 this.__isOnFocus.set(newValue); 1045 } 1046 1047 get isOnHover() { 1048 return this.__isOnHover.get(); 1049 } 1050 1051 set isOnHover(newValue) { 1052 this.__isOnHover.set(newValue); 1053 } 1054 1055 get isOnClick() { 1056 return this.__isOnClick.get(); 1057 } 1058 1059 set isOnClick(newValue) { 1060 this.__isOnClick.set(newValue); 1061 } 1062 1063 get editableTitleBarTheme() { 1064 return this.__editableTitleBarTheme.get(); 1065 } 1066 1067 set editableTitleBarTheme(newValue) { 1068 this.__editableTitleBarTheme.set(newValue); 1069 } 1070 1071 get buttonGestureModifier() { 1072 return this.__buttonGestureModifier.get(); 1073 } 1074 1075 set buttonGestureModifier(newValue) { 1076 this.__buttonGestureModifier.set(newValue); 1077 } 1078 1079 textDialog() { 1080 if (this.item.value === PUBLIC_OK) { 1081 return { 1082 'id': -1, 1083 'type': 10003, 1084 params: ['sys.string.icon_save'], 1085 'bundleName': '__harDefaultBundleName__', 1086 'moduleName': '__harDefaultModuleName__', 1087 }; 1088 } else if (this.item.value === PUBLIC_CANCEL) { 1089 return { 1090 'id': -1, 1091 'type': 10003, 1092 params: ['sys.string.icon_cancel'], 1093 'bundleName': '__harDefaultBundleName__', 1094 'moduleName': '__harDefaultModuleName__', 1095 }; 1096 } else if (this.item.value === PUBLIC_BACK) { 1097 return { 1098 'id': -1, 1099 'type': 10003, 1100 params: ['sys.string.icon_back'], 1101 'bundleName': '__harDefaultBundleName__', 1102 'moduleName': '__harDefaultModuleName__', 1103 }; 1104 } else { 1105 return this.item.label ? this.item.label : ''; 1106 } 1107 } 1108 1109 aboutToAppear() { 1110 try { 1111 this.callbackId = getContext()?.getApplicationContext()?.on('environment', this.envCallback); 1112 } catch (paramError) { 1113 let code = paramError?.code; 1114 let message = paramError?.message; 1115 hilog.error(0x3900, 'Ace', `EditableTitleBar Faild to get environment param error: ${code}, ${message}`); 1116 } 1117 this.fontSize = this.decideFontScale(); 1118 this.buttonGestureModifier.fontSize = this.fontSize; 1119 } 1120 1121 decideFontScale() { 1122 try { 1123 let uiContent = this.getUIContext(); 1124 this.systemFontScale = uiContent.getHostContext()?.config?.fontSizeScale ?? 1; 1125 if (!this.isFollowingSystemFontScale) { 1126 return 1; 1127 } 1128 return Math.min(this.systemFontScale, this.maxFontScale); 1129 } catch (exception) { 1130 let code = exception?.code; 1131 let message = exception?.message; 1132 hilog.error(0x3900, 'EditableTitleBar', 1133 `Faild to decideFontScale,cause, code: ${code}, message: ${message}`); 1134 return 1; 1135 } 1136 } 1137 1138 touchEventAction(event) { 1139 if (!this.item.isEnabled) { 1140 return; 1141 } 1142 if (event.type === TouchType.Down) { 1143 this.isOnClick = true; 1144 } 1145 if (event.type === TouchType.Up || event.type === TouchType.Cancel) { 1146 if (this.fontSize >= this.minFontSize) { 1147 this.dialogController?.close(); 1148 } 1149 this.isOnClick = false; 1150 } 1151 } 1152 1153 keyEventAction(event) { 1154 if (!this.item.isEnabled) { 1155 return; 1156 } 1157 if (event.keyCode !== KeyCode.KEYCODE_ENTER && event.keyCode !== KeyCode.KEYCODE_SPACE) { 1158 return; 1159 } 1160 if (event.type === KeyType.Down) { 1161 this.isOnClick = true; 1162 } 1163 if (event.type === KeyType.Up) { 1164 this.isOnClick = false; 1165 } 1166 } 1167 1168 getBgColor() { 1169 if (this.isOnClick) { 1170 return this.editableTitleBarTheme.iconBackgroundPressedColor; 1171 } else if (this.isOnHover) { 1172 return this.editableTitleBarTheme.iconBackgroundHoverColor; 1173 } else { 1174 return this.editableTitleBarTheme.iconBackgroundColor; 1175 } 1176 } 1177 1178 getFgColor() { 1179 if (this.isOnClick) { 1180 return { 1181 'id': -1, 1182 'type': 10001, 1183 params: ['sys.color.titlebar_icon_background_pressed_color'], 1184 'bundleName': '__harDefaultBundleName__', 1185 'moduleName': '__harDefaultModuleName__', 1186 }; 1187 } else if (this.isOnHover) { 1188 return { 1189 'id': -1, 1190 'type': 10001, 1191 params: ['sys.color.titlebar_icon_background_hover_color'], 1192 'bundleName': '__harDefaultBundleName__', 1193 'moduleName': '__harDefaultModuleName__', 1194 }; 1195 } else { 1196 return EditableTitleBar.noneColor; 1197 } 1198 } 1199 1200 getStringByNameSync(contextName) { 1201 let uiContext = ''; 1202 try { 1203 uiContext = getContext()?.resourceManager?.getStringByNameSync(contextName); 1204 } catch (exception) { 1205 let code = exception?.code; 1206 let message = exception?.message; 1207 hilog.error(0x3900, 'Ace', `Faild to getStringByNameSync,cause, code: ${code}, message: ${message}`); 1208 } 1209 return uiContext; 1210 } 1211 1212 toStringFormat(resource) { 1213 if (typeof resource === 'string' || typeof resource === 'undefined') { 1214 return resource; 1215 } else { 1216 let resourceString = ''; 1217 try { 1218 if (resource.id === -1) { 1219 resourceString = 1220 getContext()?.resourceManager?.getStringByNameSync(resource.params?.[0]?.split('.').pop() ?? 1221 ''); 1222 } else { 1223 resourceString = getContext()?.resourceManager?.getStringSync(resource); 1224 } 1225 } catch (err) { 1226 let code = err?.code; 1227 let message = err?.message; 1228 hilog.error(0x3900, 'Ace', 1229 `Faild to EditableTitleBar toStringFormat, code: ${code}, message: ${message}`); 1230 } 1231 return resourceString; 1232 } 1233 } 1234 1235 getAccessibilityReadText() { 1236 if (this.item.value === PUBLIC_OK) { 1237 return this.getStringByNameSync('icon_save'); 1238 } else if (this.item.value === PUBLIC_CANCEL) { 1239 return this.getStringByNameSync('icon_cancel'); 1240 } else if (this.item.value === PUBLIC_BACK) { 1241 return this.getStringByNameSync('icon_back'); 1242 } else if (this.item.accessibilityText) { 1243 return this.item.accessibilityText; 1244 } else if (this.item.label) { 1245 return this.item.label; 1246 } 1247 return ' '; 1248 } 1249 1250 getRightIconAccessibilityLevel() { 1251 if (this.item.accessibilityLevel && this.item.accessibilityLevel !== '') { 1252 return this.item.accessibilityLevel; 1253 } 1254 return 'auto'; 1255 } 1256 1257 getAccessibilityDescription() { 1258 if (this.item.accessibilityDescription && this.item.accessibilityDescription !== '') { 1259 return this.item.accessibilityDescription; 1260 } 1261 return ''; 1262 } 1263 1264 IconBuilder(parent = null) { 1265 this.observeComponentCreation2((elmtId, isInitialRender) => { 1266 Button.createWithChild({ type: ButtonType.Normal, stateEffect: this.item.isEnabled }); 1267 Button.id(this.imageMenuItemId); 1268 Button.width({ 1269 'id': -1, 1270 'type': 10002, 1271 params: ['sys.float.titlebar_icon_background_width'], 1272 'bundleName': '__harDefaultBundleName__', 1273 'moduleName': '__harDefaultModuleName__', 1274 }); 1275 Button.height({ 1276 'id': -1, 1277 'type': 10002, 1278 params: ['sys.float.titlebar_icon_background_height'], 1279 'bundleName': '__harDefaultBundleName__', 1280 'moduleName': '__harDefaultModuleName__', 1281 }); 1282 Button.focusable(this.item.isEnabled); 1283 Button.enabled(this.item.isEnabled); 1284 Button.borderRadius({ 1285 'id': -1, 1286 'type': 10002, 1287 params: ['sys.float.titlebar_icon_background_shape'], 1288 'bundleName': '__harDefaultBundleName__', 1289 'moduleName': '__harDefaultModuleName__', 1290 }); 1291 Button.margin({ 1292 start: this.attribute === ItemType.LeftIcon ? LengthMetrics.vp(EditableTitleBar.commonZero) : 1293 LengthMetrics.resource({ 1294 'id': -1, 1295 'type': 10002, 1296 params: ['sys.float.titlebar_icon_background_space_horizontal'], 1297 'bundleName': '__harDefaultBundleName__', 1298 'moduleName': '__harDefaultModuleName__', 1299 }), 1300 }); 1301 Button.focusOnTouch(true); 1302 Button.foregroundColor(this.getFgColor()); 1303 Button.backgroundColor(this.getBgColor()); 1304 ViewStackProcessor.visualState('focused'); 1305 Button.border({ 1306 radius: { 1307 'id': -1, 1308 'type': 10002, 1309 params: ['sys.float.titlebar_icon_background_shape'], 1310 'bundleName': '__harDefaultBundleName__', 1311 'moduleName': '__harDefaultModuleName__', 1312 }, 1313 width: { 1314 'id': -1, 1315 'type': 10002, 1316 params: ['sys.float.titlebar_icon_background_focus_outline_weight'], 1317 'bundleName': '__harDefaultBundleName__', 1318 'moduleName': '__harDefaultModuleName__', 1319 }, 1320 color: this.editableTitleBarTheme.iconBackgroundFocusOutlineColor, 1321 style: BorderStyle.Solid, 1322 }); 1323 ViewStackProcessor.visualState('normal'); 1324 Button.border({ 1325 radius: { 1326 'id': -1, 1327 'type': 10002, 1328 params: ['sys.float.titlebar_icon_background_shape'], 1329 'bundleName': '__harDefaultBundleName__', 1330 'moduleName': '__harDefaultModuleName__', 1331 }, 1332 width: EditableTitleBar.commonZero, 1333 }); 1334 ViewStackProcessor.visualState('pressed'); 1335 Button.border({ 1336 radius: { 1337 'id': -1, 1338 'type': 10002, 1339 params: ['sys.float.titlebar_icon_background_shape'], 1340 'bundleName': '__harDefaultBundleName__', 1341 'moduleName': '__harDefaultModuleName__', 1342 }, 1343 width: EditableTitleBar.commonZero, 1344 }); 1345 ViewStackProcessor.visualState(); 1346 Button.onFocus(() => { 1347 if (!this.item.isEnabled) { 1348 return; 1349 } 1350 this.isOnFocus = true; 1351 }); 1352 Button.onBlur(() => this.isOnFocus = false); 1353 Button.onHover((isOn) => { 1354 if (!this.item.isEnabled) { 1355 return; 1356 } 1357 this.isOnHover = isOn; 1358 }); 1359 Button.onKeyEvent((event) => { 1360 this.keyEventAction(event); 1361 }); 1362 Button.onTouch((event) => { 1363 this.touchEventAction(event); 1364 }); 1365 Button.onClick(() => { 1366 if (this.item.isEnabled === undefined) { 1367 this.item.isEnabled = true; 1368 } 1369 this.item.isEnabled && this.item.action && this.item.action(); 1370 }); 1371 Button.gestureModifier(ObservedObject.GetRawObject(this.buttonGestureModifier)); 1372 Button.accessibilityLevel(this.getRightIconAccessibilityLevel()); 1373 Button.accessibilityDescription(this.getAccessibilityDescription()); 1374 }, Button); 1375 this.observeComponentCreation2((elmtId, isInitialRender) => { 1376 If.create(); 1377 if (this.item.symbolStyle !== undefined) { 1378 this.ifElseBranchUpdateFunction(0, () => { 1379 this.observeComponentCreation2((elmtId, isInitialRender) => { 1380 SymbolGlyph.create(); 1381 SymbolGlyph.fontColor([this.editableTitleBarTheme.iconColor]); 1382 SymbolGlyph.attributeModifier.bind(this)(this.item.symbolStyle); 1383 SymbolGlyph.focusable(this.item.isEnabled); 1384 SymbolGlyph.enabled(this.item.isEnabled); 1385 SymbolGlyph.draggable(false); 1386 SymbolGlyph.accessibilityText(this.getAccessibilityReadText()); 1387 SymbolGlyph.effectStrategy(SymbolEffectStrategy.NONE); 1388 SymbolGlyph.symbolEffect(new SymbolEffect(), false); 1389 SymbolGlyph.fontSize(SYMBOL_SIZE); 1390 SymbolGlyph.defaultFocus(this.item.isEnabled ? this.item.defaultFocus : false); 1391 }, SymbolGlyph); 1392 }); 1393 } else { 1394 this.ifElseBranchUpdateFunction(1, () => { 1395 this.observeComponentCreation2((elmtId, isInitialRender) => { 1396 If.create(); 1397 if (Util.isSymbolResource(this.item.value)) { 1398 this.ifElseBranchUpdateFunction(0, () => { 1399 this.observeComponentCreation2((elmtId, isInitialRender) => { 1400 SymbolGlyph.create(this.item.value); 1401 SymbolGlyph.fontSize(SYMBOL_SIZE); 1402 SymbolGlyph.fontColor([this.editableTitleBarTheme.iconColor]); 1403 SymbolGlyph.focusable(this.item.isEnabled); 1404 SymbolGlyph.enabled(this.item.isEnabled); 1405 SymbolGlyph.draggable(false); 1406 SymbolGlyph.accessibilityText(this.getAccessibilityReadText()); 1407 SymbolGlyph.defaultFocus(this.item.isEnabled ? this.item.defaultFocus : false); 1408 }, SymbolGlyph); 1409 }); 1410 } else { 1411 this.ifElseBranchUpdateFunction(1, () => { 1412 this.observeComponentCreation2((elmtId, isInitialRender) => { 1413 Image.create(this.item.value); 1414 Image.fillColor(this.editableTitleBarTheme.iconColor); 1415 Image.matchTextDirection(this.item.value === PUBLIC_IMAGE_BACK ? true : false); 1416 Image.width({ 1417 'id': -1, 1418 'type': 10002, 1419 params: ['sys.float.titlebar_icon_width'], 1420 'bundleName': '__harDefaultBundleName__', 1421 'moduleName': '__harDefaultModuleName__', 1422 }); 1423 Image.height({ 1424 'id': -1, 1425 'type': 10002, 1426 params: ['sys.float.titlebar_icon_height'], 1427 'bundleName': '__harDefaultBundleName__', 1428 'moduleName': '__harDefaultModuleName__', 1429 }); 1430 Image.focusable(this.item.isEnabled); 1431 Image.enabled(this.item.isEnabled); 1432 Image.draggable(false); 1433 Image.accessibilityText(this.getAccessibilityReadText()); 1434 Image.defaultFocus(this.item.isEnabled ? this.item.defaultFocus : false); 1435 }, Image); 1436 }); 1437 } 1438 }, If); 1439 If.pop(); 1440 }); 1441 } 1442 }, If); 1443 If.pop(); 1444 Button.pop(); 1445 } 1446 1447 ImageBuilder(parent = null) { 1448 this.observeComponentCreation2((elmtId, isInitialRender) => { 1449 Stack.create({ alignContent: Alignment.Center }); 1450 Stack.margin({ 1451 start: LengthMetrics.resource({ 1452 'id': -1, 1453 'type': 10002, 1454 params: ['sys.float.titlebar_icon_background_space_horizontal'], 1455 'bundleName': '__harDefaultBundleName__', 1456 'moduleName': '__harDefaultModuleName__', 1457 }), 1458 }); 1459 }, Stack); 1460 this.observeComponentCreation2((elmtId, isInitialRender) => { 1461 Image.create(this.item.value); 1462 Image.width({ 1463 'id': -1, 1464 'type': 10002, 1465 params: ['sys.float.titlebar_icon_background_width'], 1466 'bundleName': '__harDefaultBundleName__', 1467 'moduleName': '__harDefaultModuleName__', 1468 }); 1469 Image.height({ 1470 'id': -1, 1471 'type': 10002, 1472 params: ['sys.float.titlebar_icon_background_height'], 1473 'bundleName': '__harDefaultBundleName__', 1474 'moduleName': '__harDefaultModuleName__', 1475 }); 1476 Image.borderRadius({ 1477 'id': -1, 1478 'type': 10002, 1479 params: ['sys.float.corner_radius_level10'], 1480 'bundleName': '__harDefaultBundleName__', 1481 'moduleName': '__harDefaultModuleName__', 1482 }); 1483 Image.focusable(false); 1484 Image.enabled(this.item.isEnabled); 1485 Image.objectFit(ImageFit.Cover); 1486 }, Image); 1487 this.observeComponentCreation2((elmtId, isInitialRender) => { 1488 Button.createWithLabel({ type: ButtonType.Circle }); 1489 Button.width({ 1490 'id': -1, 1491 'type': 10002, 1492 params: ['sys.float.titlebar_icon_background_width'], 1493 'bundleName': '__harDefaultBundleName__', 1494 'moduleName': '__harDefaultModuleName__', 1495 }); 1496 Button.height({ 1497 'id': -1, 1498 'type': 10002, 1499 params: ['sys.float.titlebar_icon_background_height'], 1500 'bundleName': '__harDefaultBundleName__', 1501 'moduleName': '__harDefaultModuleName__', 1502 }); 1503 Button.focusable(this.item.isEnabled); 1504 Button.enabled(this.item.isEnabled); 1505 Button.foregroundColor(this.getFgColor()); 1506 Button.backgroundColor(EditableTitleBar.noneColor); 1507 ViewStackProcessor.visualState('pressed'); 1508 Button.border({ 1509 radius: { 1510 'id': -1, 1511 'type': 10002, 1512 params: ['sys.float.titlebar_icon_background_shape'], 1513 'bundleName': '__harDefaultBundleName__', 1514 'moduleName': '__harDefaultModuleName__', 1515 }, 1516 width: EditableTitleBar.commonZero, 1517 }); 1518 ViewStackProcessor.visualState('normal'); 1519 Button.border({ 1520 radius: { 1521 'id': -1, 1522 'type': 10002, 1523 params: ['sys.float.titlebar_icon_background_shape'], 1524 'bundleName': '__harDefaultBundleName__', 1525 'moduleName': '__harDefaultModuleName__', 1526 }, 1527 width: EditableTitleBar.commonZero, 1528 }); 1529 ViewStackProcessor.visualState('focused'); 1530 Button.border({ 1531 radius: { 1532 'id': -1, 1533 'type': 10002, 1534 params: ['sys.float.titlebar_icon_background_shape'], 1535 'bundleName': '__harDefaultBundleName__', 1536 'moduleName': '__harDefaultModuleName__', 1537 }, 1538 width: { 1539 'id': -1, 1540 'type': 10002, 1541 params: ['sys.float.titlebar_icon_background_focus_outline_weight'], 1542 'bundleName': '__harDefaultBundleName__', 1543 'moduleName': '__harDefaultModuleName__', 1544 }, 1545 color: this.editableTitleBarTheme.iconBackgroundFocusOutlineColor, 1546 style: BorderStyle.Solid, 1547 }); 1548 ViewStackProcessor.visualState(); 1549 Button.onFocus(() => { 1550 if (!this.item.isEnabled) { 1551 return; 1552 } 1553 this.isOnFocus = true; 1554 }); 1555 Button.onBlur(() => this.isOnFocus = false); 1556 Button.onHover((isOn) => { 1557 if (!this.item.isEnabled) { 1558 return; 1559 } 1560 this.isOnHover = isOn; 1561 }); 1562 Button.onKeyEvent((event) => { 1563 this.keyEventAction(event); 1564 }); 1565 Button.onTouch((event) => { 1566 this.touchEventAction(event); 1567 }); 1568 Button.onClick(() => { 1569 if (this.item.isEnabled === undefined) { 1570 this.item.isEnabled = true; 1571 } 1572 this.item.isEnabled && this.item.action && this.item.action(); 1573 }); 1574 Button.gestureModifier(ObservedObject.GetRawObject(this.buttonGestureModifier)); 1575 Button.defaultFocus(this.item.isEnabled ? this.item.defaultFocus : false); 1576 }, Button); 1577 Button.pop(); 1578 Stack.pop(); 1579 } 1580 1581 initialRender() { 1582 this.observeComponentCreation2((elmtId, isInitialRender) => { 1583 If.create(); 1584 if (this.attribute === ItemType.Icon || this.attribute === ItemType.LeftIcon) { 1585 this.ifElseBranchUpdateFunction(0, () => { 1586 this.IconBuilder.bind(this)(); 1587 }); 1588 } else { 1589 this.ifElseBranchUpdateFunction(1, () => { 1590 this.ImageBuilder.bind(this)(); 1591 }); 1592 } 1593 }, If); 1594 If.pop(); 1595 } 1596 1597 rerender() { 1598 this.updateDirtyElements(); 1599 } 1600} 1601 1602class EditableTitleBarDialog extends ViewPU { 1603 constructor(parent, params, __localStorage, elmtId = -1, paramsLambda = undefined, extraInfo) { 1604 super(parent, __localStorage, elmtId, extraInfo); 1605 if (typeof paramsLambda === 'function') { 1606 this.paramsGenerator_ = paramsLambda; 1607 } 1608 this.itemEditableDialog = { 1609 value: '', 1610 isEnabled: true, 1611 }; 1612 this.callbackId = undefined; 1613 this.textEditableTitleBarDialog = ''; 1614 this.mainWindowStage = undefined; 1615 this.controller = undefined; 1616 this.minFontSize = 1.75; 1617 this.maxFontSize = 3.2; 1618 this.screenWidth = 640; 1619 this.verticalScreenLines = 6; 1620 this.horizontalsScreenLines = 1; 1621 this.cancel = () => { 1622 }; 1623 this.confirm = () => { 1624 }; 1625 this.__mainWindow = this.createStorageLink('mainWindow', undefined, 'mainWindow'); 1626 this.__fontSize = new SynchedPropertySimpleOneWayPU(params.fontSize, this, 'fontSize'); 1627 this.__maxLines = new ObservedPropertySimplePU(1, this, 'maxLines'); 1628 this.__windowStandardHeight = this.createStorageProp('windowStandardHeight', 0, 'windowStandardHeight'); 1629 this.setInitiallyProvidedValue(params); 1630 this.finalizeConstruction(); 1631 } 1632 1633 setInitiallyProvidedValue(params) { 1634 if (params.itemEditableDialog !== undefined) { 1635 this.itemEditableDialog = params.itemEditableDialog; 1636 } 1637 if (params.callbackId !== undefined) { 1638 this.callbackId = params.callbackId; 1639 } 1640 if (params.textEditableTitleBarDialog !== undefined) { 1641 this.textEditableTitleBarDialog = params.textEditableTitleBarDialog; 1642 } 1643 if (params.mainWindowStage !== undefined) { 1644 this.mainWindowStage = params.mainWindowStage; 1645 } 1646 if (params.controller !== undefined) { 1647 this.controller = params.controller; 1648 } 1649 if (params.minFontSize !== undefined) { 1650 this.minFontSize = params.minFontSize; 1651 } 1652 if (params.maxFontSize !== undefined) { 1653 this.maxFontSize = params.maxFontSize; 1654 } 1655 if (params.screenWidth !== undefined) { 1656 this.screenWidth = params.screenWidth; 1657 } 1658 if (params.verticalScreenLines !== undefined) { 1659 this.verticalScreenLines = params.verticalScreenLines; 1660 } 1661 if (params.horizontalsScreenLines !== undefined) { 1662 this.horizontalsScreenLines = params.horizontalsScreenLines; 1663 } 1664 if (params.cancel !== undefined) { 1665 this.cancel = params.cancel; 1666 } 1667 if (params.confirm !== undefined) { 1668 this.confirm = params.confirm; 1669 } 1670 if (params.fontSize === undefined) { 1671 this.__fontSize.set(1); 1672 } 1673 if (params.maxLines !== undefined) { 1674 this.maxLines = params.maxLines; 1675 } 1676 } 1677 1678 updateStateVars(params) { 1679 this.__fontSize.reset(params.fontSize); 1680 } 1681 1682 purgeVariableDependenciesOnElmtId(rmElmtId) { 1683 this.__mainWindow.purgeDependencyOnElmtId(rmElmtId); 1684 this.__fontSize.purgeDependencyOnElmtId(rmElmtId); 1685 this.__maxLines.purgeDependencyOnElmtId(rmElmtId); 1686 this.__windowStandardHeight.purgeDependencyOnElmtId(rmElmtId); 1687 } 1688 1689 aboutToBeDeleted() { 1690 this.__mainWindow.aboutToBeDeleted(); 1691 this.__fontSize.aboutToBeDeleted(); 1692 this.__maxLines.aboutToBeDeleted(); 1693 this.__windowStandardHeight.aboutToBeDeleted(); 1694 SubscriberManager.Get().delete(this.id__()); 1695 this.aboutToBeDeletedInternal(); 1696 } 1697 1698 setController(ctr) { 1699 this.controller = ctr; 1700 } 1701 1702 get mainWindow() { 1703 return this.__mainWindow.get(); 1704 } 1705 1706 set mainWindow(newValue) { 1707 this.__mainWindow.set(newValue); 1708 } 1709 1710 get fontSize() { 1711 return this.__fontSize.get(); 1712 } 1713 1714 set fontSize(newValue) { 1715 this.__fontSize.set(newValue); 1716 } 1717 1718 get maxLines() { 1719 return this.__maxLines.get(); 1720 } 1721 1722 set maxLines(newValue) { 1723 this.__maxLines.set(newValue); 1724 } 1725 1726 get windowStandardHeight() { 1727 return this.__windowStandardHeight.get(); 1728 } 1729 1730 set windowStandardHeight(newValue) { 1731 this.__windowStandardHeight.set(newValue); 1732 } 1733 1734 initialRender() { 1735 this.observeComponentCreation2((elmtId, isInitialRender) => { 1736 If.create(); 1737 if (this.textEditableTitleBarDialog) { 1738 this.ifElseBranchUpdateFunction(0, () => { 1739 this.observeComponentCreation2((elmtId, isInitialRender) => { 1740 Column.create(); 1741 Column.width(this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG); 1742 Column.constraintSize({ 1743 minHeight: this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG 1744 }); 1745 Column.backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK, undefined, 1746 { disableSystemAdaptation: true }); 1747 Column.shadow(ShadowStyle.OUTER_DEFAULT_LG); 1748 Column.borderRadius(({ 1749 'id': -1, 1750 'type': 10002, 1751 params: ['sys.float.corner_radius_level10'], 1752 'bundleName': '__harDefaultBundleName__', 1753 'moduleName': '__harDefaultModuleName__', 1754 })); 1755 }, Column); 1756 this.observeComponentCreation2((elmtId, isInitialRender) => { 1757 If.create(); 1758 if (this.itemEditableDialog.symbolStyle !== undefined) { 1759 this.ifElseBranchUpdateFunction(0, () => { 1760 this.observeComponentCreation2((elmtId, isInitialRender) => { 1761 SymbolGlyph.create(); 1762 SymbolGlyph.fontColor([{ 1763 'id': -1, 1764 'type': 10001, 1765 params: ['sys.color.icon_primary'], 1766 'bundleName': '__harDefaultBundleName__', 1767 'moduleName': '__harDefaultModuleName__', 1768 }]); 1769 SymbolGlyph.attributeModifier.bind(this)(this.itemEditableDialog.symbolStyle); 1770 SymbolGlyph.margin({ 1771 top: { 1772 'id': -1, 1773 'type': 10002, 1774 params: ['sys.float.padding_level24'], 1775 'bundleName': '__harDefaultBundleName__', 1776 'moduleName': '__harDefaultModuleName__', 1777 }, 1778 bottom: { 1779 'id': -1, 1780 'type': 10002, 1781 params: ['sys.float.padding_level8'], 1782 'bundleName': '__harDefaultBundleName__', 1783 'moduleName': '__harDefaultModuleName__', 1784 }, 1785 }); 1786 SymbolGlyph.effectStrategy(SymbolEffectStrategy.NONE); 1787 SymbolGlyph.symbolEffect(new SymbolEffect(), false); 1788 SymbolGlyph.fontSize(SYMBOL_TITLE_SIZE); 1789 SymbolGlyph.direction(Direction.Ltr); 1790 }, SymbolGlyph); 1791 }); 1792 } else { 1793 this.ifElseBranchUpdateFunction(1, () => { 1794 this.observeComponentCreation2((elmtId, isInitialRender) => { 1795 If.create(); 1796 if (Util.isSymbolResource(this.itemEditableDialog.value)) { 1797 this.ifElseBranchUpdateFunction(0, () => { 1798 this.observeComponentCreation2((elmtId, isInitialRender) => { 1799 SymbolGlyph.create(this.itemEditableDialog.value); 1800 SymbolGlyph.margin({ 1801 top: { 1802 'id': -1, 1803 'type': 10002, 1804 params: ['sys.float.padding_level24'], 1805 'bundleName': '__harDefaultBundleName__', 1806 'moduleName': '__harDefaultModuleName__', 1807 }, 1808 bottom: { 1809 'id': -1, 1810 'type': 10002, 1811 params: ['sys.float.padding_level8'], 1812 'bundleName': '__harDefaultBundleName__', 1813 'moduleName': '__harDefaultModuleName__', 1814 }, 1815 }); 1816 SymbolGlyph.fontColor([{ 1817 'id': -1, 1818 'type': 10001, 1819 params: ['sys.color.icon_primary'], 1820 'bundleName': '__harDefaultBundleName__', 1821 'moduleName': '__harDefaultModuleName__', 1822 }]); 1823 SymbolGlyph.fontSize(SYMBOL_TITLE_SIZE); 1824 SymbolGlyph.direction(Direction.Ltr); 1825 }, SymbolGlyph); 1826 }); 1827 } else { 1828 this.ifElseBranchUpdateFunction(1, () => { 1829 this.observeComponentCreation2((elmtId, isInitialRender) => { 1830 Image.create(this.itemEditableDialog.value); 1831 Image.width(IMAGE_SIZE); 1832 Image.height(IMAGE_SIZE); 1833 Image.margin({ 1834 top: { 1835 'id': -1, 1836 'type': 10002, 1837 params: ['sys.float.padding_level24'], 1838 'bundleName': '__harDefaultBundleName__', 1839 'moduleName': '__harDefaultModuleName__', 1840 }, 1841 bottom: { 1842 'id': -1, 1843 'type': 10002, 1844 params: ['sys.float.padding_level8'], 1845 'bundleName': '__harDefaultBundleName__', 1846 'moduleName': '__harDefaultModuleName__', 1847 }, 1848 }); 1849 Image.fillColor({ 1850 'id': -1, 1851 'type': 10001, 1852 params: ['sys.color.icon_primary'], 1853 'bundleName': '__harDefaultBundleName__', 1854 'moduleName': '__harDefaultModuleName__', 1855 }); 1856 Image.direction(Direction.Ltr); 1857 }, Image); 1858 }); 1859 } 1860 }, If); 1861 If.pop(); 1862 }); 1863 } 1864 }, If); 1865 If.pop(); 1866 this.observeComponentCreation2((elmtId, isInitialRender) => { 1867 Column.create(); 1868 Column.width('100%'); 1869 Column.padding({ 1870 left: { 1871 'id': -1, 1872 'type': 10002, 1873 params: ['sys.float.padding_level4'], 1874 'bundleName': '__harDefaultBundleName__', 1875 'moduleName': '__harDefaultModuleName__', 1876 }, 1877 right: { 1878 'id': -1, 1879 'type': 10002, 1880 params: ['sys.float.padding_level4'], 1881 'bundleName': '__harDefaultBundleName__', 1882 'moduleName': '__harDefaultModuleName__', 1883 }, 1884 bottom: { 1885 'id': -1, 1886 'type': 10002, 1887 params: ['sys.float.padding_level12'], 1888 'bundleName': '__harDefaultBundleName__', 1889 'moduleName': '__harDefaultModuleName__', 1890 }, 1891 }); 1892 }, Column); 1893 this.observeComponentCreation2((elmtId, isInitialRender) => { 1894 Text.create(this.textEditableTitleBarDialog); 1895 Text.fontSize(TEXT_EDITABLE_DIALOG); 1896 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 1897 Text.maxLines(this.maxLines); 1898 Text.width('100%'); 1899 Text.textAlign(TextAlign.Center); 1900 Text.fontColor({ 1901 'id': -1, 1902 'type': 10001, 1903 params: ['sys.color.font_primary'], 1904 'bundleName': '__harDefaultBundleName__', 1905 'moduleName': '__harDefaultModuleName__', 1906 }); 1907 }, Text); 1908 Text.pop(); 1909 Column.pop(); 1910 Column.pop(); 1911 }); 1912 } else { 1913 this.ifElseBranchUpdateFunction(1, () => { 1914 this.observeComponentCreation2((elmtId, isInitialRender) => { 1915 Column.create(); 1916 Column.width(this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG); 1917 Column.constraintSize({ 1918 minHeight: this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG 1919 }); 1920 Column.backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK, undefined, 1921 { disableSystemAdaptation: true }); 1922 Column.shadow(ShadowStyle.OUTER_DEFAULT_LG); 1923 Column.borderRadius(({ 1924 'id': -1, 1925 'type': 10002, 1926 params: ['sys.float.corner_radius_level10'], 1927 'bundleName': '__harDefaultBundleName__', 1928 'moduleName': '__harDefaultModuleName__', 1929 })); 1930 Column.justifyContent(FlexAlign.Center); 1931 Column.direction(Direction.Ltr); 1932 }, Column); 1933 this.observeComponentCreation2((elmtId, isInitialRender) => { 1934 If.create(); 1935 if (this.itemEditableDialog.symbolStyle !== undefined) { 1936 this.ifElseBranchUpdateFunction(0, () => { 1937 this.observeComponentCreation2((elmtId, isInitialRender) => { 1938 SymbolGlyph.create(); 1939 SymbolGlyph.fontColor([{ 1940 'id': -1, 1941 'type': 10001, 1942 params: ['sys.color.icon_primary'], 1943 'bundleName': '__harDefaultBundleName__', 1944 'moduleName': '__harDefaultModuleName__', 1945 }]); 1946 SymbolGlyph.attributeModifier.bind(this)(this.itemEditableDialog.symbolStyle); 1947 SymbolGlyph.effectStrategy(SymbolEffectStrategy.NONE); 1948 SymbolGlyph.symbolEffect(new SymbolEffect(), false); 1949 SymbolGlyph.fontSize(SYMBOL_TITLE_SIZE); 1950 }, SymbolGlyph); 1951 }); 1952 } else { 1953 this.ifElseBranchUpdateFunction(1, () => { 1954 this.observeComponentCreation2((elmtId, isInitialRender) => { 1955 If.create(); 1956 if (Util.isSymbolResource(this.itemEditableDialog.value)) { 1957 this.ifElseBranchUpdateFunction(0, () => { 1958 this.observeComponentCreation2((elmtId, isInitialRender) => { 1959 SymbolGlyph.create(this.itemEditableDialog.value); 1960 SymbolGlyph.fontColor([{ 1961 'id': -1, 1962 'type': 10001, 1963 params: ['sys.color.icon_primary'], 1964 'bundleName': '__harDefaultBundleName__', 1965 'moduleName': '__harDefaultModuleName__', 1966 }]); 1967 SymbolGlyph.fontSize(SYMBOL_TITLE_SIZE); 1968 }, SymbolGlyph); 1969 }); 1970 } else { 1971 this.ifElseBranchUpdateFunction(1, () => { 1972 this.observeComponentCreation2((elmtId, isInitialRender) => { 1973 Image.create(this.itemEditableDialog.value); 1974 Image.width(IMAGE_SIZE); 1975 Image.height(IMAGE_SIZE); 1976 Image.fillColor({ 1977 'id': -1, 1978 'type': 10001, 1979 params: ['sys.color.icon_primary'], 1980 'bundleName': '__harDefaultBundleName__', 1981 'moduleName': '__harDefaultModuleName__', 1982 }); 1983 }, Image); 1984 }); 1985 } 1986 }, If); 1987 If.pop(); 1988 }); 1989 } 1990 }, If); 1991 If.pop(); 1992 Column.pop(); 1993 }); 1994 } 1995 }, If); 1996 If.pop(); 1997 } 1998 1999 async aboutToAppear() { 2000 try { 2001 let context = this.getUIContext().getHostContext(); 2002 this.mainWindowStage = context.windowStage.getMainWindowSync(); 2003 let properties = this.mainWindowStage.getWindowProperties(); 2004 let rect = properties.windowRect; 2005 if (px2vp(rect.height) > this.screenWidth) { 2006 this.maxLines = this.verticalScreenLines; 2007 } else { 2008 this.maxLines = this.horizontalsScreenLines; 2009 } 2010 } catch (error) { 2011 let code = error?.code; 2012 let message = error?.message; 2013 hilog.error(0x3900, 'Ace', `EditableTitleBar getMainWindowStage error, code: ${code},message:${message}`); 2014 } 2015 } 2016 2017 rerender() { 2018 this.updateDirtyElements(); 2019 } 2020} 2021 2022/** 2023 * get resource size 2024 * 2025 * @param resourceId resource id 2026 * @return resource size 2027 */ 2028function getNumberByResource(resourceId, defaultNumber) { 2029 try { 2030 let resourceNumber = resourceManager.getSystemResourceManager().getNumber(resourceId); 2031 if (resourceNumber === 0) { 2032 return defaultNumber; 2033 } else { 2034 return resourceNumber; 2035 } 2036 } catch (error) { 2037 let code = error.code; 2038 let message = error.message; 2039 hilog.error(0x3900, 'Ace', `EditableTitleBar getNumberByResource error, code: ${code},message:${message}`); 2040 return 0; 2041 } 2042} 2043 2044class Util { 2045 static isSymbolResource(resourceStr) { 2046 if (!Util.isResourceType(resourceStr)) { 2047 return false; 2048 } 2049 let resource = resourceStr; 2050 return resource.type === Util.RESOURCE_TYPE_SYMBOL; 2051 } 2052 2053 static isResourceType(resource) { 2054 if (!resource) { 2055 return false; 2056 } 2057 if (typeof resource === 'string' || typeof resource === 'undefined') { 2058 return false; 2059 } 2060 return true; 2061 } 2062} 2063 2064Util.RESOURCE_TYPE_SYMBOL = 40000; 2065 2066export default { 2067 EditableLeftIconType: EditableLeftIconType, 2068 EditableTitleBar: EditableTitleBar, 2069}; 2070//# sourceMappingURL=MainPage.js.map