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 */ 15if (!('finalizeConstruction' in ViewPU.prototype)) { 16 Reflect.set(ViewPU.prototype, 'finalizeConstruction', () => {}); 17} 18 19const LengthMetrics = requireNapi('arkui.node').LengthMetrics; 20const accessibility = requireNapi('accessibility'); 21const intl = requireNapi('intl'); 22const i18n = requireNapi('i18n'); 23const systemDateTime = requireNapi('systemDateTime'); 24export var CounterType; 25(function (CounterType) { 26 CounterType[(CounterType['LIST'] = 0)] = 'LIST'; 27 CounterType[(CounterType['COMPACT'] = 1)] = 'COMPACT'; 28 CounterType[(CounterType['INLINE'] = 2)] = 'INLINE'; 29 CounterType[(CounterType['INLINE_DATE'] = 3)] = 'INLINE_DATE'; 30})(CounterType || (CounterType = {})); 31var FocusText; 32(function (FocusText) { 33 FocusText[(FocusText['NONE'] = 0)] = 'NONE'; 34 FocusText[(FocusText['TEXT1'] = 1)] = 'TEXT1'; 35 FocusText[(FocusText['TEXT2'] = 2)] = 'TEXT2'; 36 FocusText[(FocusText['TEXT3'] = 3)] = 'TEXT3'; 37})(FocusText || (FocusText = {})); 38export class CommonOptions {} 39export class InlineStyleOptions extends CommonOptions {} 40export class NumberStyleOptions extends InlineStyleOptions {} 41export class DateData { 42 constructor(year, month, day) { 43 this.year = year; 44 this.month = month; 45 this.day = day; 46 } 47 toString() { 48 let date = this.year.toString() + '-'; 49 let month = this.month < 10 ? '0' + this.month.toString() : this.month.toString(); 50 date += month + '-'; 51 let day = this.day < 10 ? '0' + this.day.toString() : this.day.toString(); 52 date += day; 53 return date; 54 } 55} 56export class DateStyleOptions extends CommonOptions {} 57export class CounterOptions { 58 constructor() { 59 this.type = CounterType.LIST; 60 } 61} 62class CounterResource {} 63// counter color 64CounterResource.BUTTON_BACKGROUD_COLOR = { 65 id: -1, 66 type: 10001, 67 params: ['sys.color.ohos_id_color_button_normal'], 68 bundleName: '__harDefaultBundleName__', 69 moduleName: '__harDefaultModuleName__', 70}; 71CounterResource.BUTTON_ICON_COLOR = { 72 id: -1, 73 type: 10001, 74 params: ['sys.color.ohos_id_color_primary'], 75 bundleName: '__harDefaultBundleName__', 76 moduleName: '__harDefaultModuleName__', 77}; 78CounterResource.BUTTON_BORDER_FOCUSED_COLOR = { 79 id: -1, 80 type: 10001, 81 params: ['sys.color.ohos_id_color_focused_outline'], 82 bundleName: '__harDefaultBundleName__', 83 moduleName: '__harDefaultModuleName__', 84}; 85CounterResource.COUNTER_TEXT_COLOR = { 86 id: -1, 87 type: 10001, 88 params: ['sys.color.ohos_id_color_text_primary'], 89 bundleName: '__harDefaultBundleName__', 90 moduleName: '__harDefaultModuleName__', 91}; 92CounterResource.COUNTER_BORDER_COLOR = { 93 id: -1, 94 type: 10001, 95 params: ['sys.color.ohos_id_color_component_normal'], 96 bundleName: '__harDefaultBundleName__', 97 moduleName: '__harDefaultModuleName__', 98}; 99// button icon 100CounterResource.BUTTON_ADD_ICON = { 101 id: -1, 102 type: 20000, 103 params: ['sys.media.ohos_ic_public_add'], 104 bundleName: '__harDefaultBundleName__', 105 moduleName: '__harDefaultModuleName__', 106}; 107CounterResource.BUTTON_SUB_ICON = { 108 id: -1, 109 type: 20000, 110 params: ['sys.media.ohos_ic_public_minus'], 111 bundleName: '__harDefaultBundleName__', 112 moduleName: '__harDefaultModuleName__', 113}; 114CounterResource.BUTTON_ARROW_UP = { 115 id: -1, 116 type: 20000, 117 params: ['sys.media.ohos_ic_public_arrow_up'], 118 bundleName: '__harDefaultBundleName__', 119 moduleName: '__harDefaultModuleName__', 120}; 121CounterResource.BUTTON_ARROW_DOWN = { 122 id: -1, 123 type: 20000, 124 params: ['sys.media.ohos_ic_public_arrow_down'], 125 bundleName: '__harDefaultBundleName__', 126 moduleName: '__harDefaultModuleName__', 127}; 128// counter size 129CounterResource.BUTTON_BORDER_FOCUSED_WIDTH = '2vp'; 130CounterResource.BUTTON_BORDER_BLUR_WIDTH = '0vp'; 131CounterResource.COUNTER_BORDER_WIDTH_NUMBER = 1; 132CounterResource.COUNTER_LIST_LABEL_SIZE = { 133 id: -1, 134 type: 10002, 135 params: ['sys.float.ohos_id_text_size_body1'], 136 bundleName: '__harDefaultBundleName__', 137 moduleName: '__harDefaultModuleName__', 138}; 139CounterResource.COUNTER_LIST_NUMBER_SIZE = { 140 id: -1, 141 type: 10002, 142 params: ['sys.float.ohos_id_text_size_body1'], 143 bundleName: '__harDefaultBundleName__', 144 moduleName: '__harDefaultModuleName__', 145}; 146CounterResource.COUNTER_COMPACT_LABEL_SIZE = { 147 id: -1, 148 type: 10002, 149 params: ['sys.float.ohos_id_text_size_body2'], 150 bundleName: '__harDefaultBundleName__', 151 moduleName: '__harDefaultModuleName__', 152}; 153CounterResource.COUNTER_NUMBER_SIZE = { 154 id: -1, 155 type: 10002, 156 params: ['sys.float.ohos_id_text_size_body1'], 157 bundleName: '__harDefaultBundleName__', 158 moduleName: '__harDefaultModuleName__', 159}; 160CounterResource.COUNTER_LIST_LEFT_PADDING = { 161 id: -1, 162 type: 10002, 163 params: ['sys.float.ohos_id_default_padding_start'], 164 bundleName: '__harDefaultBundleName__', 165 moduleName: '__harDefaultModuleName__', 166}; 167CounterResource.COUNTER_LIST_RIGHT_PADDING = { 168 id: -1, 169 type: 10002, 170 params: ['sys.float.ohos_id_default_padding_end'], 171 bundleName: '__harDefaultBundleName__', 172 moduleName: '__harDefaultModuleName__', 173}; 174CounterResource.COUNTER_COMPACT_BUTTON_ICON_SIZE = { 175 id: -1, 176 type: 10002, 177 params: ['sys.float.button_icon_size'], 178 bundleName: '__harDefaultBundleName__', 179 moduleName: '__harDefaultModuleName__', 180}; 181CounterResource.COUNTER_COMPACT_CONTAINER_HEIGHT = { 182 id: -1, 183 type: 10002, 184 params: ['sys.float.container_height'], 185 bundleName: '__harDefaultBundleName__', 186 moduleName: '__harDefaultModuleName__', 187}; 188CounterResource.COUNTER_BORDER_WIDTH = { 189 id: -1, 190 type: 10002, 191 params: ['sys.float.border_width'], 192 bundleName: '__harDefaultBundleName__', 193 moduleName: '__harDefaultModuleName__', 194}; 195CounterResource.COUNTER_COMPACT_BUTTON_SIZE = { 196 id: -1, 197 type: 10002, 198 params: ['sys.float.button_size'], 199 bundleName: '__harDefaultBundleName__', 200 moduleName: '__harDefaultModuleName__', 201}; 202CounterResource.COUNTER_COMPACT_CONTAINER_RADIUS = { 203 id: -1, 204 type: 10002, 205 params: ['sys.float.container_radius'], 206 bundleName: '__harDefaultBundleName__', 207 moduleName: '__harDefaultModuleName__', 208}; 209CounterResource.COUNTER_COMPACT_BUTTON_CONTAINER_MARGIN = { 210 id: -1, 211 type: 10002, 212 params: ['sys.float.button_container_margin'], 213 bundleName: '__harDefaultBundleName__', 214 moduleName: '__harDefaultModuleName__', 215}; 216CounterResource.COUNTER_LIST_PADDING = 12; 217CounterResource.COUNTER_LIST_HEIGHT = '48vp'; 218CounterResource.COUNTER_LIST_BUTTON_ICON_SIZE = '20vp'; 219CounterResource.COUNTER_LIST_BUTTON_SIZE = '32vp'; 220CounterResource.COUNTER_LIST_BUTTON_RADIUS = '16vp'; 221CounterResource.COUNTER_LIST_BUTTON_TEXT_DISTANCE = '8vp'; 222CounterResource.COUNTER_LIST_BUTTON_TEXT_MARGIN = 8; 223CounterResource.COUNTER_LIST_FOCUS_BORDER_SIZE = '30vp'; 224CounterResource.COUNTER_LIST_FOCUS_BORDER_RADIUS = '15vp'; 225CounterResource.COUNTER_LIST_BUTTON_HOT_SPOT_X = '-8vp'; 226CounterResource.COUNTER_LIST_BUTTON_HOT_SPOT_Y = '-8vp'; 227CounterResource.COUNTER_COMPACT_BUTTON_RADIUS = '12vp'; 228CounterResource.COUNTER_COMPACT_BUTTON_TEXT_DISTANCE = '10vp'; 229CounterResource.COUNTER_COMPACT_BUTTON_TEXT_MARGIN = 10; 230CounterResource.COUNTER_COMPACT_CONTAINER_LABEL_DISTANCE = '8vp'; 231CounterResource.COUNTER_COMPACT_FOCUS_BORDER_SIZE = '22vp'; 232CounterResource.COUNTER_COMPACT_FOCUS_BORDER_RADIUS = '11vp'; 233CounterResource.COUNTER_INLINE_BUTTON_ICON_WIDTH = '24vp'; 234CounterResource.COUNTER_INLINE_BUTTON_ICON_HEIGHT = '12vp'; 235CounterResource.COUNTER_INLINE_BUTTON_TEXT_DISTANCE = '12vp'; 236CounterResource.COUNTER_INLINE_CONTAINER_HEIGHT = '32vp'; 237CounterResource.COUNTER_INLINE_BUTTON_WIDTH = '32vp'; 238CounterResource.COUNTER_INLINE_BUTTON_HEIGHT = '16vp'; 239CounterResource.COUNTER_INLINE_RADIUS = '8vp'; 240CounterResource.COUNTER_INLINE_FOCUS_BORDER_WIDTH = '28vp'; 241CounterResource.COUNTER_INLINE_FOCUS_BORDER_HEIGHT = '13.5vp'; 242CounterResource.COUNTER_INLINE_DATE_TEXT_MARGIN = 12; 243CounterResource.COUNTER_INLINE_INPUT_TEXT_MARGIN = 12; 244CounterResource.COUNTER_BUTTON_INITIAL_OPACITY = 1; 245CounterResource.COUNTER_BUTTON_DISABLE_OPACITY = 0.4; 246CounterResource.COUNTER_LABEL_MAX_FONT_SIZE_SCALE = 2; 247CounterResource.COUNTER_NUMBER_MAX_FONT_SIZE_SCALE = 1; 248class CounterConstant {} 249CounterConstant.COUNTER_MAX_YEAR = 5000; 250CounterConstant.COUNTER_MIN_YEAR = 1; 251CounterConstant.COUNTER_INITIAL_MONTH = 1; 252CounterConstant.COUNTER_INITIAL_DAY = 1; 253CounterConstant.COUNTER_INITIAL_STEP = 1; 254CounterConstant.COUNTER_TEN_NUMBER = 10; 255CounterConstant.COUNTER_MIN_MONTH = 1; 256CounterConstant.COUNTER_MAX_MONTH = 12; 257CounterConstant.COUNTER_MIN_DAY = 1; 258CounterConstant.KEYCODE_DPAD_UP = 2012; 259CounterConstant.KEYCODE_DPAD_DOWN = 2013; 260CounterConstant.KEYCODE_DPAD_LEFT = 2014; 261CounterConstant.KEYCODE_DPAD_RIGHT = 2015; 262CounterConstant.KEYCODE_MOVE_HOME = 2081; 263CounterConstant.KEYCODE_MOVE_END = 2082; 264CounterConstant.KEYCODE_TAB = 2049; 265CounterConstant.KEYCODE_ESC = 2070; 266CounterConstant.COUNTER_MIN_VALUE = 0; 267CounterConstant.COUNTER_MAX_VALUE = 999; 268CounterConstant.JANUARY = 1; 269CounterConstant.FEBRUARY = 2; 270CounterConstant.MARCH = 3; 271CounterConstant.APRIL = 4; 272CounterConstant.MAY = 5; 273CounterConstant.JUNE = 6; 274CounterConstant.JULY = 7; 275CounterConstant.AUGUST = 8; 276CounterConstant.SEPTEMBER = 9; 277CounterConstant.OCTOBER = 10; 278CounterConstant.NOVEMBER = 11; 279CounterConstant.DECEMBER = 12; 280CounterConstant.BIG_MONTH_DAYS = 31; 281CounterConstant.SMALL_MONTH_DAYS = 30; 282CounterConstant.FEBRUARY_DAYS = 28; 283CounterConstant.AUSPICIOUS_FEBRUARY_DAYS = 29; 284CounterConstant.AUSPICIOUS_FOUR = 4; 285CounterConstant.AUSPICIOUS_HUNDRED = 100; 286CounterConstant.AUSPICIOUS_FOUR_HUNDRED = 400; 287export class CounterComponent extends ViewPU { 288 constructor(parent, params, __localStorage, elmtId = -1, paramsLambda = undefined, extraInfo) { 289 super(parent, __localStorage, elmtId, extraInfo); 290 if (typeof paramsLambda === 'function') { 291 this.paramsGenerator_ = paramsLambda; 292 } 293 this.__options = new SynchedPropertyObjectOneWayPU(params.options, this, 'options'); 294 this.__type = new ObservedPropertySimplePU(-1, this, 'type'); 295 this.__counterDirection = new ObservedPropertySimplePU(Direction.Auto, this, 'counterDirection'); 296 this.__choverEffect = new ObservedPropertySimplePU(HoverEffect.Auto, this, 'choverEffect'); 297 this.__focusEnable = new ObservedPropertySimplePU(true, this, 'focusEnable'); 298 this.__step = new ObservedPropertySimplePU(CounterConstant.COUNTER_INITIAL_STEP, this, 'step'); 299 this.__inputValue = new ObservedPropertySimplePU('0', this, 'inputValue'); 300 this.__inputYear = new ObservedPropertySimplePU(CounterConstant.COUNTER_MIN_YEAR, this, 'inputYear'); 301 this.__inputMoon = new ObservedPropertySimplePU(0, this, 'inputMoon'); 302 this.__inputDay = new ObservedPropertySimplePU(0, this, 'inputDay'); 303 this.__inputHour = new ObservedPropertySimplePU(0, this, 'inputHour'); 304 this.__inputMinute = new ObservedPropertySimplePU(0, this, 'inputMinute'); 305 this.__inputSecond = new ObservedPropertySimplePU(0, this, 'inputSecond'); 306 this.__subOpacity = new ObservedPropertySimplePU( 307 CounterResource.COUNTER_BUTTON_INITIAL_OPACITY, 308 this, 309 'subOpacity' 310 ); 311 this.__addOpacity = new ObservedPropertySimplePU( 312 CounterResource.COUNTER_BUTTON_INITIAL_OPACITY, 313 this, 314 'addOpacity' 315 ); 316 this.__subBtnStateEffect = new ObservedPropertySimplePU(true, this, 'subBtnStateEffect'); 317 this.__addBtnStateEffect = new ObservedPropertySimplePU(true, this, 'addBtnStateEffect'); 318 this.__focusText = new ObservedPropertySimplePU(FocusText.NONE, this, 'focusText'); 319 this.__hasFocusText1 = new ObservedPropertySimplePU(false, this, 'hasFocusText1'); 320 this.__hasFocusText2 = new ObservedPropertySimplePU(false, this, 'hasFocusText2'); 321 this.__hasFocusText3 = new ObservedPropertySimplePU(false, this, 'hasFocusText3'); 322 this.__subBtnFocusWidh = new ObservedPropertySimplePU('0vp', this, 'subBtnFocusWidh'); 323 this.__addBtnFocusWidh = new ObservedPropertySimplePU('0vp', this, 'addBtnFocusWidh'); 324 this.__value = new ObservedPropertySimplePU(0, this, 'value'); 325 this.__year = new ObservedPropertySimplePU(0, this, 'year'); 326 this.__month = new ObservedPropertySimplePU(0, this, 'month'); 327 this.__day = new ObservedPropertySimplePU(0, this, 'day'); 328 this.__hour = new ObservedPropertySimplePU(0, this, 'hour'); 329 this.__minute = new ObservedPropertySimplePU(0, this, 'minute'); 330 this.__second = new ObservedPropertySimplePU(0, this, 'second'); 331 this.__subBtnEnabled = new ObservedPropertySimplePU(true, this, 'subBtnEnabled'); 332 this.__addBtnEnabled = new ObservedPropertySimplePU(true, this, 'addBtnEnabled'); 333 this.__hasInputText1 = new ObservedPropertySimplePU(false, this, 'hasInputText1'); 334 this.__hasInputText2 = new ObservedPropertySimplePU(false, this, 'hasInputText2'); 335 this.__hasInputText3 = new ObservedPropertySimplePU(false, this, 'hasInputText3'); 336 this.__textWidth = new ObservedPropertySimplePU(0, this, 'textWidth'); 337 this.__min = new ObservedPropertySimplePU(CounterConstant.COUNTER_MIN_VALUE, this, 'min'); 338 this.__max = new ObservedPropertySimplePU(CounterConstant.COUNTER_MAX_VALUE, this, 'max'); 339 this.maxYear = CounterConstant.COUNTER_MAX_YEAR; 340 this.minYear = CounterConstant.COUNTER_MIN_YEAR; 341 this.numberStrList = ['00', '01', '02', '03', '04', '05', '06', '07', '08', '09']; 342 this.onHoverIncrease = undefined; 343 this.onHoverDecrease = undefined; 344 this.onFocusIncrease = undefined; 345 this.onFocusDecrease = undefined; 346 this.onBlurIncrease = undefined; 347 this.onBlurDecrease = undefined; 348 this.onChange = undefined; 349 this.onDateChange = undefined; 350 this.timeoutID1 = -1; 351 this.timeoutID2 = -1; 352 this.timeoutID3 = -1; 353 this.numberStyleOptions = new NumberStyleOptions(); 354 this.dateStyleOptions = new DateStyleOptions(); 355 this.inlineStyleOptions = new InlineStyleOptions(); 356 this.timeStamp = 0; 357 this.hasTextWidth = false; 358 this.controller1 = new TextInputController(); 359 this.controller2 = new TextInputController(); 360 this.controller3 = new TextInputController(); 361 this.initFlag = true; 362 this.increaseStrCache = undefined; 363 this.reduceStrCache = undefined; 364 this.setInitiallyProvidedValue(params); 365 this.declareWatch('options', this.onOptionsChange); 366 this.finalizeConstruction(); 367 } 368 setInitiallyProvidedValue(params) { 369 if (params.type !== undefined) { 370 this.type = params.type; 371 } 372 if (params.counterDirection !== undefined) { 373 this.counterDirection = params.counterDirection; 374 } 375 if (params.choverEffect !== undefined) { 376 this.choverEffect = params.choverEffect; 377 } 378 if (params.focusEnable !== undefined) { 379 this.focusEnable = params.focusEnable; 380 } 381 if (params.step !== undefined) { 382 this.step = params.step; 383 } 384 if (params.inputValue !== undefined) { 385 this.inputValue = params.inputValue; 386 } 387 if (params.inputYear !== undefined) { 388 this.inputYear = params.inputYear; 389 } 390 if (params.inputMoon !== undefined) { 391 this.inputMoon = params.inputMoon; 392 } 393 if (params.inputDay !== undefined) { 394 this.inputDay = params.inputDay; 395 } 396 if (params.inputHour !== undefined) { 397 this.inputHour = params.inputHour; 398 } 399 if (params.inputMinute !== undefined) { 400 this.inputMinute = params.inputMinute; 401 } 402 if (params.inputSecond !== undefined) { 403 this.inputSecond = params.inputSecond; 404 } 405 if (params.subOpacity !== undefined) { 406 this.subOpacity = params.subOpacity; 407 } 408 if (params.addOpacity !== undefined) { 409 this.addOpacity = params.addOpacity; 410 } 411 if (params.subBtnStateEffect !== undefined) { 412 this.subBtnStateEffect = params.subBtnStateEffect; 413 } 414 if (params.addBtnStateEffect !== undefined) { 415 this.addBtnStateEffect = params.addBtnStateEffect; 416 } 417 if (params.focusText !== undefined) { 418 this.focusText = params.focusText; 419 } 420 if (params.hasFocusText1 !== undefined) { 421 this.hasFocusText1 = params.hasFocusText1; 422 } 423 if (params.hasFocusText2 !== undefined) { 424 this.hasFocusText2 = params.hasFocusText2; 425 } 426 if (params.hasFocusText3 !== undefined) { 427 this.hasFocusText3 = params.hasFocusText3; 428 } 429 if (params.subBtnFocusWidh !== undefined) { 430 this.subBtnFocusWidh = params.subBtnFocusWidh; 431 } 432 if (params.addBtnFocusWidh !== undefined) { 433 this.addBtnFocusWidh = params.addBtnFocusWidh; 434 } 435 if (params.value !== undefined) { 436 this.value = params.value; 437 } 438 if (params.year !== undefined) { 439 this.year = params.year; 440 } 441 if (params.month !== undefined) { 442 this.month = params.month; 443 } 444 if (params.day !== undefined) { 445 this.day = params.day; 446 } 447 if (params.hour !== undefined) { 448 this.hour = params.hour; 449 } 450 if (params.minute !== undefined) { 451 this.minute = params.minute; 452 } 453 if (params.second !== undefined) { 454 this.second = params.second; 455 } 456 if (params.subBtnEnabled !== undefined) { 457 this.subBtnEnabled = params.subBtnEnabled; 458 } 459 if (params.addBtnEnabled !== undefined) { 460 this.addBtnEnabled = params.addBtnEnabled; 461 } 462 if (params.hasInputText1 !== undefined) { 463 this.hasInputText1 = params.hasInputText1; 464 } 465 if (params.hasInputText2 !== undefined) { 466 this.hasInputText2 = params.hasInputText2; 467 } 468 if (params.hasInputText3 !== undefined) { 469 this.hasInputText3 = params.hasInputText3; 470 } 471 if (params.textWidth !== undefined) { 472 this.textWidth = params.textWidth; 473 } 474 if (params.min !== undefined) { 475 this.min = params.min; 476 } 477 if (params.max !== undefined) { 478 this.max = params.max; 479 } 480 if (params.maxYear !== undefined) { 481 this.maxYear = params.maxYear; 482 } 483 if (params.minYear !== undefined) { 484 this.minYear = params.minYear; 485 } 486 if (params.numberStrList !== undefined) { 487 this.numberStrList = params.numberStrList; 488 } 489 if (params.onHoverIncrease !== undefined) { 490 this.onHoverIncrease = params.onHoverIncrease; 491 } 492 if (params.onHoverDecrease !== undefined) { 493 this.onHoverDecrease = params.onHoverDecrease; 494 } 495 if (params.onFocusIncrease !== undefined) { 496 this.onFocusIncrease = params.onFocusIncrease; 497 } 498 if (params.onFocusDecrease !== undefined) { 499 this.onFocusDecrease = params.onFocusDecrease; 500 } 501 if (params.onBlurIncrease !== undefined) { 502 this.onBlurIncrease = params.onBlurIncrease; 503 } 504 if (params.onBlurDecrease !== undefined) { 505 this.onBlurDecrease = params.onBlurDecrease; 506 } 507 if (params.onChange !== undefined) { 508 this.onChange = params.onChange; 509 } 510 if (params.onDateChange !== undefined) { 511 this.onDateChange = params.onDateChange; 512 } 513 if (params.timeoutID1 !== undefined) { 514 this.timeoutID1 = params.timeoutID1; 515 } 516 if (params.timeoutID2 !== undefined) { 517 this.timeoutID2 = params.timeoutID2; 518 } 519 if (params.timeoutID3 !== undefined) { 520 this.timeoutID3 = params.timeoutID3; 521 } 522 if (params.numberStyleOptions !== undefined) { 523 this.numberStyleOptions = params.numberStyleOptions; 524 } 525 if (params.dateStyleOptions !== undefined) { 526 this.dateStyleOptions = params.dateStyleOptions; 527 } 528 if (params.inlineStyleOptions !== undefined) { 529 this.inlineStyleOptions = params.inlineStyleOptions; 530 } 531 if (params.timeStamp !== undefined) { 532 this.timeStamp = params.timeStamp; 533 } 534 if (params.hasTextWidth !== undefined) { 535 this.hasTextWidth = params.hasTextWidth; 536 } 537 if (params.controller1 !== undefined) { 538 this.controller1 = params.controller1; 539 } 540 if (params.controller2 !== undefined) { 541 this.controller2 = params.controller2; 542 } 543 if (params.controller3 !== undefined) { 544 this.controller3 = params.controller3; 545 } 546 if (params.initFlag !== undefined) { 547 this.initFlag = params.initFlag; 548 } 549 if (params.increaseStrCache !== undefined) { 550 this.increaseStrCache = params.increaseStrCache; 551 } 552 if (params.reduceStrCache !== undefined) { 553 this.reduceStrCache = params.reduceStrCache; 554 } 555 } 556 updateStateVars(params) { 557 this.__options.reset(params.options); 558 } 559 purgeVariableDependenciesOnElmtId(rmElmtId) { 560 this.__options.purgeDependencyOnElmtId(rmElmtId); 561 this.__type.purgeDependencyOnElmtId(rmElmtId); 562 this.__counterDirection.purgeDependencyOnElmtId(rmElmtId); 563 this.__choverEffect.purgeDependencyOnElmtId(rmElmtId); 564 this.__focusEnable.purgeDependencyOnElmtId(rmElmtId); 565 this.__step.purgeDependencyOnElmtId(rmElmtId); 566 this.__inputValue.purgeDependencyOnElmtId(rmElmtId); 567 this.__inputYear.purgeDependencyOnElmtId(rmElmtId); 568 this.__inputMoon.purgeDependencyOnElmtId(rmElmtId); 569 this.__inputDay.purgeDependencyOnElmtId(rmElmtId); 570 this.__inputHour.purgeDependencyOnElmtId(rmElmtId); 571 this.__inputMinute.purgeDependencyOnElmtId(rmElmtId); 572 this.__inputSecond.purgeDependencyOnElmtId(rmElmtId); 573 this.__subOpacity.purgeDependencyOnElmtId(rmElmtId); 574 this.__addOpacity.purgeDependencyOnElmtId(rmElmtId); 575 this.__subBtnStateEffect.purgeDependencyOnElmtId(rmElmtId); 576 this.__addBtnStateEffect.purgeDependencyOnElmtId(rmElmtId); 577 this.__focusText.purgeDependencyOnElmtId(rmElmtId); 578 this.__hasFocusText1.purgeDependencyOnElmtId(rmElmtId); 579 this.__hasFocusText2.purgeDependencyOnElmtId(rmElmtId); 580 this.__hasFocusText3.purgeDependencyOnElmtId(rmElmtId); 581 this.__subBtnFocusWidh.purgeDependencyOnElmtId(rmElmtId); 582 this.__addBtnFocusWidh.purgeDependencyOnElmtId(rmElmtId); 583 this.__value.purgeDependencyOnElmtId(rmElmtId); 584 this.__year.purgeDependencyOnElmtId(rmElmtId); 585 this.__month.purgeDependencyOnElmtId(rmElmtId); 586 this.__day.purgeDependencyOnElmtId(rmElmtId); 587 this.__hour.purgeDependencyOnElmtId(rmElmtId); 588 this.__minute.purgeDependencyOnElmtId(rmElmtId); 589 this.__second.purgeDependencyOnElmtId(rmElmtId); 590 this.__subBtnEnabled.purgeDependencyOnElmtId(rmElmtId); 591 this.__addBtnEnabled.purgeDependencyOnElmtId(rmElmtId); 592 this.__hasInputText1.purgeDependencyOnElmtId(rmElmtId); 593 this.__hasInputText2.purgeDependencyOnElmtId(rmElmtId); 594 this.__hasInputText3.purgeDependencyOnElmtId(rmElmtId); 595 this.__textWidth.purgeDependencyOnElmtId(rmElmtId); 596 this.__min.purgeDependencyOnElmtId(rmElmtId); 597 this.__max.purgeDependencyOnElmtId(rmElmtId); 598 } 599 aboutToBeDeleted() { 600 this.__options.aboutToBeDeleted(); 601 this.__type.aboutToBeDeleted(); 602 this.__counterDirection.aboutToBeDeleted(); 603 this.__choverEffect.aboutToBeDeleted(); 604 this.__focusEnable.aboutToBeDeleted(); 605 this.__step.aboutToBeDeleted(); 606 this.__inputValue.aboutToBeDeleted(); 607 this.__inputYear.aboutToBeDeleted(); 608 this.__inputMoon.aboutToBeDeleted(); 609 this.__inputDay.aboutToBeDeleted(); 610 this.__inputHour.aboutToBeDeleted(); 611 this.__inputMinute.aboutToBeDeleted(); 612 this.__inputSecond.aboutToBeDeleted(); 613 this.__subOpacity.aboutToBeDeleted(); 614 this.__addOpacity.aboutToBeDeleted(); 615 this.__subBtnStateEffect.aboutToBeDeleted(); 616 this.__addBtnStateEffect.aboutToBeDeleted(); 617 this.__focusText.aboutToBeDeleted(); 618 this.__hasFocusText1.aboutToBeDeleted(); 619 this.__hasFocusText2.aboutToBeDeleted(); 620 this.__hasFocusText3.aboutToBeDeleted(); 621 this.__subBtnFocusWidh.aboutToBeDeleted(); 622 this.__addBtnFocusWidh.aboutToBeDeleted(); 623 this.__value.aboutToBeDeleted(); 624 this.__year.aboutToBeDeleted(); 625 this.__month.aboutToBeDeleted(); 626 this.__day.aboutToBeDeleted(); 627 this.__hour.aboutToBeDeleted(); 628 this.__minute.aboutToBeDeleted(); 629 this.__second.aboutToBeDeleted(); 630 this.__subBtnEnabled.aboutToBeDeleted(); 631 this.__addBtnEnabled.aboutToBeDeleted(); 632 this.__hasInputText1.aboutToBeDeleted(); 633 this.__hasInputText2.aboutToBeDeleted(); 634 this.__hasInputText3.aboutToBeDeleted(); 635 this.__textWidth.aboutToBeDeleted(); 636 this.__min.aboutToBeDeleted(); 637 this.__max.aboutToBeDeleted(); 638 SubscriberManager.Get().delete(this.id__()); 639 this.aboutToBeDeletedInternal(); 640 } 641 get options() { 642 return this.__options.get(); 643 } 644 set options(newValue) { 645 this.__options.set(newValue); 646 } 647 get type() { 648 return this.__type.get(); 649 } 650 set type(newValue) { 651 this.__type.set(newValue); 652 } 653 get counterDirection() { 654 return this.__counterDirection.get(); 655 } 656 set counterDirection(newValue) { 657 this.__counterDirection.set(newValue); 658 } 659 get choverEffect() { 660 return this.__choverEffect.get(); 661 } 662 set choverEffect(newValue) { 663 this.__choverEffect.set(newValue); 664 } 665 get focusEnable() { 666 return this.__focusEnable.get(); 667 } 668 set focusEnable(newValue) { 669 this.__focusEnable.set(newValue); 670 } 671 get step() { 672 return this.__step.get(); 673 } 674 set step(newValue) { 675 this.__step.set(newValue); 676 } 677 get inputValue() { 678 return this.__inputValue.get(); 679 } 680 set inputValue(newValue) { 681 this.__inputValue.set(newValue); 682 } 683 get inputYear() { 684 return this.__inputYear.get(); 685 } 686 set inputYear(newValue) { 687 this.__inputYear.set(newValue); 688 } 689 get inputMoon() { 690 return this.__inputMoon.get(); 691 } 692 set inputMoon(newValue) { 693 this.__inputMoon.set(newValue); 694 } 695 get inputDay() { 696 return this.__inputDay.get(); 697 } 698 set inputDay(newValue) { 699 this.__inputDay.set(newValue); 700 } 701 get inputHour() { 702 return this.__inputHour.get(); 703 } 704 set inputHour(newValue) { 705 this.__inputHour.set(newValue); 706 } 707 get inputMinute() { 708 return this.__inputMinute.get(); 709 } 710 set inputMinute(newValue) { 711 this.__inputMinute.set(newValue); 712 } 713 get inputSecond() { 714 return this.__inputSecond.get(); 715 } 716 set inputSecond(newValue) { 717 this.__inputSecond.set(newValue); 718 } 719 get subOpacity() { 720 return this.__subOpacity.get(); 721 } 722 set subOpacity(newValue) { 723 this.__subOpacity.set(newValue); 724 } 725 get addOpacity() { 726 return this.__addOpacity.get(); 727 } 728 set addOpacity(newValue) { 729 this.__addOpacity.set(newValue); 730 } 731 get subBtnStateEffect() { 732 return this.__subBtnStateEffect.get(); 733 } 734 set subBtnStateEffect(newValue) { 735 this.__subBtnStateEffect.set(newValue); 736 } 737 get addBtnStateEffect() { 738 return this.__addBtnStateEffect.get(); 739 } 740 set addBtnStateEffect(newValue) { 741 this.__addBtnStateEffect.set(newValue); 742 } 743 get focusText() { 744 return this.__focusText.get(); 745 } 746 set focusText(newValue) { 747 this.__focusText.set(newValue); 748 } 749 get hasFocusText1() { 750 return this.__hasFocusText1.get(); 751 } 752 set hasFocusText1(newValue) { 753 this.__hasFocusText1.set(newValue); 754 } 755 get hasFocusText2() { 756 return this.__hasFocusText2.get(); 757 } 758 set hasFocusText2(newValue) { 759 this.__hasFocusText2.set(newValue); 760 } 761 get hasFocusText3() { 762 return this.__hasFocusText3.get(); 763 } 764 set hasFocusText3(newValue) { 765 this.__hasFocusText3.set(newValue); 766 } 767 get subBtnFocusWidh() { 768 return this.__subBtnFocusWidh.get(); 769 } 770 set subBtnFocusWidh(newValue) { 771 this.__subBtnFocusWidh.set(newValue); 772 } 773 get addBtnFocusWidh() { 774 return this.__addBtnFocusWidh.get(); 775 } 776 set addBtnFocusWidh(newValue) { 777 this.__addBtnFocusWidh.set(newValue); 778 } 779 get value() { 780 return this.__value.get(); 781 } 782 set value(newValue) { 783 this.__value.set(newValue); 784 } 785 get year() { 786 return this.__year.get(); 787 } 788 set year(newValue) { 789 this.__year.set(newValue); 790 } 791 get month() { 792 return this.__month.get(); 793 } 794 set month(newValue) { 795 this.__month.set(newValue); 796 } 797 get day() { 798 return this.__day.get(); 799 } 800 set day(newValue) { 801 this.__day.set(newValue); 802 } 803 get hour() { 804 return this.__hour.get(); 805 } 806 set hour(newValue) { 807 this.__hour.set(newValue); 808 } 809 get minute() { 810 return this.__minute.get(); 811 } 812 set minute(newValue) { 813 this.__minute.set(newValue); 814 } 815 get second() { 816 return this.__second.get(); 817 } 818 set second(newValue) { 819 this.__second.set(newValue); 820 } 821 get subBtnEnabled() { 822 return this.__subBtnEnabled.get(); 823 } 824 set subBtnEnabled(newValue) { 825 this.__subBtnEnabled.set(newValue); 826 } 827 get addBtnEnabled() { 828 return this.__addBtnEnabled.get(); 829 } 830 set addBtnEnabled(newValue) { 831 this.__addBtnEnabled.set(newValue); 832 } 833 get hasInputText1() { 834 return this.__hasInputText1.get(); 835 } 836 set hasInputText1(newValue) { 837 this.__hasInputText1.set(newValue); 838 } 839 get hasInputText2() { 840 return this.__hasInputText2.get(); 841 } 842 set hasInputText2(newValue) { 843 this.__hasInputText2.set(newValue); 844 } 845 get hasInputText3() { 846 return this.__hasInputText3.get(); 847 } 848 set hasInputText3(newValue) { 849 this.__hasInputText3.set(newValue); 850 } 851 get textWidth() { 852 return this.__textWidth.get(); 853 } 854 set textWidth(newValue) { 855 this.__textWidth.set(newValue); 856 } 857 get min() { 858 return this.__min.get(); 859 } 860 set min(newValue) { 861 this.__min.set(newValue); 862 } 863 get max() { 864 return this.__max.get(); 865 } 866 set max(newValue) { 867 this.__max.set(newValue); 868 } 869 getTextInputFontSize() { 870 let fontSize = this.resourceToVp(CounterResource.COUNTER_NUMBER_SIZE); 871 let uiContext = this.getUIContext(); 872 let fontSizeScale = uiContext.getHostContext()?.config?.fontSizeScale ?? 1; 873 if (fontSizeScale < 1) { 874 return fontSize + 'fp'; 875 } else { 876 return fontSize + 'vp'; 877 } 878 } 879 getDate(value) { 880 return `[n2] ${value} [n0]`; 881 } 882 getDateYear(value) { 883 let locale = new intl.Locale(); 884 let localeID = locale.toString(); 885 let date = new Date(this.year, this.month - 1, this.day); 886 date.setFullYear(this.year); 887 let dateFormatYear; 888 try { 889 dateFormatYear = new Intl.DateTimeFormat(localeID, { 890 year: 'numeric', 891 timeZone: systemDateTime.getTimezoneSync(), 892 }); 893 } catch (error) { 894 console.log(`Accessility getDateYear fail. message: ${error.message}, code: ${error.code}`); 895 } 896 if (!dateFormatYear) { 897 dateFormatYear = new Intl.DateTimeFormat(localeID, { year: 'numeric' }); 898 } 899 let formattedDateYear = dateFormatYear.format(date); 900 return this.getDate(formattedDateYear); 901 } 902 getDateMonth(value) { 903 let locale = new intl.Locale(); 904 let localeID = locale.toString(); 905 let date = new Date(this.year, this.month - 1, this.day); 906 date.setFullYear(this.year); 907 let dateFormatMonth; 908 try { 909 dateFormatMonth = new Intl.DateTimeFormat(localeID, { 910 month: 'long', 911 timeZone: systemDateTime.getTimezoneSync(), 912 }); 913 } catch (error) { 914 console.log(`Accessility getDateMonth fail. message: ${error.message}, code: ${error.code}`); 915 } 916 if (!dateFormatMonth) { 917 dateFormatMonth = new Intl.DateTimeFormat(localeID, { month: 'long' }); 918 } 919 let formattedDateMonth = dateFormatMonth.format(date); 920 return this.getDate(formattedDateMonth); 921 } 922 getDateDay(value) { 923 try { 924 let dateDayMap = new Map([ 925 [1, getContext().resourceManager.getStringByNameSync('First_counter_accessibility_text')], 926 [2, getContext().resourceManager.getStringByNameSync('Second_counter_accessibility_text')], 927 [3, getContext().resourceManager.getStringByNameSync('Third_counter_accessibility_text')], 928 [4, getContext().resourceManager.getStringByNameSync('Fourth_counter_accessibility_text')], 929 [5, getContext().resourceManager.getStringByNameSync('Fifth_counter_accessibility_text')], 930 [6, getContext().resourceManager.getStringByNameSync('Sixth_counter_accessibility_text')], 931 [7, getContext().resourceManager.getStringByNameSync('Seventh_counter_accessibility_text')], 932 [8, getContext().resourceManager.getStringByNameSync('Eighth_counter_accessibility_text')], 933 [9, getContext().resourceManager.getStringByNameSync('Ninth_counter_accessibility_text')], 934 [10, getContext().resourceManager.getStringByNameSync('Tenth_counter_accessibility_text')], 935 [11, getContext().resourceManager.getStringByNameSync('Eleventh_counter_accessibility_text')], 936 [12, getContext().resourceManager.getStringByNameSync('Twelfth_counter_accessibility_text')], 937 [13, getContext().resourceManager.getStringByNameSync('Thirteenth_counter_accessibility_text')], 938 [14, getContext().resourceManager.getStringByNameSync('Fourteenth_counter_accessibility_text')], 939 [15, getContext().resourceManager.getStringByNameSync('Fifteenth_counter_accessibility_text')], 940 [16, getContext().resourceManager.getStringByNameSync('Sixteenth_counter_accessibility_text')], 941 [17, getContext().resourceManager.getStringByNameSync('Seventeenth_counter_accessibility_text')], 942 [18, getContext().resourceManager.getStringByNameSync('Eighteenth_counter_accessibility_text')], 943 [19, getContext().resourceManager.getStringByNameSync('Nineteenth_counter_accessibility_text')], 944 [20, getContext().resourceManager.getStringByNameSync('Twentieth_counter_accessibility_text')], 945 [21, getContext().resourceManager.getStringByNameSync('TwentyFirst_counter_accessibility_text')], 946 [22, getContext().resourceManager.getStringByNameSync('TwentySecond_counter_accessibility_text')], 947 [23, getContext().resourceManager.getStringByNameSync('TwentyThird_counter_accessibility_text')], 948 [24, getContext().resourceManager.getStringByNameSync('TwentyFourth_counter_accessibility_text')], 949 [25, getContext().resourceManager.getStringByNameSync('TwentyFifth_counter_accessibility_text')], 950 [26, getContext().resourceManager.getStringByNameSync('TwentySixth_counter_accessibility_text')], 951 [27, getContext().resourceManager.getStringByNameSync('TwentySeventh_counter_accessibility_text')], 952 [28, getContext().resourceManager.getStringByNameSync('TwentyEighth_counter_accessibility_text')], 953 [29, getContext().resourceManager.getStringByNameSync('TwentyNinth_counter_accessibility_text')], 954 [30, getContext().resourceManager.getStringByNameSync('Thirtieth_counter_accessibility_text')], 955 [31, getContext().resourceManager.getStringByNameSync('ThirtyFirst_counter_accessibility_text')], 956 ]); 957 return this.getDate(dateDayMap.get(this.day)); 958 } catch (error) { 959 console.log(`Accessility getDate fail. message: ${error.message}, code: ${error.code}`); 960 return ''; 961 } 962 } 963 convertNumberToString(value) { 964 if (value >= 0 && value < CounterConstant.COUNTER_TEN_NUMBER) { 965 return this.numberStrList[value]; 966 } else { 967 return value.toString(); 968 } 969 } 970 aboutToAppear() { 971 let dateTime = new Date(); 972 this.timeStamp = dateTime.getTime(); 973 if (this.options !== undefined && this.options !== null) { 974 this.onOptionsChange(); 975 } 976 } 977 updateNumberStyleOptions() { 978 if (this.numberStyleOptions.label === undefined) { 979 this.numberStyleOptions.label = ''; 980 } 981 if (this.initFlag) { 982 this.initFlag = false; 983 this.value = this.numberStyleOptions.value !== undefined ? this.numberStyleOptions.value : 0; 984 this.onChange?.(this.value); 985 this.inputValue = this.value.toString(); 986 } 987 if (this.numberStyleOptions.min !== undefined) { 988 this.min = this.numberStyleOptions.min; 989 } 990 if (this.numberStyleOptions.max !== undefined) { 991 this.max = this.numberStyleOptions.max; 992 } 993 if (this.min > this.max) { 994 this.min = this.max; 995 } 996 if (this.numberStyleOptions.textWidth !== undefined) { 997 this.textWidth = this.numberStyleOptions.textWidth; 998 if (this.textWidth < 0) { 999 this.textWidth = 0; 1000 } 1001 this.hasTextWidth = true; 1002 } 1003 if (this.value <= this.min) { 1004 this.value = this.min; 1005 this.onChange?.(this.value); 1006 this.inputValue = this.value.toString(); 1007 } 1008 if (this.value >= this.max) { 1009 this.value = this.max; 1010 this.onChange?.(this.value); 1011 this.inputValue = this.value.toString(); 1012 } 1013 if (this.numberStyleOptions.step !== undefined) { 1014 if (this.numberStyleOptions.step < 1) { 1015 this.step = 1; 1016 } else { 1017 this.step = this.numberStyleOptions.step; 1018 } 1019 } 1020 this.updateButtonStatus(); 1021 this.updateNumberStyleOptionsEvent(); 1022 } 1023 updateNumberStyleOptionsEvent() { 1024 if (this.numberStyleOptions.onHoverIncrease !== undefined) { 1025 this.onHoverIncrease = this.numberStyleOptions.onHoverIncrease; 1026 } 1027 if (this.numberStyleOptions.onHoverDecrease !== undefined) { 1028 this.onHoverDecrease = this.numberStyleOptions.onHoverDecrease; 1029 } 1030 if (this.numberStyleOptions.onFocusIncrease !== undefined) { 1031 this.onFocusIncrease = this.numberStyleOptions.onFocusIncrease; 1032 } 1033 if (this.numberStyleOptions.onFocusDecrease !== undefined) { 1034 this.onFocusDecrease = this.numberStyleOptions.onFocusDecrease; 1035 } 1036 if (this.numberStyleOptions.onBlurIncrease !== undefined) { 1037 this.onBlurIncrease = this.numberStyleOptions.onBlurIncrease; 1038 } 1039 if (this.numberStyleOptions.onBlurDecrease !== undefined) { 1040 this.onBlurDecrease = this.numberStyleOptions.onBlurDecrease; 1041 } 1042 if (this.numberStyleOptions.onChange !== undefined) { 1043 this.onChange = this.numberStyleOptions.onChange; 1044 } 1045 if (this.numberStyleOptions.focusable !== undefined) { 1046 this.focusEnable = this.numberStyleOptions.focusable; 1047 } 1048 } 1049 updateInlineStyleOptions() { 1050 if (this.initFlag) { 1051 this.initFlag = false; 1052 this.value = this.inlineStyleOptions.value !== undefined ? this.inlineStyleOptions.value : 0; 1053 this.onChange?.(this.value); 1054 this.inputValue = this.value.toString(); 1055 } 1056 if (this.inlineStyleOptions.min !== undefined) { 1057 this.min = this.inlineStyleOptions.min; 1058 } 1059 if (this.inlineStyleOptions.max !== undefined) { 1060 this.max = this.inlineStyleOptions.max; 1061 } 1062 if (this.min > this.max) { 1063 this.min = this.max; 1064 } 1065 if (this.inlineStyleOptions.textWidth !== undefined) { 1066 this.textWidth = this.inlineStyleOptions.textWidth; 1067 if (this.textWidth < 0) { 1068 this.textWidth = 0; 1069 } 1070 this.hasTextWidth = true; 1071 } 1072 if (this.value <= this.min) { 1073 this.value = this.min; 1074 this.onChange?.(this.value); 1075 this.inputValue = this.value.toString(); 1076 } 1077 if (this.value >= this.max) { 1078 this.value = this.max; 1079 this.onChange?.(this.value); 1080 this.inputValue = this.value.toString(); 1081 } 1082 if (this.inlineStyleOptions.step !== undefined) { 1083 if (this.inlineStyleOptions.step < 1) { 1084 this.step = 1; 1085 } else { 1086 this.step = this.inlineStyleOptions.step; 1087 } 1088 } 1089 this.updateButtonStatus(); 1090 this.updateInlineStyleOptionsEvent(); 1091 } 1092 updateInlineStyleOptionsEvent() { 1093 if (this.inlineStyleOptions.onHoverIncrease !== undefined) { 1094 this.onHoverIncrease = this.inlineStyleOptions.onHoverIncrease; 1095 } 1096 if (this.inlineStyleOptions.onHoverDecrease !== undefined) { 1097 this.onHoverDecrease = this.inlineStyleOptions.onHoverDecrease; 1098 } 1099 if (this.inlineStyleOptions.onChange !== undefined) { 1100 this.onChange = this.inlineStyleOptions.onChange; 1101 } 1102 if (this.inlineStyleOptions.focusable !== undefined) { 1103 this.focusEnable = this.inlineStyleOptions.focusable; 1104 } 1105 } 1106 updateDateStyleOptions() { 1107 if (this.dateStyleOptions.step !== undefined) { 1108 if (this.dateStyleOptions.step < 1) { 1109 this.step = 1; 1110 } else { 1111 this.step = Math.floor(this.dateStyleOptions.step); 1112 } 1113 } 1114 if (this.dateStyleOptions.onHoverIncrease !== undefined) { 1115 this.onHoverIncrease = this.dateStyleOptions.onHoverIncrease; 1116 } 1117 if (this.dateStyleOptions.onHoverDecrease !== undefined) { 1118 this.onHoverDecrease = this.dateStyleOptions.onHoverDecrease; 1119 } 1120 if ( 1121 this.dateStyleOptions.year !== undefined && 1122 this.dateStyleOptions.year >= this.minYear && 1123 this.dateStyleOptions.year <= this.maxYear 1124 ) { 1125 if (this.year === 0) { 1126 this.year = this.dateStyleOptions.year; 1127 } 1128 } else { 1129 this.year = CounterConstant.COUNTER_MIN_YEAR; 1130 } 1131 if ( 1132 this.dateStyleOptions.month !== undefined && 1133 this.dateStyleOptions.month <= CounterConstant.COUNTER_MAX_MONTH && 1134 this.dateStyleOptions.month >= CounterConstant.COUNTER_MIN_MONTH 1135 ) { 1136 if (this.month === 0) { 1137 this.month = this.dateStyleOptions.month; 1138 } 1139 } else { 1140 this.month = CounterConstant.COUNTER_INITIAL_MONTH; 1141 } 1142 if ( 1143 this.dateStyleOptions.day !== undefined && 1144 this.dateStyleOptions.day <= this.getDayNumber() && 1145 this.dateStyleOptions.day >= CounterConstant.COUNTER_MIN_DAY 1146 ) { 1147 if (this.day === 0) { 1148 this.day = this.dateStyleOptions.day; 1149 } 1150 } else { 1151 this.day = CounterConstant.COUNTER_INITIAL_DAY; 1152 } 1153 if (this.dateStyleOptions.onDateChange !== undefined) { 1154 this.onDateChange = this.dateStyleOptions.onDateChange; 1155 } 1156 if (this.dateStyleOptions.focusable !== undefined) { 1157 this.focusEnable = this.dateStyleOptions.focusable; 1158 } 1159 this.updateDay(); 1160 } 1161 onOptionsChange() { 1162 this.type = this.options.type; 1163 if (this.options.direction) { 1164 this.counterDirection = this.options.direction; 1165 } else { 1166 this.counterDirection = Direction.Auto; 1167 } 1168 if (this.type === CounterType.LIST || this.type === CounterType.COMPACT) { 1169 if (this.options.numberOptions !== undefined) { 1170 this.numberStyleOptions = this.options.numberOptions; 1171 } 1172 this.updateNumberStyleOptions(); 1173 } else if (this.type === CounterType.INLINE) { 1174 if (this.options.inlineOptions !== undefined) { 1175 this.inlineStyleOptions = this.options.inlineOptions; 1176 } 1177 this.updateInlineStyleOptions(); 1178 } else if (this.type === CounterType.INLINE_DATE) { 1179 let options = this.options.dateOptions; 1180 if (options !== undefined) { 1181 options.year = options.year ? options.year : CounterConstant.COUNTER_MIN_YEAR; 1182 options.month = options.month ? options.month : CounterConstant.COUNTER_MIN_MONTH; 1183 options.day = options.day ? options.day : CounterConstant.COUNTER_MIN_DAY; 1184 this.dateStyleOptions = options; 1185 } 1186 this.updateDateStyleOptions(); 1187 } else { 1188 } 1189 } 1190 subValue() { 1191 if (this.subBtnStateEffect) { 1192 this.value -= this.step; 1193 } 1194 if (!this.addBtnStateEffect) { 1195 this.addBtnStateEffect = true; 1196 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1197 this.addBtnEnabled = true; 1198 } 1199 if (this.value <= this.min) { 1200 this.value = this.min; 1201 this.subOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1202 this.subBtnStateEffect = false; 1203 this.subBtnEnabled = false; 1204 } else { 1205 if (this.subOpacity === CounterResource.COUNTER_BUTTON_DISABLE_OPACITY) { 1206 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1207 } 1208 if (!this.subBtnStateEffect) { 1209 this.subBtnStateEffect = true; 1210 } 1211 if (!this.subBtnEnabled) { 1212 this.subBtnEnabled = true; 1213 } 1214 } 1215 this.focusText1(); 1216 } 1217 focusText1() { 1218 if (this.type === CounterType.INLINE) { 1219 if (this.focusText === FocusText.NONE) { 1220 this.focusText = FocusText.TEXT1; 1221 this.hasFocusText1 = true; 1222 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 1223 } 1224 } 1225 } 1226 addValue() { 1227 if (this.addBtnStateEffect) { 1228 this.value += this.step; 1229 } 1230 if (!this.subBtnStateEffect) { 1231 this.subBtnStateEffect = true; 1232 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1233 this.subBtnEnabled = true; 1234 } 1235 if (this.value >= this.max) { 1236 this.value = this.max; 1237 this.addOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1238 this.addBtnStateEffect = false; 1239 this.addBtnEnabled = false; 1240 } else { 1241 if (this.addOpacity === CounterResource.COUNTER_BUTTON_DISABLE_OPACITY) { 1242 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1243 } 1244 if (!this.addBtnStateEffect) { 1245 this.addBtnStateEffect = true; 1246 } 1247 if (!this.addBtnEnabled) { 1248 this.addBtnEnabled = true; 1249 } 1250 } 1251 this.focusText1(); 1252 } 1253 getDayNumber() { 1254 switch (this.month) { 1255 case CounterConstant.JANUARY: 1256 case CounterConstant.MARCH: 1257 case CounterConstant.MAY: 1258 case CounterConstant.JULY: 1259 case CounterConstant.AUGUST: 1260 case CounterConstant.OCTOBER: 1261 case CounterConstant.DECEMBER: 1262 return CounterConstant.BIG_MONTH_DAYS; 1263 break; 1264 case CounterConstant.APRIL: 1265 case CounterConstant.JUNE: 1266 case CounterConstant.SEPTEMBER: 1267 case CounterConstant.NOVEMBER: 1268 return CounterConstant.SMALL_MONTH_DAYS; 1269 break; 1270 case CounterConstant.FEBRUARY: 1271 if ( 1272 (this.year % CounterConstant.AUSPICIOUS_FOUR === 0 && this.year % CounterConstant.AUSPICIOUS_HUNDRED !== 0) || 1273 this.year % CounterConstant.AUSPICIOUS_FOUR_HUNDRED === 0 1274 ) { 1275 return CounterConstant.AUSPICIOUS_FEBRUARY_DAYS; 1276 } else { 1277 return CounterConstant.FEBRUARY_DAYS; 1278 } 1279 break; 1280 default: 1281 return CounterConstant.SMALL_MONTH_DAYS; 1282 break; 1283 } 1284 } 1285 accessibilityBroadcastSubDate() { 1286 if (this.focusText === FocusText.TEXT1) { 1287 if (this.subBtnStateEffect) { 1288 this.inputYear = this.year; 1289 this.year -= this.step; 1290 if (!this.hasFocusText1) { 1291 this.hasFocusText1 = true; 1292 } 1293 } 1294 if (!this.addBtnStateEffect) { 1295 this.addBtnStateEffect = true; 1296 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1297 this.addBtnEnabled = true; 1298 } 1299 if (this.year <= this.minYear) { 1300 this.subOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1301 this.subBtnStateEffect = false; 1302 this.subBtnEnabled = false; 1303 } else { 1304 if (this.subOpacity === CounterResource.COUNTER_BUTTON_DISABLE_OPACITY) { 1305 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1306 } 1307 if (!this.subBtnStateEffect) { 1308 this.subBtnStateEffect = true; 1309 } 1310 if (!this.subBtnEnabled) { 1311 this.subBtnEnabled = true; 1312 } 1313 } 1314 try { 1315 let eventInfo = { 1316 type: 'announceForAccessibility', 1317 bundleName: getContext()?.abilityInfo?.bundleName, 1318 triggerAction: 'click', 1319 textAnnouncedForAccessibility: 1320 this.getDateYear(this.year) + 1321 ',' + 1322 this.getDateYear(this.year) + 1323 '/' + 1324 this.getDateMonth(this.month) + 1325 '/' + 1326 this.getDateDay(this.day), 1327 }; 1328 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 1329 console.log('Accessility subYear click send event'); 1330 }); 1331 } catch (exception) { 1332 let code = exception.code; 1333 let message = exception.message; 1334 console.log(`Accessility subYear faild error code:${code} message:${message}`); 1335 } 1336 } else if (this.focusText === FocusText.TEXT2) { 1337 this.month -= this.step % CounterConstant.COUNTER_MAX_MONTH; 1338 if (this.month < CounterConstant.COUNTER_MIN_MONTH) { 1339 this.month += CounterConstant.COUNTER_MAX_MONTH; 1340 } 1341 if (!this.hasFocusText2) { 1342 this.hasFocusText2 = true; 1343 } 1344 try { 1345 let eventInfo = { 1346 type: 'announceForAccessibility', 1347 bundleName: getContext()?.abilityInfo?.bundleName, 1348 triggerAction: 'click', 1349 textAnnouncedForAccessibility: 1350 this.getDateMonth(this.month) + 1351 ',' + 1352 this.getDateYear(this.year) + 1353 '/' + 1354 this.getDateMonth(this.month) + 1355 '/' + 1356 this.getDateDay(this.day), 1357 }; 1358 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 1359 console.log('Accessility subMonth click send event'); 1360 }); 1361 } catch (exception) { 1362 let code = exception.code; 1363 let message = exception.message; 1364 console.log(`Accessility subMonth faild error code:${code} message:${message}`); 1365 } 1366 } else if (this.focusText === FocusText.TEXT3) { 1367 this.day -= this.step % this.getDayNumber(); 1368 if (this.day < CounterConstant.COUNTER_MIN_DAY) { 1369 this.day += this.getDayNumber(); 1370 } 1371 if (!this.hasFocusText3) { 1372 this.hasFocusText3 = true; 1373 } 1374 try { 1375 let eventInfo = { 1376 type: 'announceForAccessibility', 1377 bundleName: getContext()?.abilityInfo?.bundleName, 1378 triggerAction: 'click', 1379 textAnnouncedForAccessibility: 1380 this.getDateDay(this.day) + 1381 ',' + 1382 this.getDateYear(this.year) + 1383 '/' + 1384 this.getDateMonth(this.month) + 1385 '/' + 1386 this.getDateDay(this.day), 1387 }; 1388 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 1389 console.log('Accessility subDay click send event'); 1390 }); 1391 } catch (exception) { 1392 let code = exception.code; 1393 let message = exception.message; 1394 console.log(`Accessility subDay faild error code:${code} message:${message}`); 1395 } 1396 } else { 1397 this.focusDayWitdhSub(); 1398 } 1399 } 1400 subDate() { 1401 if (this.focusText === FocusText.TEXT1) { 1402 if (this.subBtnStateEffect) { 1403 this.inputYear = this.year; 1404 this.year -= this.step; 1405 if (!this.hasFocusText1) { 1406 this.hasFocusText1 = true; 1407 } 1408 } 1409 if (!this.addBtnStateEffect) { 1410 this.addBtnStateEffect = true; 1411 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1412 this.addBtnEnabled = true; 1413 } 1414 if (this.year <= this.minYear) { 1415 this.subOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1416 this.subBtnStateEffect = false; 1417 this.subBtnEnabled = false; 1418 } else { 1419 if (this.subOpacity === CounterResource.COUNTER_BUTTON_DISABLE_OPACITY) { 1420 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1421 } 1422 if (!this.subBtnStateEffect) { 1423 this.subBtnStateEffect = true; 1424 } 1425 if (!this.subBtnEnabled) { 1426 this.subBtnEnabled = true; 1427 } 1428 } 1429 } else if (this.focusText === FocusText.TEXT2) { 1430 this.month -= this.step % CounterConstant.COUNTER_MAX_MONTH; 1431 if (this.month < CounterConstant.COUNTER_MIN_MONTH) { 1432 this.month += CounterConstant.COUNTER_MAX_MONTH; 1433 } 1434 if (!this.hasFocusText2) { 1435 this.hasFocusText2 = true; 1436 } 1437 } else if (this.focusText === FocusText.TEXT3) { 1438 this.day -= this.step % this.getDayNumber(); 1439 if (this.day < CounterConstant.COUNTER_MIN_DAY) { 1440 this.day += this.getDayNumber(); 1441 } 1442 if (!this.hasFocusText3) { 1443 this.hasFocusText3 = true; 1444 } 1445 } else { 1446 this.focusDayWitdhSub(); 1447 } 1448 } 1449 focusDayWitdhSub() { 1450 this.focusText = FocusText.TEXT3; 1451 this.hasFocusText3 = true; 1452 this.day -= this.step % this.getDayNumber(); 1453 if (this.day < CounterConstant.COUNTER_MIN_DAY) { 1454 this.day += this.getDayNumber(); 1455 } 1456 this.focusWithTarget('DateTextInput3' + this.timeStamp.toString()); 1457 } 1458 accessibilityBroadcastAddDate() { 1459 if (this.focusText === FocusText.TEXT1) { 1460 if (this.addBtnStateEffect) { 1461 this.inputYear = this.year; 1462 this.year += this.step; 1463 if (!this.hasFocusText1) { 1464 this.hasFocusText1 = true; 1465 } 1466 } 1467 if (!this.subBtnStateEffect) { 1468 this.subBtnStateEffect = true; 1469 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1470 this.subBtnEnabled = true; 1471 } 1472 if (this.year >= this.maxYear) { 1473 this.addOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1474 this.addBtnStateEffect = false; 1475 this.addBtnEnabled = false; 1476 } else { 1477 if (this.addOpacity === CounterResource.COUNTER_BUTTON_DISABLE_OPACITY) { 1478 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1479 } 1480 if (!this.addBtnStateEffect) { 1481 this.addBtnStateEffect = true; 1482 } 1483 if (!this.addBtnEnabled) { 1484 this.addBtnEnabled = true; 1485 } 1486 } 1487 try { 1488 let eventInfo = { 1489 type: 'announceForAccessibility', 1490 bundleName: getContext()?.abilityInfo?.bundleName, 1491 triggerAction: 'click', 1492 textAnnouncedForAccessibility: 1493 this.getDateYear(this.year) + 1494 ',' + 1495 this.getDateYear(this.year) + 1496 '/' + 1497 this.getDateMonth(this.month) + 1498 '/' + 1499 this.getDateDay(this.day), 1500 }; 1501 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 1502 console.log('Accessility addYear click send event'); 1503 }); 1504 } catch (exception) { 1505 let code = exception.code; 1506 let message = exception.message; 1507 console.log(`Accessility addYear click faild error code:${code} message:${message}`); 1508 } 1509 } else if (this.focusText === FocusText.TEXT2) { 1510 this.month += this.step % CounterConstant.COUNTER_MAX_MONTH; 1511 if (this.month > CounterConstant.COUNTER_MAX_MONTH) { 1512 this.month -= CounterConstant.COUNTER_MAX_MONTH; 1513 } 1514 if (!this.hasFocusText2) { 1515 this.hasFocusText2 = true; 1516 } 1517 try { 1518 let eventInfo = { 1519 type: 'announceForAccessibility', 1520 bundleName: getContext()?.abilityInfo?.bundleName, 1521 triggerAction: 'click', 1522 textAnnouncedForAccessibility: 1523 this.getDateMonth(this.month) + 1524 ',' + 1525 this.getDateYear(this.year) + 1526 '/' + 1527 this.getDateMonth(this.month) + 1528 '/' + 1529 this.getDateDay(this.day), 1530 }; 1531 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 1532 console.log('Accessility addMonth click send event'); 1533 }); 1534 } catch (exception) { 1535 let code = exception.code; 1536 let message = exception.message; 1537 console.log(`Accessility addMonth faild error code:${code} message:${message}`); 1538 } 1539 } else if (this.focusText === FocusText.TEXT3) { 1540 this.day += this.step % this.getDayNumber(); 1541 if (this.day > this.getDayNumber()) { 1542 this.day -= this.getDayNumber(); 1543 } 1544 if (!this.hasFocusText3) { 1545 this.hasFocusText3 = true; 1546 } 1547 try { 1548 let eventInfo = { 1549 type: 'announceForAccessibility', 1550 bundleName: getContext()?.abilityInfo?.bundleName, 1551 triggerAction: 'click', 1552 textAnnouncedForAccessibility: 1553 this.getDateDay(this.day) + 1554 ',' + 1555 this.getDateYear(this.year) + 1556 '/' + 1557 this.getDateMonth(this.month) + 1558 '/' + 1559 this.getDateDay(this.day), 1560 }; 1561 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 1562 console.log('Accessility addDay click send event'); 1563 }); 1564 } catch (exception) { 1565 let code = exception.code; 1566 let message = exception.message; 1567 console.log(`Accessility addDay faild error code:${code} message:${message}`); 1568 } 1569 } else { 1570 this.focusDayWithAdd(); 1571 } 1572 } 1573 addDate() { 1574 if (this.focusText === FocusText.TEXT1) { 1575 if (this.addBtnStateEffect) { 1576 this.inputYear = this.year; 1577 this.year += this.step; 1578 if (!this.hasFocusText1) { 1579 this.hasFocusText1 = true; 1580 } 1581 } 1582 if (!this.subBtnStateEffect) { 1583 this.subBtnStateEffect = true; 1584 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1585 this.subBtnEnabled = true; 1586 } 1587 if (this.year >= this.maxYear) { 1588 this.addOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1589 this.addBtnStateEffect = false; 1590 this.addBtnEnabled = false; 1591 } else { 1592 if (this.addOpacity === CounterResource.COUNTER_BUTTON_DISABLE_OPACITY) { 1593 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1594 } 1595 if (!this.addBtnStateEffect) { 1596 this.addBtnStateEffect = true; 1597 } 1598 if (!this.addBtnEnabled) { 1599 this.addBtnEnabled = true; 1600 } 1601 } 1602 } else if (this.focusText === FocusText.TEXT2) { 1603 this.month += this.step % CounterConstant.COUNTER_MAX_MONTH; 1604 if (this.month > CounterConstant.COUNTER_MAX_MONTH) { 1605 this.month -= CounterConstant.COUNTER_MAX_MONTH; 1606 } 1607 if (!this.hasFocusText2) { 1608 this.hasFocusText2 = true; 1609 } 1610 } else if (this.focusText === FocusText.TEXT3) { 1611 this.day += this.step % this.getDayNumber(); 1612 if (this.day > this.getDayNumber()) { 1613 this.day -= this.getDayNumber(); 1614 } 1615 if (!this.hasFocusText3) { 1616 this.hasFocusText3 = true; 1617 } 1618 } else { 1619 this.focusDayWithAdd(); 1620 } 1621 } 1622 focusDayWithAdd() { 1623 this.focusText = FocusText.TEXT3; 1624 this.hasFocusText3 = true; 1625 this.day += this.step % this.getDayNumber(); 1626 if (this.day > this.getDayNumber()) { 1627 this.day -= this.getDayNumber(); 1628 } 1629 this.focusWithTarget('DateTextInput3' + this.timeStamp.toString()); 1630 } 1631 updateInlineEnableSate() { 1632 if (this.value >= this.max) { 1633 this.addOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1634 this.addBtnStateEffect = false; 1635 this.addBtnEnabled = false; 1636 } else { 1637 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1638 this.addBtnStateEffect = true; 1639 this.addBtnEnabled = true; 1640 } 1641 if (this.value <= this.min) { 1642 this.subOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1643 this.subBtnStateEffect = false; 1644 this.subBtnEnabled = false; 1645 } else { 1646 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1647 this.subBtnStateEffect = true; 1648 this.subBtnEnabled = true; 1649 } 1650 } 1651 updateDateEnableSate() { 1652 if (this.year === this.maxYear && this.focusText === FocusText.TEXT1) { 1653 this.addOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1654 this.addBtnStateEffect = false; 1655 this.addBtnEnabled = false; 1656 } else { 1657 if (this.addOpacity === CounterResource.COUNTER_BUTTON_DISABLE_OPACITY) { 1658 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1659 } 1660 if (!this.addBtnStateEffect) { 1661 this.addBtnStateEffect = true; 1662 } 1663 if (!this.addBtnEnabled) { 1664 this.addBtnEnabled = true; 1665 } 1666 } 1667 if (this.year === this.minYear && this.focusText === FocusText.TEXT1) { 1668 this.subOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1669 this.subBtnStateEffect = false; 1670 this.subBtnEnabled = false; 1671 } else { 1672 if (this.subOpacity === CounterResource.COUNTER_BUTTON_DISABLE_OPACITY) { 1673 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1674 } 1675 if (!this.subBtnStateEffect) { 1676 this.subBtnStateEffect = true; 1677 } 1678 if (!this.subBtnEnabled) { 1679 this.subBtnEnabled = true; 1680 } 1681 } 1682 } 1683 updateDay() { 1684 if (this.day > this.getDayNumber()) { 1685 this.day = this.getDayNumber(); 1686 } 1687 } 1688 resetFocusText() { 1689 this.focusText = FocusText.NONE; 1690 this.hasFocusText1 = false; 1691 this.hasFocusText2 = false; 1692 this.hasFocusText3 = false; 1693 } 1694 resetFocusButton() { 1695 if (this.addBtnFocusWidh === CounterResource.BUTTON_BORDER_FOCUSED_WIDTH) { 1696 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 1697 this.onBlurIncrease && this.onBlurIncrease(); 1698 } 1699 if (this.subBtnFocusWidh === CounterResource.BUTTON_BORDER_FOCUSED_WIDTH) { 1700 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 1701 this.onBlurDecrease && this.onBlurDecrease(); 1702 } 1703 } 1704 homeFocusText() { 1705 this.focusWithTarget('DateTextInput1' + this.timeStamp.toString()); 1706 } 1707 endFocusText() { 1708 this.focusWithTarget('DateTextInput3' + this.timeStamp.toString()); 1709 } 1710 homeFirstValue() { 1711 this.value = this.min; 1712 if (!this.addBtnStateEffect) { 1713 this.addBtnStateEffect = true; 1714 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1715 this.addBtnEnabled = true; 1716 } 1717 } 1718 endLastValue() { 1719 this.value = this.max; 1720 if (!this.subBtnStateEffect) { 1721 this.subBtnStateEffect = true; 1722 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1723 this.subBtnEnabled = true; 1724 } 1725 } 1726 updateButtonStatus() { 1727 if (this.value <= this.min) { 1728 if (!this.addBtnStateEffect && this.max != this.min) { 1729 this.addBtnStateEffect = true; 1730 this.addOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1731 this.addBtnEnabled = true; 1732 } 1733 this.subOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1734 this.subBtnStateEffect = false; 1735 this.subBtnEnabled = false; 1736 } 1737 if (this.value >= this.max) { 1738 if (!this.subBtnStateEffect && this.max != this.min) { 1739 this.subBtnStateEffect = true; 1740 this.subOpacity = CounterResource.COUNTER_BUTTON_INITIAL_OPACITY; 1741 this.subBtnEnabled = true; 1742 } 1743 this.addOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1744 this.addBtnStateEffect = false; 1745 this.addBtnEnabled = false; 1746 } 1747 } 1748 getValue() { 1749 if (this.inputValue == undefined) { 1750 this.inputValue = ''; 1751 } 1752 return this.hasInputText1 ? this.inputValue : this.value.toString(); 1753 } 1754 getValueLength() { 1755 return this.getValue().length > 0 ? this.getValue().length : 1; 1756 } 1757 getYear() { 1758 let year = this.year.toString(); 1759 if (year.length === 1) { 1760 year = '000' + year; 1761 } else if (year.length === 2) { 1762 year = '00' + year; 1763 } else if (year.length === 3) { 1764 year = '0' + year; 1765 } else { 1766 year = year; 1767 } 1768 return year; 1769 } 1770 focusWithTarget(key) { 1771 setTimeout(() => { 1772 let res = focusControl.requestFocus(key); 1773 if (res) { 1774 console.log('Request success'); 1775 } else { 1776 console.log('Request failed'); 1777 } 1778 }); 1779 } 1780 focusCurrentText(text) { 1781 if (text === FocusText.TEXT1) { 1782 if (this.focusText === FocusText.NONE) { 1783 this.focusText = FocusText.TEXT1; 1784 } 1785 if (!this.hasFocusText1) { 1786 this.hasFocusText1 = true; 1787 } 1788 } else if (text === FocusText.TEXT2) { 1789 if (this.focusText === FocusText.NONE) { 1790 this.focusText = FocusText.TEXT2; 1791 } 1792 if (!this.hasFocusText2) { 1793 this.hasFocusText2 = true; 1794 } 1795 } else if (text === FocusText.TEXT3) { 1796 if (this.focusText === FocusText.NONE) { 1797 this.focusText = FocusText.TEXT3; 1798 } 1799 if (!this.hasFocusText3) { 1800 this.hasFocusText3 = true; 1801 } 1802 } else { 1803 } 1804 } 1805 getMaxLength() { 1806 if (this.max.toString().length > this.min.toString().length) { 1807 return this.max.toString().length + 1; 1808 } else { 1809 return this.min.toString().length + 1; 1810 } 1811 } 1812 resourceToVp(value) { 1813 try { 1814 if (value.id !== -1) { 1815 return px2vp(getContext(this).resourceManager.getNumber(value.id)); 1816 } else { 1817 return px2vp(getContext(this).resourceManager.getNumberByName(value.params[0].split('.')[2])); 1818 } 1819 } catch (error) { 1820 return CounterResource.COUNTER_LIST_PADDING; 1821 } 1822 } 1823 getAccessibilityResource(resource) { 1824 let accessibilityResource = ''; 1825 try { 1826 if (typeof resource === 'string') { 1827 accessibilityResource = resource; 1828 } else { 1829 accessibilityResource = getContext()?.resourceManager?.getStringSync(resource?.id); 1830 } 1831 } catch (error) { 1832 let code = error.code; 1833 let message = error.message; 1834 console.log(`Get accessility resource error code:${code} message:${message}`); 1835 } 1836 return accessibilityResource; 1837 } 1838 getTextDirection() { 1839 if (this.counterDirection === Direction.Auto) { 1840 return i18n.isRTL(i18n.getSystemLanguage()) ? Direction.Rtl : Direction.Ltr; 1841 } else { 1842 return this.counterDirection; 1843 } 1844 } 1845 getIncreaseStr() { 1846 if (this.increaseStrCache === undefined) { 1847 this.increaseStrCache = this.getUIContext().getHostContext()?.resourceManager?.getStringSync(125834852) ?? ''; 1848 } 1849 return this.increaseStrCache; 1850 } 1851 getReduceStr() { 1852 if (this.reduceStrCache === undefined) { 1853 this.reduceStrCache = this.getUIContext().getHostContext()?.resourceManager?.getStringSync(125834853) ?? ''; 1854 } 1855 return this.reduceStrCache; 1856 } 1857 initialRender() { 1858 this.observeComponentCreation2((elmtId, isInitialRender) => { 1859 If.create(); 1860 if (this.type === CounterType.LIST) { 1861 this.ifElseBranchUpdateFunction(0, () => { 1862 this.observeComponentCreation2((elmtId, isInitialRender) => { 1863 RelativeContainer.create(); 1864 RelativeContainer.direction(this.counterDirection); 1865 RelativeContainer.width('100%'); 1866 RelativeContainer.height(CounterResource.COUNTER_LIST_HEIGHT); 1867 }, RelativeContainer); 1868 this.observeComponentCreation2((elmtId, isInitialRender) => { 1869 Text.create(this.numberStyleOptions.label); 1870 Text.direction(this.getTextDirection()); 1871 Text.fontSize(CounterResource.COUNTER_LIST_LABEL_SIZE); 1872 Text.maxFontScale(CounterResource.COUNTER_LABEL_MAX_FONT_SIZE_SCALE); 1873 Text.fontColor(CounterResource.COUNTER_TEXT_COLOR); 1874 Text.margin({ 1875 start: LengthMetrics.vp(this.resourceToVp(CounterResource.COUNTER_LIST_LEFT_PADDING)), 1876 }); 1877 Text.alignRules({ 1878 center: { anchor: '__container__', align: VerticalAlign.Center }, 1879 start: { anchor: '__container__', align: HorizontalAlign.Start }, 1880 end: { anchor: 'Row1', align: HorizontalAlign.Start }, 1881 }); 1882 Text.id('Text'); 1883 }, Text); 1884 Text.pop(); 1885 this.observeComponentCreation2((elmtId, isInitialRender) => { 1886 Row.create(); 1887 Row.direction(this.counterDirection); 1888 Row.height(CounterResource.COUNTER_LIST_BUTTON_SIZE); 1889 Row.margin({ 1890 end: LengthMetrics.vp(this.resourceToVp(CounterResource.COUNTER_LIST_RIGHT_PADDING)), 1891 }); 1892 Row.alignRules({ 1893 center: { anchor: '__container__', align: VerticalAlign.Center }, 1894 end: { anchor: '__container__', align: HorizontalAlign.End }, 1895 }); 1896 Row.tabIndex(0); 1897 Row.id('Row1'); 1898 }, Row); 1899 this.observeComponentCreation2((elmtId, isInitialRender) => { 1900 Stack.create(); 1901 Stack.direction(this.counterDirection); 1902 Stack.width(CounterResource.COUNTER_LIST_BUTTON_SIZE); 1903 Stack.height(CounterResource.COUNTER_LIST_BUTTON_SIZE); 1904 Stack.borderRadius(CounterResource.COUNTER_LIST_BUTTON_RADIUS); 1905 Stack.borderWidth(this.subBtnFocusWidh); 1906 Stack.borderColor(CounterResource.BUTTON_BORDER_FOCUSED_COLOR); 1907 Stack.clip(true); 1908 }, Stack); 1909 this.observeComponentCreation2((elmtId, isInitialRender) => { 1910 Image.create(CounterResource.BUTTON_SUB_ICON); 1911 Image.direction(this.counterDirection); 1912 Image.width(CounterResource.COUNTER_LIST_BUTTON_ICON_SIZE); 1913 Image.height(CounterResource.COUNTER_LIST_BUTTON_ICON_SIZE); 1914 Image.fillColor(CounterResource.BUTTON_ICON_COLOR); 1915 Image.opacity(this.subOpacity); 1916 }, Image); 1917 this.observeComponentCreation2((elmtId, isInitialRender) => { 1918 Button.createWithLabel({ 1919 type: ButtonType.Circle, 1920 stateEffect: this.subBtnStateEffect, 1921 }); 1922 Button.accessibilityText({ 1923 id: -1, 1924 type: 10003, 1925 params: ['sys.string.reduce_used_for_accessibility_text'], 1926 bundleName: '__harDefaultBundleName__', 1927 moduleName: '__harDefaultModuleName__', 1928 }); 1929 Button.accessibilityDescription(this.value === this.min ? '' : this.getReduceStr()); 1930 Button.accessibilityFocusDrawLevel(FocusDrawLevel.TOP); 1931 Button.direction(this.counterDirection); 1932 Button.width(CounterResource.COUNTER_LIST_BUTTON_SIZE); 1933 Button.height(CounterResource.COUNTER_LIST_BUTTON_SIZE); 1934 Button.responseRegion({ 1935 x: CounterResource.COUNTER_LIST_BUTTON_HOT_SPOT_X, 1936 y: CounterResource.COUNTER_LIST_BUTTON_HOT_SPOT_Y, 1937 width: '150%', 1938 height: '150%', 1939 }); 1940 Button.groupDefaultFocus(true); 1941 Button.backgroundColor(CounterResource.BUTTON_BACKGROUD_COLOR); 1942 Button.opacity(this.subOpacity); 1943 Button.enabled(this.subBtnEnabled); 1944 Button.key('ListSubButton' + this.timeStamp.toString()); 1945 Button.onKeyEvent(event => { 1946 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 1947 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 1948 this.resetFocusButton(); 1949 event.stopPropagation(); 1950 } 1951 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_HOME) { 1952 event.stopPropagation(); 1953 this.homeFirstValue(); 1954 this.focusWithTarget('ListAddButton' + this.timeStamp.toString()); 1955 } 1956 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_END) { 1957 event.stopPropagation(); 1958 if (this.addBtnStateEffect) { 1959 this.addBtnStateEffect = false; 1960 this.addOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 1961 this.addBtnEnabled = false; 1962 } 1963 this.endLastValue(); 1964 this.focusWithTarget('ListAddButton' + this.timeStamp.toString()); 1965 } 1966 }); 1967 Button.onClick(event => { 1968 this.subValue(); 1969 this.onChange?.(this.value); 1970 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 1971 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 1972 } 1973 try { 1974 let eventInfo = { 1975 type: 'announceForAccessibility', 1976 bundleName: getContext()?.abilityInfo?.bundleName, 1977 triggerAction: 'click', 1978 textAnnouncedForAccessibility: this.value?.toString(), 1979 }; 1980 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 1981 console.log('Accessility subValue click send event'); 1982 }); 1983 } catch (exception) { 1984 let code = exception.code; 1985 let message = exception.message; 1986 console.log(`Accessility subValue faild error code:${code} message:${message}`); 1987 } 1988 }); 1989 Gesture.create(GesturePriority.Low); 1990 LongPressGesture.create({ repeat: true }); 1991 LongPressGesture.onAction(event => { 1992 if (event.repeat) { 1993 this.subValue(); 1994 this.onChange?.(this.value); 1995 } 1996 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 1997 }); 1998 LongPressGesture.onActionEnd(() => { 1999 try { 2000 let eventInfo = { 2001 type: 'announceForAccessibility', 2002 bundleName: getContext()?.abilityInfo?.bundleName, 2003 triggerAction: 'common', 2004 textAnnouncedForAccessibility: this.value?.toString(), 2005 }; 2006 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 2007 console.log('Accessility subValue longPress send event'); 2008 }); 2009 } catch (exception) { 2010 let code = exception.code; 2011 let message = exception.message; 2012 console.log(`Accessility subValue longPress faild error code:${code} message:${message}`); 2013 } 2014 }); 2015 LongPressGesture.pop(); 2016 Gesture.pop(); 2017 Button.hoverEffect(this.choverEffect); 2018 Button.onHover(isHover => { 2019 this.onHoverDecrease && this.onHoverDecrease(isHover); 2020 }); 2021 Button.focusable(this.focusEnable); 2022 Button.onFocus(() => { 2023 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 2024 this.onFocusDecrease && this.onFocusDecrease(); 2025 this.updateButtonStatus(); 2026 }); 2027 Button.onBlur(() => { 2028 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2029 this.onBlurDecrease && this.onBlurDecrease(); 2030 }); 2031 }, Button); 2032 Button.pop(); 2033 Stack.pop(); 2034 this.observeComponentCreation2((elmtId, isInitialRender) => { 2035 If.create(); 2036 if (this.hasTextWidth) { 2037 this.ifElseBranchUpdateFunction(0, () => { 2038 this.observeComponentCreation2((elmtId, isInitialRender) => { 2039 Text.create(this.value.toString()); 2040 Text.accessibilityText( 2041 this.getAccessibilityResource(this.numberStyleOptions.label) + 2042 '[n2]' + 2043 this.value.toString() + 2044 '[n0]' 2045 ); 2046 Text.direction(this.counterDirection); 2047 Text.width(this.textWidth.toString()); 2048 Text.textAlign(TextAlign.Center); 2049 Text.fontSize(CounterResource.COUNTER_LIST_NUMBER_SIZE); 2050 Text.maxFontScale(CounterResource.COUNTER_NUMBER_MAX_FONT_SIZE_SCALE); 2051 Text.fontColor(CounterResource.COUNTER_TEXT_COLOR); 2052 Text.margin({ 2053 start: LengthMetrics.vp(CounterResource.COUNTER_LIST_BUTTON_TEXT_MARGIN), 2054 end: LengthMetrics.vp(CounterResource.COUNTER_LIST_BUTTON_TEXT_MARGIN), 2055 }); 2056 }, Text); 2057 Text.pop(); 2058 }); 2059 } else { 2060 this.ifElseBranchUpdateFunction(1, () => { 2061 this.observeComponentCreation2((elmtId, isInitialRender) => { 2062 Text.create(this.value.toString()); 2063 Text.accessibilityText( 2064 this.getAccessibilityResource(this.numberStyleOptions.label) + 2065 '[n2]' + 2066 this.value.toString() + 2067 '[n0]' 2068 ); 2069 Text.direction(this.counterDirection); 2070 Text.textAlign(TextAlign.Center); 2071 Text.fontSize(CounterResource.COUNTER_LIST_NUMBER_SIZE); 2072 Text.maxFontScale(CounterResource.COUNTER_NUMBER_MAX_FONT_SIZE_SCALE); 2073 Text.fontColor(CounterResource.COUNTER_TEXT_COLOR); 2074 Text.margin({ 2075 start: LengthMetrics.vp(CounterResource.COUNTER_LIST_BUTTON_TEXT_MARGIN), 2076 end: LengthMetrics.vp(CounterResource.COUNTER_LIST_BUTTON_TEXT_MARGIN), 2077 }); 2078 }, Text); 2079 Text.pop(); 2080 }); 2081 } 2082 }, If); 2083 If.pop(); 2084 this.observeComponentCreation2((elmtId, isInitialRender) => { 2085 Stack.create(); 2086 Stack.direction(this.counterDirection); 2087 Stack.width(CounterResource.COUNTER_LIST_BUTTON_SIZE); 2088 Stack.height(CounterResource.COUNTER_LIST_BUTTON_SIZE); 2089 Stack.borderRadius(CounterResource.COUNTER_LIST_BUTTON_RADIUS); 2090 Stack.borderWidth(this.addBtnFocusWidh); 2091 Stack.borderColor(CounterResource.BUTTON_BORDER_FOCUSED_COLOR); 2092 Stack.clip(true); 2093 }, Stack); 2094 this.observeComponentCreation2((elmtId, isInitialRender) => { 2095 Image.create(CounterResource.BUTTON_ADD_ICON); 2096 Image.direction(this.counterDirection); 2097 Image.width(CounterResource.COUNTER_LIST_BUTTON_ICON_SIZE); 2098 Image.height(CounterResource.COUNTER_LIST_BUTTON_ICON_SIZE); 2099 Image.fillColor(CounterResource.BUTTON_ICON_COLOR); 2100 Image.opacity(this.addOpacity); 2101 }, Image); 2102 this.observeComponentCreation2((elmtId, isInitialRender) => { 2103 Button.createWithLabel({ 2104 type: ButtonType.Circle, 2105 stateEffect: this.addBtnStateEffect, 2106 }); 2107 Button.accessibilityText({ 2108 id: -1, 2109 type: 10003, 2110 params: ['sys.string.increase_used_for_accessibility_text'], 2111 bundleName: '__harDefaultBundleName__', 2112 moduleName: '__harDefaultModuleName__', 2113 }); 2114 Button.accessibilityDescription(this.value === this.max ? '' : this.getIncreaseStr()); 2115 Button.accessibilityFocusDrawLevel(FocusDrawLevel.TOP); 2116 Button.direction(this.counterDirection); 2117 Button.width(CounterResource.COUNTER_LIST_BUTTON_SIZE); 2118 Button.height(CounterResource.COUNTER_LIST_BUTTON_SIZE); 2119 Button.responseRegion({ 2120 x: CounterResource.COUNTER_LIST_BUTTON_HOT_SPOT_X, 2121 y: CounterResource.COUNTER_LIST_BUTTON_HOT_SPOT_Y, 2122 width: '150%', 2123 height: '150%', 2124 }); 2125 Button.backgroundColor(CounterResource.BUTTON_BACKGROUD_COLOR); 2126 Button.opacity(this.addOpacity); 2127 Button.enabled(this.addBtnEnabled); 2128 Button.key('ListAddButton' + this.timeStamp.toString()); 2129 Button.onKeyEvent(event => { 2130 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 2131 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 2132 this.resetFocusButton(); 2133 event.stopPropagation(); 2134 } 2135 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_HOME) { 2136 event.stopPropagation(); 2137 this.homeFirstValue(); 2138 if (this.subBtnStateEffect) { 2139 this.subBtnStateEffect = false; 2140 this.subOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 2141 this.subBtnEnabled = false; 2142 } 2143 this.focusWithTarget('ListAddButton' + this.timeStamp.toString()); 2144 } 2145 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_END) { 2146 event.stopPropagation(); 2147 this.endLastValue(); 2148 this.focusWithTarget('ListSubButton' + this.timeStamp.toString()); 2149 } 2150 }); 2151 Button.onClick(event => { 2152 this.addValue(); 2153 this.onChange?.(this.value); 2154 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 2155 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2156 } 2157 try { 2158 let eventInfo = { 2159 type: 'announceForAccessibility', 2160 bundleName: getContext()?.abilityInfo?.bundleName, 2161 triggerAction: 'click', 2162 textAnnouncedForAccessibility: this.value?.toString(), 2163 }; 2164 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 2165 console.log('Accessility addValue click send event'); 2166 }); 2167 } catch (exception) { 2168 let code = exception.code; 2169 let message = exception.message; 2170 console.log(`Accessility addValue click longPress faild error code:${code} message:${message}`); 2171 } 2172 }); 2173 Gesture.create(GesturePriority.Low); 2174 LongPressGesture.create({ repeat: true }); 2175 LongPressGesture.onAction(event => { 2176 if (event.repeat) { 2177 this.addValue(); 2178 this.onChange?.(this.value); 2179 } 2180 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2181 }); 2182 LongPressGesture.onActionEnd(() => { 2183 try { 2184 let eventInfo = { 2185 type: 'announceForAccessibility', 2186 bundleName: getContext()?.abilityInfo?.bundleName, 2187 triggerAction: 'common', 2188 textAnnouncedForAccessibility: this.value?.toString(), 2189 }; 2190 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 2191 console.log('Accessility addValue longPress send event'); 2192 }); 2193 } catch (exception) { 2194 let code = exception.code; 2195 let message = exception.message; 2196 console.log(`Accessility addValue longPress longPress faild error code:${code} message:${message}`); 2197 } 2198 }); 2199 LongPressGesture.pop(); 2200 Gesture.pop(); 2201 Button.hoverEffect(this.choverEffect); 2202 Button.onHover(isHover => { 2203 this.onHoverIncrease && this.onHoverIncrease(isHover); 2204 }); 2205 Button.focusable(this.focusEnable); 2206 Button.onFocus(() => { 2207 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 2208 this.onFocusIncrease && this.onFocusIncrease(); 2209 this.updateButtonStatus(); 2210 }); 2211 Button.onBlur(() => { 2212 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2213 this.onBlurIncrease && this.onBlurIncrease(); 2214 }); 2215 }, Button); 2216 Button.pop(); 2217 Stack.pop(); 2218 Row.pop(); 2219 RelativeContainer.pop(); 2220 }); 2221 } else if (this.type === CounterType.COMPACT) { 2222 this.ifElseBranchUpdateFunction(1, () => { 2223 this.observeComponentCreation2((elmtId, isInitialRender) => { 2224 Column.create(); 2225 }, Column); 2226 this.observeComponentCreation2((elmtId, isInitialRender) => { 2227 Row.create(); 2228 Row.direction(this.counterDirection); 2229 Row.tabIndex(0); 2230 Row.height(CounterResource.COUNTER_COMPACT_CONTAINER_HEIGHT); 2231 Row.align(Alignment.Center); 2232 Row.borderWidth(CounterResource.COUNTER_BORDER_WIDTH); 2233 Row.borderColor(CounterResource.COUNTER_BORDER_COLOR); 2234 Row.borderRadius(CounterResource.COUNTER_COMPACT_CONTAINER_RADIUS); 2235 }, Row); 2236 this.observeComponentCreation2((elmtId, isInitialRender) => { 2237 Stack.create(); 2238 Stack.width(CounterResource.COUNTER_COMPACT_BUTTON_SIZE); 2239 Stack.height(CounterResource.COUNTER_COMPACT_BUTTON_SIZE); 2240 Stack.borderRadius(CounterResource.COUNTER_COMPACT_BUTTON_RADIUS); 2241 Stack.borderWidth(this.subBtnFocusWidh); 2242 Stack.borderColor(CounterResource.BUTTON_BORDER_FOCUSED_COLOR); 2243 Stack.margin({ 2244 start: LengthMetrics.vp(this.resourceToVp(CounterResource.COUNTER_COMPACT_BUTTON_CONTAINER_MARGIN)), 2245 }); 2246 Stack.clip(true); 2247 }, Stack); 2248 this.observeComponentCreation2((elmtId, isInitialRender) => { 2249 Image.create(CounterResource.BUTTON_SUB_ICON); 2250 Image.direction(this.counterDirection); 2251 Image.width(CounterResource.COUNTER_COMPACT_BUTTON_ICON_SIZE); 2252 Image.height(CounterResource.COUNTER_COMPACT_BUTTON_ICON_SIZE); 2253 Image.fillColor(CounterResource.BUTTON_ICON_COLOR); 2254 Image.opacity(this.subOpacity); 2255 }, Image); 2256 this.observeComponentCreation2((elmtId, isInitialRender) => { 2257 Button.createWithLabel({ 2258 type: ButtonType.Circle, 2259 stateEffect: this.subBtnStateEffect, 2260 }); 2261 Button.accessibilityText({ 2262 id: -1, 2263 type: 10003, 2264 params: ['sys.string.reduce_used_for_accessibility_text'], 2265 bundleName: '__harDefaultBundleName__', 2266 moduleName: '__harDefaultModuleName__', 2267 }); 2268 Button.accessibilityDescription(this.value === this.min ? '' : this.getReduceStr()); 2269 Button.accessibilityFocusDrawLevel(FocusDrawLevel.TOP); 2270 Button.direction(this.counterDirection); 2271 Button.width(CounterResource.COUNTER_COMPACT_BUTTON_SIZE); 2272 Button.height(CounterResource.COUNTER_COMPACT_BUTTON_SIZE); 2273 Button.backgroundColor(CounterResource.BUTTON_BACKGROUD_COLOR); 2274 Button.opacity(this.subOpacity); 2275 Button.enabled(this.subBtnEnabled); 2276 Button.key('CompactSubButton' + this.timeStamp.toString()); 2277 Button.onKeyEvent(event => { 2278 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 2279 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 2280 this.resetFocusButton(); 2281 event.stopPropagation(); 2282 } 2283 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_HOME) { 2284 event.stopPropagation(); 2285 this.homeFirstValue(); 2286 this.focusWithTarget('CompactAddButton' + this.timeStamp.toString()); 2287 } 2288 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_END) { 2289 event.stopPropagation(); 2290 this.endLastValue(); 2291 if (this.addBtnStateEffect) { 2292 this.addBtnStateEffect = false; 2293 this.addOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 2294 this.addBtnEnabled = false; 2295 } 2296 this.focusWithTarget('CompactSubButton' + this.timeStamp.toString()); 2297 } 2298 }); 2299 Button.onClick(event => { 2300 this.subValue(); 2301 this.onChange?.(this.value); 2302 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 2303 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2304 } 2305 try { 2306 let eventInfo = { 2307 type: 'announceForAccessibility', 2308 bundleName: getContext()?.abilityInfo?.bundleName, 2309 triggerAction: 'click', 2310 textAnnouncedForAccessibility: this.value?.toString(), 2311 }; 2312 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 2313 console.log('Accessility subValue click send event'); 2314 }); 2315 } catch (exception) { 2316 let code = exception.code; 2317 let message = exception.message; 2318 console.log(`Accessility subValue click longPress faild error code:${code} message:${message}`); 2319 } 2320 }); 2321 Gesture.create(GesturePriority.Low); 2322 LongPressGesture.create({ repeat: true }); 2323 LongPressGesture.onAction(event => { 2324 if (event.repeat) { 2325 this.subValue(); 2326 this.onChange?.(this.value); 2327 } 2328 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 2329 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2330 } 2331 }); 2332 LongPressGesture.onActionEnd(() => { 2333 try { 2334 let eventInfo = { 2335 type: 'announceForAccessibility', 2336 bundleName: getContext()?.abilityInfo?.bundleName, 2337 triggerAction: 'common', 2338 textAnnouncedForAccessibility: this.value?.toString(), 2339 }; 2340 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 2341 console.log('Accessility subValue longPress send event'); 2342 }); 2343 } catch (exception) { 2344 let code = exception.code; 2345 let message = exception.message; 2346 console.log(`Accessility subValue longPress longPress faild error code:${code} message:${message}`); 2347 } 2348 }); 2349 LongPressGesture.pop(); 2350 Gesture.pop(); 2351 Button.hoverEffect(this.choverEffect); 2352 Button.onHover(isHover => { 2353 this.onHoverDecrease && this.onHoverDecrease(isHover); 2354 }); 2355 Button.focusable(this.focusEnable); 2356 Button.groupDefaultFocus(true); 2357 Button.onFocus(() => { 2358 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 2359 this.onFocusDecrease && this.onFocusDecrease(); 2360 this.updateButtonStatus(); 2361 }); 2362 Button.onBlur(() => { 2363 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2364 this.onBlurDecrease && this.onBlurDecrease(); 2365 }); 2366 }, Button); 2367 Button.pop(); 2368 Stack.pop(); 2369 this.observeComponentCreation2((elmtId, isInitialRender) => { 2370 If.create(); 2371 if (this.hasTextWidth) { 2372 this.ifElseBranchUpdateFunction(0, () => { 2373 this.observeComponentCreation2((elmtId, isInitialRender) => { 2374 Text.create(this.value.toString()); 2375 Text.accessibilityText( 2376 this.getAccessibilityResource(this.numberStyleOptions.label) + 2377 '[n2]' + 2378 this.value.toString() + 2379 '[n0]' 2380 ); 2381 Text.textAlign(TextAlign.Center); 2382 Text.fontSize(CounterResource.COUNTER_NUMBER_SIZE); 2383 Text.maxFontScale(CounterResource.COUNTER_NUMBER_MAX_FONT_SIZE_SCALE); 2384 Text.fontColor(CounterResource.COUNTER_TEXT_COLOR); 2385 Text.width(this.textWidth.toString()); 2386 Text.margin({ 2387 start: LengthMetrics.vp(CounterResource.COUNTER_COMPACT_BUTTON_TEXT_MARGIN), 2388 end: LengthMetrics.vp(CounterResource.COUNTER_COMPACT_BUTTON_TEXT_MARGIN), 2389 }); 2390 }, Text); 2391 Text.pop(); 2392 }); 2393 } else { 2394 this.ifElseBranchUpdateFunction(1, () => { 2395 this.observeComponentCreation2((elmtId, isInitialRender) => { 2396 Text.create(this.value.toString()); 2397 Text.accessibilityText( 2398 this.getAccessibilityResource(this.numberStyleOptions.label) + 2399 '[n2]' + 2400 this.value.toString() + 2401 '[n0]' 2402 ); 2403 Text.direction(this.counterDirection); 2404 Text.textAlign(TextAlign.Center); 2405 Text.fontSize(CounterResource.COUNTER_NUMBER_SIZE); 2406 Text.maxFontScale(CounterResource.COUNTER_NUMBER_MAX_FONT_SIZE_SCALE); 2407 Text.fontColor(CounterResource.COUNTER_TEXT_COLOR); 2408 Text.margin({ 2409 start: LengthMetrics.vp(CounterResource.COUNTER_COMPACT_BUTTON_TEXT_MARGIN), 2410 end: LengthMetrics.vp(CounterResource.COUNTER_COMPACT_BUTTON_TEXT_MARGIN), 2411 }); 2412 }, Text); 2413 Text.pop(); 2414 }); 2415 } 2416 }, If); 2417 If.pop(); 2418 this.observeComponentCreation2((elmtId, isInitialRender) => { 2419 Stack.create(); 2420 Stack.direction(this.counterDirection); 2421 Stack.width(CounterResource.COUNTER_COMPACT_BUTTON_SIZE); 2422 Stack.height(CounterResource.COUNTER_COMPACT_BUTTON_SIZE); 2423 Stack.borderRadius(CounterResource.COUNTER_COMPACT_BUTTON_RADIUS); 2424 Stack.borderWidth(this.addBtnFocusWidh); 2425 Stack.borderColor(CounterResource.BUTTON_BORDER_FOCUSED_COLOR); 2426 Stack.margin({ 2427 end: LengthMetrics.vp(this.resourceToVp(CounterResource.COUNTER_COMPACT_BUTTON_CONTAINER_MARGIN)), 2428 }); 2429 Stack.clip(true); 2430 }, Stack); 2431 this.observeComponentCreation2((elmtId, isInitialRender) => { 2432 Image.create(CounterResource.BUTTON_ADD_ICON); 2433 Image.direction(this.counterDirection); 2434 Image.width(CounterResource.COUNTER_COMPACT_BUTTON_ICON_SIZE); 2435 Image.height(CounterResource.COUNTER_COMPACT_BUTTON_ICON_SIZE); 2436 Image.fillColor(CounterResource.BUTTON_ICON_COLOR); 2437 Image.opacity(this.addOpacity); 2438 }, Image); 2439 this.observeComponentCreation2((elmtId, isInitialRender) => { 2440 Button.createWithLabel({ 2441 type: ButtonType.Circle, 2442 stateEffect: this.addBtnStateEffect, 2443 }); 2444 Button.accessibilityText({ 2445 id: -1, 2446 type: 10003, 2447 params: ['sys.string.increase_used_for_accessibility_text'], 2448 bundleName: '__harDefaultBundleName__', 2449 moduleName: '__harDefaultModuleName__', 2450 }); 2451 Button.accessibilityDescription(this.value === this.max ? '' : this.getIncreaseStr()); 2452 Button.accessibilityFocusDrawLevel(FocusDrawLevel.TOP); 2453 Button.direction(this.counterDirection); 2454 Button.width(CounterResource.COUNTER_COMPACT_BUTTON_SIZE); 2455 Button.height(CounterResource.COUNTER_COMPACT_BUTTON_SIZE); 2456 Button.backgroundColor(CounterResource.BUTTON_BACKGROUD_COLOR); 2457 Button.opacity(this.addOpacity); 2458 Button.enabled(this.addBtnEnabled); 2459 Button.key('CompactAddButton' + this.timeStamp.toString()); 2460 Button.onKeyEvent(event => { 2461 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 2462 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 2463 this.resetFocusButton(); 2464 event.stopPropagation(); 2465 } 2466 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_HOME) { 2467 event.stopPropagation(); 2468 this.homeFirstValue(); 2469 if (this.subBtnStateEffect) { 2470 this.subBtnStateEffect = false; 2471 this.subOpacity = CounterResource.COUNTER_BUTTON_DISABLE_OPACITY; 2472 this.subBtnEnabled = false; 2473 } 2474 this.focusWithTarget('CompactAddButton' + this.timeStamp.toString()); 2475 } 2476 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_END) { 2477 event.stopPropagation(); 2478 this.endLastValue(); 2479 this.focusWithTarget('CompactSubButton' + this.timeStamp.toString()); 2480 } 2481 }); 2482 Button.onClick(event => { 2483 this.addValue(); 2484 this.onChange?.(this.value); 2485 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 2486 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2487 } 2488 try { 2489 let eventInfo = { 2490 type: 'announceForAccessibility', 2491 bundleName: getContext()?.abilityInfo?.bundleName, 2492 triggerAction: 'click', 2493 textAnnouncedForAccessibility: this.value?.toString(), 2494 }; 2495 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 2496 console.log('Accessility addValue click send event'); 2497 }); 2498 } catch (exception) { 2499 let code = exception.code; 2500 let message = exception.message; 2501 console.log(`Accessility addValue click longPress faild error code:${code} message:${message}`); 2502 } 2503 }); 2504 Gesture.create(GesturePriority.Low); 2505 LongPressGesture.create({ repeat: true }); 2506 LongPressGesture.onAction(event => { 2507 if (event.repeat) { 2508 this.addValue(); 2509 this.onChange?.(this.value); 2510 } 2511 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 2512 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2513 } 2514 }); 2515 LongPressGesture.onActionEnd(() => { 2516 try { 2517 let eventInfo = { 2518 type: 'announceForAccessibility', 2519 bundleName: getContext()?.abilityInfo?.bundleName, 2520 triggerAction: 'common', 2521 textAnnouncedForAccessibility: this.value?.toString(), 2522 }; 2523 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 2524 console.log('Accessility addValue longPress send event'); 2525 }); 2526 } catch (exception) { 2527 let code = exception.code; 2528 let message = exception.message; 2529 console.log(`Accessility addValue longPress longPress faild error code:${code} message:${message}`); 2530 } 2531 }); 2532 LongPressGesture.pop(); 2533 Gesture.pop(); 2534 Button.hoverEffect(this.choverEffect); 2535 Button.onHover(isHover => { 2536 this.onHoverIncrease && this.onHoverIncrease(isHover); 2537 }); 2538 Button.focusable(this.focusEnable); 2539 Button.onFocus(() => { 2540 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 2541 this.onFocusIncrease && this.onFocusIncrease(); 2542 this.updateButtonStatus(); 2543 }); 2544 Button.onBlur(() => { 2545 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2546 this.onBlurIncrease && this.onBlurIncrease(); 2547 }); 2548 }, Button); 2549 Button.pop(); 2550 Stack.pop(); 2551 Row.pop(); 2552 this.observeComponentCreation2((elmtId, isInitialRender) => { 2553 Text.create(this.numberStyleOptions.label); 2554 Text.direction(this.counterDirection); 2555 Text.margin({ 2556 top: CounterResource.COUNTER_COMPACT_CONTAINER_LABEL_DISTANCE, 2557 }); 2558 Text.fontSize(CounterResource.COUNTER_COMPACT_LABEL_SIZE); 2559 Text.maxFontScale(CounterResource.COUNTER_LABEL_MAX_FONT_SIZE_SCALE); 2560 Text.fontColor(CounterResource.COUNTER_TEXT_COLOR); 2561 Text.align(Alignment.Top); 2562 }, Text); 2563 Text.pop(); 2564 Column.pop(); 2565 }); 2566 } else if (this.type === CounterType.INLINE) { 2567 this.ifElseBranchUpdateFunction(2, () => { 2568 this.observeComponentCreation2((elmtId, isInitialRender) => { 2569 Row.create(); 2570 Row.direction(this.counterDirection); 2571 Row.height(CounterResource.COUNTER_INLINE_CONTAINER_HEIGHT); 2572 Row.borderWidth(CounterResource.COUNTER_BORDER_WIDTH); 2573 Row.borderColor(CounterResource.COUNTER_BORDER_COLOR); 2574 Row.borderRadius(CounterResource.COUNTER_INLINE_RADIUS); 2575 Row.clip(true); 2576 }, Row); 2577 this.observeComponentCreation2((elmtId, isInitialRender) => { 2578 If.create(); 2579 if (this.hasTextWidth) { 2580 this.ifElseBranchUpdateFunction(0, () => { 2581 this.observeComponentCreation2((elmtId, isInitialRender) => { 2582 RelativeContainer.create(); 2583 RelativeContainer.direction(this.counterDirection); 2584 RelativeContainer.margin({ 2585 start: LengthMetrics.vp(CounterResource.COUNTER_INLINE_INPUT_TEXT_MARGIN), 2586 end: LengthMetrics.vp(CounterResource.COUNTER_INLINE_INPUT_TEXT_MARGIN), 2587 }); 2588 RelativeContainer.height('100%'); 2589 RelativeContainer.width(this.textWidth); 2590 }, RelativeContainer); 2591 this.observeComponentCreation2((elmtId, isInitialRender) => { 2592 TextInput.create({ 2593 text: this.hasInputText1 ? this.inputValue : this.value.toString(), 2594 controller: this.controller1, 2595 }); 2596 TextInput.accessibilityDescription({ 2597 id: -1, 2598 type: 10003, 2599 params: ['sys.string.input_counter_double_click_description'], 2600 bundleName: '__harDefaultBundleName__', 2601 moduleName: '__harDefaultModuleName__', 2602 }); 2603 TextInput.alignRules({ 2604 center: { 2605 anchor: '__container__', 2606 align: VerticalAlign.Center, 2607 }, 2608 middle: { 2609 anchor: '__container__', 2610 align: HorizontalAlign.Center, 2611 }, 2612 }); 2613 TextInput.width(Math.min(this.getValueLength() * 9.6, this.textWidth)); 2614 TextInput.height('20vp'); 2615 TextInput.padding(0); 2616 TextInput.borderRadius(0); 2617 TextInput.textAlign(TextAlign.Center); 2618 TextInput.type(InputType.PhoneNumber); 2619 TextInput.copyOption(CopyOptions.None); 2620 TextInput.fontSize(this.getTextInputFontSize()); 2621 TextInput.fontWeight(FontWeight.Medium); 2622 TextInput.fontColor(this.hasFocusText1 ? Color.White : CounterResource.COUNTER_TEXT_COLOR); 2623 TextInput.maxLength(this.getMaxLength()); 2624 TextInput.backgroundColor( 2625 this.hasFocusText1 ? CounterResource.BUTTON_BORDER_FOCUSED_COLOR : Color.Transparent 2626 ); 2627 TextInput.key('InlineTextInput' + this.timeStamp.toString()); 2628 TextInput.onKeyEvent(event => { 2629 this.focusCurrentText(FocusText.TEXT1); 2630 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 2631 this.resetFocusText(); 2632 event.stopPropagation(); 2633 } 2634 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_UP) { 2635 this.addValue(); 2636 event.stopPropagation(); 2637 } 2638 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_HOME) { 2639 event.stopPropagation(); 2640 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 2641 } 2642 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_END) { 2643 event.stopPropagation(); 2644 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 2645 } 2646 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_DOWN) { 2647 this.subValue(); 2648 event.stopPropagation(); 2649 } 2650 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_LEFT) { 2651 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 2652 event.stopPropagation(); 2653 } 2654 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_RIGHT) { 2655 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 2656 event.stopPropagation(); 2657 } 2658 }); 2659 TextInput.onChange(value => { 2660 this.inputValue = value; 2661 for (let i = 0; i < value.length; i++) { 2662 let c = value[i]; 2663 if (c === '+' || c === '*' || c === '#') { 2664 this.value -= 1; 2665 this.value += 1; 2666 this.inputValue = this.value.toString(); 2667 return; 2668 } 2669 if (c === '-' && i !== 0) { 2670 this.inputValue = c; 2671 break; 2672 } 2673 } 2674 this.hasInputText1 = true; 2675 let c = value[value.length - 1]; 2676 if (value.length === this.getMaxLength()) { 2677 this.inputValue = c; 2678 } 2679 if (this.timeoutID1 !== -1) { 2680 clearTimeout(this.timeoutID1); 2681 this.timeoutID1 = -1; 2682 } 2683 if ( 2684 this.inputValue !== '' && 2685 Number(this.inputValue) <= this.max && 2686 Number(this.inputValue) >= this.min 2687 ) { 2688 this.value = Number(this.inputValue); 2689 this.onChange?.(this.value); 2690 this.hasInputText1 = false; 2691 } else { 2692 if ( 2693 Number(this.inputValue) > this.max || 2694 (Number(this.inputValue) < this.min && this.inputValue.length <= this.min.toString().length) 2695 ) { 2696 this.inputValue = c; 2697 } 2698 if (value.length < this.getMaxLength()) { 2699 this.timeoutID1 = setTimeout(() => { 2700 if ( 2701 this.inputValue !== '' && 2702 Number(this.inputValue) <= this.max && 2703 Number(this.inputValue) >= this.min 2704 ) { 2705 this.value = Number(this.inputValue); 2706 this.onChange?.(this.value); 2707 } 2708 this.inputValue = this.value.toString(); 2709 this.hasInputText1 = false; 2710 this.updateInlineEnableSate(); 2711 }, 1500); 2712 } 2713 } 2714 this.updateInlineEnableSate(); 2715 }); 2716 TextInput.onSubmit(enterKey => { 2717 if (this.timeoutID1 != -1) { 2718 clearTimeout(this.timeoutID1); 2719 this.timeoutID1 = -1; 2720 } 2721 this.hasInputText1 = false; 2722 this.value -= 1; 2723 if (Number(this.inputValue) >= this.min && Number(this.inputValue) <= this.max) { 2724 this.value = Number(this.inputValue); 2725 this.onChange?.(this.value); 2726 this.updateInlineEnableSate(); 2727 } else { 2728 this.value += 1; 2729 this.inputValue = this.value.toString(); 2730 } 2731 }); 2732 TextInput.focusable(true); 2733 TextInput.focusOnTouch(true); 2734 TextInput.onFocus(() => { 2735 this.focusText = FocusText.TEXT1; 2736 this.hasFocusText1 = true; 2737 this.controller1.caretPosition(this.value.toString().length); 2738 }); 2739 TextInput.onBlur(() => { 2740 this.focusText = FocusText.NONE; 2741 this.hasFocusText1 = false; 2742 }); 2743 TextInput.onClick(event => { 2744 this.focusText = FocusText.TEXT1; 2745 this.hasFocusText1 = true; 2746 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 2747 this.controller1.caretPosition(this.value.toString().length); 2748 }); 2749 }, TextInput); 2750 RelativeContainer.pop(); 2751 }); 2752 } else { 2753 this.ifElseBranchUpdateFunction(1, () => { 2754 this.observeComponentCreation2((elmtId, isInitialRender) => { 2755 Row.create(); 2756 Row.direction(this.counterDirection); 2757 Row.margin({ 2758 start: LengthMetrics.vp(CounterResource.COUNTER_INLINE_INPUT_TEXT_MARGIN), 2759 end: LengthMetrics.vp(CounterResource.COUNTER_INLINE_INPUT_TEXT_MARGIN), 2760 }); 2761 }, Row); 2762 this.observeComponentCreation2((elmtId, isInitialRender) => { 2763 TextInput.create({ 2764 text: this.hasInputText1 ? this.inputValue : this.value.toString(), 2765 controller: this.controller1, 2766 }); 2767 TextInput.accessibilityDescription({ 2768 id: -1, 2769 type: 10003, 2770 params: ['sys.string.input_counter_double_click_description'], 2771 bundleName: '__harDefaultBundleName__', 2772 moduleName: '__harDefaultModuleName__', 2773 }); 2774 TextInput.direction(this.counterDirection); 2775 TextInput.width(this.getValueLength() * 9.6); 2776 TextInput.height('20vp'); 2777 TextInput.padding(0); 2778 TextInput.borderRadius(0); 2779 TextInput.textAlign(TextAlign.Center); 2780 TextInput.type(InputType.PhoneNumber); 2781 TextInput.copyOption(CopyOptions.None); 2782 TextInput.fontSize(this.getTextInputFontSize()); 2783 TextInput.fontWeight(FontWeight.Medium); 2784 TextInput.fontColor(this.hasFocusText1 ? Color.White : CounterResource.COUNTER_TEXT_COLOR); 2785 TextInput.maxLength(this.getMaxLength()); 2786 TextInput.backgroundColor( 2787 this.hasFocusText1 ? CounterResource.BUTTON_BORDER_FOCUSED_COLOR : Color.Transparent 2788 ); 2789 TextInput.key('InlineTextInput' + this.timeStamp.toString()); 2790 TextInput.onKeyEvent(event => { 2791 this.focusCurrentText(FocusText.TEXT1); 2792 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 2793 this.resetFocusText(); 2794 event.stopPropagation(); 2795 } 2796 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_UP) { 2797 this.addValue(); 2798 event.stopPropagation(); 2799 } 2800 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_DOWN) { 2801 this.subValue(); 2802 event.stopPropagation(); 2803 } 2804 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_LEFT) { 2805 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 2806 event.stopPropagation(); 2807 } 2808 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_RIGHT) { 2809 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 2810 event.stopPropagation(); 2811 } 2812 }); 2813 TextInput.onChange(value => { 2814 this.inputValue = value; 2815 for (let i = 0; i < value.length; i++) { 2816 let c = value[i]; 2817 if (c === '+' || c === '*' || c === '#') { 2818 this.value -= 1; 2819 this.value += 1; 2820 this.inputValue = this.value.toString(); 2821 return; 2822 } 2823 if (c === '-' && i !== 0) { 2824 this.inputValue = c; 2825 break; 2826 } 2827 } 2828 this.hasInputText1 = true; 2829 let c = value[value.length - 1]; 2830 if (value.length === this.getMaxLength()) { 2831 this.inputValue = c; 2832 } 2833 if (this.timeoutID1 !== -1) { 2834 clearTimeout(this.timeoutID1); 2835 this.timeoutID1 = -1; 2836 } 2837 if ( 2838 this.inputValue !== '' && 2839 Number(this.inputValue) <= this.max && 2840 Number(this.inputValue) >= this.min 2841 ) { 2842 this.value = Number(this.inputValue); 2843 this.onChange?.(this.value); 2844 this.hasInputText1 = false; 2845 } else { 2846 if ( 2847 Number(this.inputValue) > this.max || 2848 (Number(this.inputValue) < this.min && this.inputValue.length <= this.min.toString().length) 2849 ) { 2850 this.inputValue = c; 2851 } 2852 if (value.length < this.getMaxLength()) { 2853 this.timeoutID1 = setTimeout(() => { 2854 if ( 2855 this.inputValue !== '' && 2856 Number(this.inputValue) <= this.max && 2857 Number(this.inputValue) >= this.min 2858 ) { 2859 this.value = Number(this.inputValue); 2860 this.onChange?.(this.value); 2861 } 2862 this.inputValue = this.value.toString(); 2863 this.hasInputText1 = false; 2864 this.updateInlineEnableSate(); 2865 }, 1500); 2866 } 2867 } 2868 this.updateInlineEnableSate(); 2869 }); 2870 TextInput.onSubmit(enterKey => { 2871 if (this.timeoutID1 !== -1) { 2872 clearTimeout(this.timeoutID1); 2873 this.timeoutID1 = -1; 2874 } 2875 this.hasInputText1 = false; 2876 this.value -= 1; 2877 if (Number(this.inputValue) >= this.min && Number(this.inputValue) <= this.max) { 2878 this.value = Number(this.inputValue); 2879 this.onChange?.(this.value); 2880 this.updateInlineEnableSate(); 2881 } else { 2882 this.value += 1; 2883 this.inputValue = this.value.toString(); 2884 } 2885 }); 2886 TextInput.focusable(true); 2887 TextInput.focusOnTouch(true); 2888 TextInput.onFocus(() => { 2889 this.focusText = FocusText.TEXT1; 2890 this.hasFocusText1 = true; 2891 this.controller1.caretPosition(this.value.toString().length); 2892 }); 2893 TextInput.onBlur(() => { 2894 this.focusText = FocusText.NONE; 2895 this.hasFocusText1 = false; 2896 }); 2897 TextInput.onClick(event => { 2898 this.focusText = FocusText.TEXT1; 2899 this.hasFocusText1 = true; 2900 this.focusWithTarget('InlineTextInput' + this.timeStamp.toString()); 2901 this.controller1.caretPosition(this.value.toString().length); 2902 }); 2903 }, TextInput); 2904 Row.pop(); 2905 }); 2906 } 2907 }, If); 2908 If.pop(); 2909 this.observeComponentCreation2((elmtId, isInitialRender) => { 2910 Column.create(); 2911 Column.direction(this.counterDirection); 2912 Column.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 2913 Column.height(CounterResource.COUNTER_INLINE_CONTAINER_HEIGHT); 2914 Column.borderWidth({ 2915 start: LengthMetrics.vp(CounterResource.COUNTER_BORDER_WIDTH_NUMBER), 2916 }); 2917 Column.borderColor(CounterResource.COUNTER_BORDER_COLOR); 2918 }, Column); 2919 this.observeComponentCreation2((elmtId, isInitialRender) => { 2920 Stack.create(); 2921 Stack.direction(this.counterDirection); 2922 Stack.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 2923 Stack.height(CounterResource.COUNTER_INLINE_BUTTON_HEIGHT); 2924 Stack.padding({ top: '1vp' }); 2925 Stack.borderWidth({ bottom: '1vp' }); 2926 Stack.borderColor(CounterResource.COUNTER_BORDER_COLOR); 2927 Stack.clip(true); 2928 }, Stack); 2929 this.observeComponentCreation2((elmtId, isInitialRender) => { 2930 Rect.create(); 2931 Rect.direction(this.counterDirection); 2932 Rect.width(CounterResource.COUNTER_INLINE_FOCUS_BORDER_WIDTH); 2933 Rect.height(CounterResource.COUNTER_INLINE_FOCUS_BORDER_HEIGHT); 2934 Rect.radius([ 2935 ['0vp', '0vp'], 2936 [CounterResource.COUNTER_INLINE_RADIUS, CounterResource.COUNTER_INLINE_RADIUS], 2937 ['0vp', '0vp'], 2938 ['0vp', '0vp'], 2939 ]); 2940 Rect.strokeWidth(this.addBtnFocusWidh); 2941 Rect.stroke(CounterResource.BUTTON_BORDER_FOCUSED_COLOR); 2942 Rect.margin({ end: LengthMetrics.vp(2) }); 2943 Rect.fillOpacity(0); 2944 }, Rect); 2945 this.observeComponentCreation2((elmtId, isInitialRender) => { 2946 Image.create(CounterResource.BUTTON_ARROW_UP); 2947 Image.direction(this.counterDirection); 2948 Image.width(CounterResource.COUNTER_INLINE_BUTTON_ICON_WIDTH); 2949 Image.height(CounterResource.COUNTER_INLINE_BUTTON_ICON_HEIGHT); 2950 Image.fillColor(CounterResource.BUTTON_ICON_COLOR); 2951 Image.opacity(this.addOpacity); 2952 }, Image); 2953 this.observeComponentCreation2((elmtId, isInitialRender) => { 2954 Button.createWithLabel({ 2955 type: ButtonType.Normal, 2956 stateEffect: this.addBtnStateEffect, 2957 }); 2958 Button.accessibilityText({ 2959 id: -1, 2960 type: 10003, 2961 params: ['sys.string.increase_used_for_accessibility_text'], 2962 bundleName: '__harDefaultBundleName__', 2963 moduleName: '__harDefaultModuleName__', 2964 }); 2965 Button.accessibilityDescription(this.value === this.max ? '' : this.getIncreaseStr()); 2966 Button.direction(this.counterDirection); 2967 Button.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 2968 Button.height(CounterResource.COUNTER_INLINE_BUTTON_HEIGHT); 2969 Button.backgroundColor(Color.Transparent); 2970 Button.opacity(this.addOpacity); 2971 Button.enabled(this.addBtnEnabled); 2972 Button.onClick(event => { 2973 this.addValue(); 2974 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 2975 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 2976 } 2977 try { 2978 let eventInfo = { 2979 type: 'announceForAccessibility', 2980 bundleName: getContext()?.abilityInfo?.bundleName, 2981 triggerAction: 'click', 2982 textAnnouncedForAccessibility: this.value?.toString(), 2983 }; 2984 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 2985 console.log('Accessility addValue click send event'); 2986 }); 2987 } catch (exception) { 2988 let code = exception.code; 2989 let message = exception.message; 2990 console.log(`Accessility addValue click longPress faild error code:${code} message:${message}`); 2991 } 2992 }); 2993 Gesture.create(GesturePriority.Low); 2994 LongPressGesture.create({ repeat: true }); 2995 LongPressGesture.onAction(event => { 2996 if (event.repeat) { 2997 this.addValue(); 2998 } 2999 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3000 }); 3001 LongPressGesture.onActionEnd(() => { 3002 try { 3003 let eventInfo = { 3004 type: 'announceForAccessibility', 3005 bundleName: getContext()?.abilityInfo?.bundleName, 3006 triggerAction: 'common', 3007 textAnnouncedForAccessibility: this.value?.toString(), 3008 }; 3009 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 3010 console.log('Accessility addValue longPress send event'); 3011 }); 3012 } catch (exception) { 3013 let code = exception.code; 3014 let message = exception.message; 3015 console.log(`Accessility addValue longPress faild error code:${code} message:${message}`); 3016 } 3017 }); 3018 LongPressGesture.pop(); 3019 Gesture.pop(); 3020 Button.hoverEffect(this.choverEffect); 3021 Button.onHover(isHover => { 3022 this.onHoverIncrease && this.onHoverIncrease(isHover); 3023 }); 3024 Button.focusable(false); 3025 Button.onFocus(() => { 3026 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 3027 this.onFocusIncrease && this.onFocusIncrease(); 3028 }); 3029 Button.onBlur(() => { 3030 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3031 this.onBlurIncrease && this.onBlurIncrease(); 3032 }); 3033 }, Button); 3034 Button.pop(); 3035 Stack.pop(); 3036 this.observeComponentCreation2((elmtId, isInitialRender) => { 3037 Stack.create(); 3038 Stack.direction(this.counterDirection); 3039 Stack.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 3040 Stack.height(CounterResource.COUNTER_INLINE_BUTTON_HEIGHT); 3041 Stack.clip(true); 3042 }, Stack); 3043 this.observeComponentCreation2((elmtId, isInitialRender) => { 3044 Rect.create(); 3045 Rect.direction(this.counterDirection); 3046 Rect.width(CounterResource.COUNTER_INLINE_FOCUS_BORDER_WIDTH); 3047 Rect.height(CounterResource.COUNTER_INLINE_FOCUS_BORDER_HEIGHT); 3048 Rect.radius([ 3049 ['0vp', '0vp'], 3050 ['0vp', '0vp'], 3051 [CounterResource.COUNTER_INLINE_RADIUS, CounterResource.COUNTER_INLINE_RADIUS], 3052 ['0vp', '0vp'], 3053 ]); 3054 Rect.strokeWidth(this.subBtnFocusWidh); 3055 Rect.stroke(CounterResource.BUTTON_BORDER_FOCUSED_COLOR); 3056 Rect.margin({ 3057 top: LengthMetrics.vp(1), 3058 end: LengthMetrics.vp(1), 3059 bottom: LengthMetrics.vp(2), 3060 }); 3061 Rect.fillOpacity(0); 3062 }, Rect); 3063 this.observeComponentCreation2((elmtId, isInitialRender) => { 3064 Image.create(CounterResource.BUTTON_ARROW_DOWN); 3065 Image.direction(this.counterDirection); 3066 Image.width(CounterResource.COUNTER_INLINE_BUTTON_ICON_WIDTH); 3067 Image.height(CounterResource.COUNTER_INLINE_BUTTON_ICON_HEIGHT); 3068 Image.fillColor(CounterResource.BUTTON_ICON_COLOR); 3069 Image.opacity(this.subOpacity); 3070 }, Image); 3071 this.observeComponentCreation2((elmtId, isInitialRender) => { 3072 Button.createWithLabel({ 3073 type: ButtonType.Normal, 3074 stateEffect: this.subBtnStateEffect, 3075 }); 3076 Button.accessibilityText({ 3077 id: -1, 3078 type: 10003, 3079 params: ['sys.string.reduce_used_for_accessibility_text'], 3080 bundleName: '__harDefaultBundleName__', 3081 moduleName: '__harDefaultModuleName__', 3082 }); 3083 Button.accessibilityDescription(this.value === this.min ? '' : this.getReduceStr()); 3084 Button.direction(this.counterDirection); 3085 Button.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 3086 Button.height(CounterResource.COUNTER_INLINE_BUTTON_HEIGHT); 3087 Button.backgroundColor(Color.Transparent); 3088 Button.opacity(this.subOpacity); 3089 Button.enabled(this.subBtnEnabled); 3090 Button.onClick(event => { 3091 this.subValue(); 3092 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 3093 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3094 } 3095 try { 3096 let eventInfo = { 3097 type: 'announceForAccessibility', 3098 bundleName: getContext()?.abilityInfo?.bundleName, 3099 triggerAction: 'click', 3100 textAnnouncedForAccessibility: this.value?.toString(), 3101 }; 3102 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 3103 console.log('Accessility subValue click send event'); 3104 }); 3105 } catch (exception) { 3106 let code = exception.code; 3107 let message = exception.message; 3108 console.log(`Accessility subValue click faild error code:${code} message:${message}`); 3109 } 3110 }); 3111 Gesture.create(GesturePriority.Low); 3112 LongPressGesture.create({ repeat: true }); 3113 LongPressGesture.onAction(event => { 3114 if (event.repeat) { 3115 this.subValue(); 3116 } 3117 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3118 }); 3119 LongPressGesture.onActionEnd(() => { 3120 try { 3121 let eventInfo = { 3122 type: 'announceForAccessibility', 3123 bundleName: getContext()?.abilityInfo?.bundleName, 3124 triggerAction: 'common', 3125 textAnnouncedForAccessibility: this.value?.toString(), 3126 }; 3127 accessibility.sendAccessibilityEvent(eventInfo).then(() => { 3128 console.log('Accessility subValue longPress send event'); 3129 }); 3130 } catch (exception) { 3131 let code = exception.code; 3132 let message = exception.message; 3133 console.log(`Accessility subValue longPress faild error code:${code} message:${message}`); 3134 } 3135 }); 3136 LongPressGesture.pop(); 3137 Gesture.pop(); 3138 Button.hoverEffect(this.choverEffect); 3139 Button.onHover(isHover => { 3140 this.onHoverDecrease && this.onHoverDecrease(isHover); 3141 }); 3142 Button.focusable(false); 3143 Button.onFocus(() => { 3144 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 3145 this.onFocusDecrease && this.onFocusDecrease(); 3146 }); 3147 Button.onBlur(() => { 3148 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3149 this.onBlurDecrease && this.onBlurDecrease(); 3150 }); 3151 }, Button); 3152 Button.pop(); 3153 Stack.pop(); 3154 Column.pop(); 3155 Row.pop(); 3156 }); 3157 } else if (this.type === CounterType.INLINE_DATE) { 3158 this.ifElseBranchUpdateFunction(3, () => { 3159 this.observeComponentCreation2((elmtId, isInitialRender) => { 3160 Row.create(); 3161 Row.direction(this.counterDirection); 3162 Row.height(CounterResource.COUNTER_INLINE_CONTAINER_HEIGHT); 3163 Row.borderWidth(CounterResource.COUNTER_BORDER_WIDTH); 3164 Row.borderColor(CounterResource.COUNTER_BORDER_COLOR); 3165 Row.borderRadius(CounterResource.COUNTER_INLINE_RADIUS); 3166 Row.clip(true); 3167 }, Row); 3168 this.observeComponentCreation2((elmtId, isInitialRender) => { 3169 Row.create(); 3170 Row.direction(this.counterDirection); 3171 Row.width('92vp'); 3172 Row.height(CounterResource.COUNTER_INLINE_CONTAINER_HEIGHT); 3173 Row.margin({ 3174 start: LengthMetrics.vp(CounterResource.COUNTER_INLINE_DATE_TEXT_MARGIN), 3175 end: LengthMetrics.vp(CounterResource.COUNTER_INLINE_DATE_TEXT_MARGIN), 3176 }); 3177 }, Row); 3178 this.observeComponentCreation2((elmtId, isInitialRender) => { 3179 TextInput.create({ 3180 text: this.hasInputText1 ? this.inputYear.toString() : this.getYear(), 3181 controller: this.controller1, 3182 }); 3183 TextInput.accessibilityText(this.getDateYear(this.year)); 3184 TextInput.accessibilityDescription({ 3185 id: -1, 3186 type: 10003, 3187 params: ['sys.string.input_counter_double_click_description'], 3188 bundleName: '__harDefaultBundleName__', 3189 moduleName: '__harDefaultModuleName__', 3190 }); 3191 TextInput.direction(this.counterDirection); 3192 TextInput.type(InputType.Number); 3193 TextInput.copyOption(CopyOptions.None); 3194 TextInput.fontSize(this.getTextInputFontSize()); 3195 TextInput.fontWeight(FontWeight.Medium); 3196 TextInput.fontColor(this.hasFocusText1 ? Color.White : CounterResource.COUNTER_TEXT_COLOR); 3197 TextInput.maxLength(5); 3198 TextInput.padding(0); 3199 TextInput.backgroundColor( 3200 this.hasFocusText1 ? CounterResource.BUTTON_BORDER_FOCUSED_COLOR : Color.Transparent 3201 ); 3202 TextInput.width('38vp'); 3203 TextInput.height('20vp'); 3204 TextInput.borderRadius(0); 3205 TextInput.borderWidth(0); 3206 TextInput.key('DateTextInput1' + this.timeStamp.toString()); 3207 TextInput.onKeyEvent(event => { 3208 this.focusCurrentText(FocusText.TEXT1); 3209 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 3210 this.resetFocusText(); 3211 event.stopPropagation(); 3212 } 3213 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_UP) { 3214 this.addDate(); 3215 event.stopPropagation(); 3216 } 3217 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_DOWN) { 3218 this.subDate(); 3219 event.stopPropagation(); 3220 } 3221 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_HOME) { 3222 this.homeFocusText(); 3223 event.stopPropagation(); 3224 } 3225 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_END) { 3226 this.endFocusText(); 3227 event.stopPropagation(); 3228 } 3229 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_LEFT) { 3230 this.focusWithTarget('DateTextInput1' + this.timeStamp.toString()); 3231 event.stopPropagation(); 3232 } 3233 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_RIGHT) { 3234 this.focusWithTarget('DateTextInput2' + this.timeStamp.toString()); 3235 } 3236 }); 3237 TextInput.onChange(value => { 3238 if (value.length !== 4) { 3239 this.hasInputText1 = true; 3240 } 3241 this.inputYear = Number(value); 3242 if (value.length === 5) { 3243 this.inputYear = this.inputYear % 10; 3244 } 3245 if (this.timeoutID1 !== -1) { 3246 clearTimeout(this.timeoutID1); 3247 this.timeoutID1 = -1; 3248 } 3249 this.timeoutID1 = setTimeout(() => { 3250 this.hasInputText1 = false; 3251 this.inputYear = this.year; 3252 this.updateDateEnableSate(); 3253 this.updateDay(); 3254 }, 1500); 3255 if (this.inputYear >= this.minYear && this.inputYear <= this.maxYear) { 3256 this.year = this.inputYear; 3257 this.updateDateEnableSate(); 3258 this.updateDay(); 3259 } 3260 if (value.length === 4) { 3261 let date = new DateData(this.year, this.month, this.day); 3262 this.onDateChange?.(date); 3263 } 3264 }); 3265 TextInput.onSubmit(enterKey => { 3266 if (this.timeoutID1 !== -1) { 3267 clearTimeout(this.timeoutID1); 3268 this.timeoutID1 = -1; 3269 } 3270 this.hasInputText1 = false; 3271 this.year -= 1; 3272 if (this.inputYear >= this.minYear && this.inputYear <= this.maxYear) { 3273 this.year = this.inputYear; 3274 } else { 3275 this.year += 1; 3276 this.inputYear = this.year; 3277 } 3278 this.updateDateEnableSate(); 3279 this.updateDay(); 3280 }); 3281 TextInput.tabIndex(0); 3282 TextInput.focusOnTouch(true); 3283 TextInput.focusable(true); 3284 TextInput.onFocus(() => { 3285 this.focusText = FocusText.TEXT1; 3286 this.hasFocusText1 = true; 3287 this.updateDateEnableSate(); 3288 this.controller1.caretPosition(this.getYear().length); 3289 }); 3290 TextInput.onBlur(() => { 3291 this.focusText = FocusText.NONE; 3292 this.hasFocusText1 = false; 3293 this.updateDateEnableSate(); 3294 }); 3295 TextInput.onClick(event => { 3296 this.focusText = FocusText.TEXT1; 3297 this.hasFocusText1 = true; 3298 this.updateDateEnableSate(); 3299 this.controller1.caretPosition(this.getYear().length); 3300 }); 3301 }, TextInput); 3302 this.observeComponentCreation2((elmtId, isInitialRender) => { 3303 Text.create('/'); 3304 Text.accessibilityLevel('no'); 3305 Text.direction(this.counterDirection); 3306 Text.textAlign(TextAlign.Center); 3307 Text.fontSize(CounterResource.COUNTER_NUMBER_SIZE); 3308 Text.maxFontScale(CounterResource.COUNTER_NUMBER_MAX_FONT_SIZE_SCALE); 3309 Text.fontColor(CounterResource.COUNTER_TEXT_COLOR); 3310 Text.width('8vp'); 3311 }, Text); 3312 Text.pop(); 3313 this.observeComponentCreation2((elmtId, isInitialRender) => { 3314 TextInput.create({ 3315 text: this.hasInputText2 ? this.inputMoon.toString() : this.convertNumberToString(this.month), 3316 controller: this.controller2, 3317 }); 3318 TextInput.accessibilityText(this.getDateMonth(this.month)); 3319 TextInput.accessibilityDescription({ 3320 id: -1, 3321 type: 10003, 3322 params: ['sys.string.input_counter_double_click_description'], 3323 bundleName: '__harDefaultBundleName__', 3324 moduleName: '__harDefaultModuleName__', 3325 }); 3326 TextInput.direction(this.counterDirection); 3327 TextInput.type(InputType.Number); 3328 TextInput.copyOption(CopyOptions.None); 3329 TextInput.fontSize(this.getTextInputFontSize()); 3330 TextInput.fontWeight(FontWeight.Medium); 3331 TextInput.fontColor(this.hasFocusText2 ? Color.White : CounterResource.COUNTER_TEXT_COLOR); 3332 TextInput.maxLength(3); 3333 TextInput.padding(0); 3334 TextInput.backgroundColor( 3335 this.hasFocusText2 ? CounterResource.BUTTON_BORDER_FOCUSED_COLOR : Color.Transparent 3336 ); 3337 TextInput.width('19vp'); 3338 TextInput.height('20vp'); 3339 TextInput.borderRadius(0); 3340 TextInput.key('DateTextInput2' + this.timeStamp.toString()); 3341 TextInput.onKeyEvent(event => { 3342 this.focusCurrentText(FocusText.TEXT2); 3343 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 3344 this.resetFocusText(); 3345 event.stopPropagation(); 3346 } 3347 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_DOWN) { 3348 this.subDate(); 3349 this.updateDay(); 3350 event.stopPropagation(); 3351 } 3352 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_UP) { 3353 this.addDate(); 3354 this.updateDay(); 3355 event.stopPropagation(); 3356 } 3357 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_HOME) { 3358 this.homeFocusText(); 3359 event.stopPropagation(); 3360 } 3361 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_END) { 3362 this.endFocusText(); 3363 event.stopPropagation(); 3364 } 3365 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_LEFT) { 3366 this.focusWithTarget('DateTextInput1' + this.timeStamp.toString()); 3367 } 3368 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_RIGHT) { 3369 this.focusWithTarget('DateTextInput3' + this.timeStamp.toString()); 3370 } 3371 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_TAB) { 3372 event.stopPropagation(); 3373 this.focusWithTarget('DateTextInput1' + this.timeStamp.toString()); 3374 } 3375 }); 3376 TextInput.onChange(value => { 3377 this.inputMoon = Number(value); 3378 if (value.length !== 2) { 3379 this.hasInputText2 = true; 3380 } 3381 if (value.length === 3) { 3382 this.inputMoon = this.inputMoon % 10; 3383 } 3384 if (this.timeoutID2 !== -1) { 3385 clearTimeout(this.timeoutID2); 3386 this.timeoutID2 = -1; 3387 } 3388 this.timeoutID2 = setTimeout(() => { 3389 this.hasInputText2 = false; 3390 this.month -= 1; 3391 if (this.inputMoon >= 1 && this.inputMoon <= 12) { 3392 this.month = this.inputMoon; 3393 } else { 3394 this.month += 1; 3395 this.inputMoon = this.month; 3396 } 3397 this.updateDay(); 3398 }, 1000); 3399 if (value.length === 2) { 3400 this.hasInputText2 = false; 3401 this.month -= 1; 3402 if (this.inputMoon >= 1 && this.inputMoon <= 12) { 3403 this.month = this.inputMoon; 3404 let date = new DateData(this.year, this.month, this.day); 3405 this.onDateChange?.(date); 3406 } else { 3407 this.month += 1; 3408 this.inputMoon = this.month; 3409 } 3410 this.updateDay(); 3411 } 3412 }); 3413 TextInput.onSubmit(enterKey => { 3414 if (this.timeoutID2 !== -1) { 3415 clearTimeout(this.timeoutID2); 3416 this.timeoutID2 = -1; 3417 } 3418 this.hasInputText2 = false; 3419 this.month -= 1; 3420 if (this.inputMoon >= 1 && this.inputMoon <= 12) { 3421 this.month = this.inputMoon; 3422 this.updateDay(); 3423 } else { 3424 this.month += 1; 3425 } 3426 }); 3427 TextInput.focusOnTouch(true); 3428 TextInput.tabIndex(-1); 3429 TextInput.focusable(true); 3430 TextInput.onFocus(() => { 3431 this.focusText = FocusText.TEXT2; 3432 this.hasFocusText2 = true; 3433 this.controller2.caretPosition(this.convertNumberToString(this.month).length); 3434 }); 3435 TextInput.onBlur(() => { 3436 this.focusText = FocusText.NONE; 3437 this.hasFocusText2 = false; 3438 }); 3439 TextInput.onClick(event => { 3440 this.focusText = FocusText.TEXT2; 3441 this.hasFocusText2 = true; 3442 this.controller2.caretPosition(this.convertNumberToString(this.month).length); 3443 }); 3444 }, TextInput); 3445 this.observeComponentCreation2((elmtId, isInitialRender) => { 3446 Text.create('/'); 3447 Text.accessibilityLevel('no'); 3448 Text.direction(this.counterDirection); 3449 Text.textAlign(TextAlign.Center); 3450 Text.fontSize(CounterResource.COUNTER_NUMBER_SIZE); 3451 Text.maxFontScale(CounterResource.COUNTER_NUMBER_MAX_FONT_SIZE_SCALE); 3452 Text.fontColor(CounterResource.COUNTER_TEXT_COLOR); 3453 Text.width('8vp'); 3454 }, Text); 3455 Text.pop(); 3456 this.observeComponentCreation2((elmtId, isInitialRender) => { 3457 TextInput.create({ 3458 text: this.hasInputText3 ? this.inputDay.toString() : this.convertNumberToString(this.day), 3459 controller: this.controller3, 3460 }); 3461 TextInput.accessibilityText(this.getDateDay(this.day)); 3462 TextInput.accessibilityDescription({ 3463 id: -1, 3464 type: 10003, 3465 params: ['sys.string.input_counter_double_click_description'], 3466 bundleName: '__harDefaultBundleName__', 3467 moduleName: '__harDefaultModuleName__', 3468 }); 3469 TextInput.direction(this.counterDirection); 3470 TextInput.type(InputType.Number); 3471 TextInput.copyOption(CopyOptions.None); 3472 TextInput.fontSize(this.getTextInputFontSize()); 3473 TextInput.fontWeight(FontWeight.Medium); 3474 TextInput.fontColor(this.hasFocusText3 ? Color.White : CounterResource.COUNTER_TEXT_COLOR); 3475 TextInput.maxLength(3); 3476 TextInput.padding(0); 3477 TextInput.backgroundColor( 3478 this.hasFocusText3 ? CounterResource.BUTTON_BORDER_FOCUSED_COLOR : Color.Transparent 3479 ); 3480 TextInput.width('19vp'); 3481 TextInput.height('20vp'); 3482 TextInput.borderRadius(0); 3483 TextInput.key('DateTextInput3' + this.timeStamp.toString()); 3484 TextInput.onKeyEvent(event => { 3485 this.focusCurrentText(FocusText.TEXT3); 3486 if (event.keyCode === CounterConstant.KEYCODE_ESC) { 3487 this.resetFocusText(); 3488 event.stopPropagation(); 3489 } 3490 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_DOWN) { 3491 this.subDate(); 3492 event.stopPropagation(); 3493 } 3494 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_UP) { 3495 this.addDate(); 3496 event.stopPropagation(); 3497 } 3498 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_HOME) { 3499 this.homeFocusText(); 3500 event.stopPropagation(); 3501 } 3502 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_MOVE_END) { 3503 this.endFocusText(); 3504 event.stopPropagation(); 3505 } 3506 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_LEFT) { 3507 this.focusWithTarget('DateTextInput2' + this.timeStamp.toString()); 3508 } 3509 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_DPAD_RIGHT) { 3510 this.focusWithTarget('DateTextInput3' + this.timeStamp.toString()); 3511 event.stopPropagation(); 3512 } 3513 if (event.type === KeyType.Down && event.keyCode === CounterConstant.KEYCODE_TAB) { 3514 event.stopPropagation(); 3515 this.focusWithTarget('DateTextInput1' + this.timeStamp.toString()); 3516 } 3517 }); 3518 TextInput.onChange(value => { 3519 this.inputDay = Number(value); 3520 if (value.length !== 2) { 3521 this.hasInputText3 = true; 3522 } 3523 if (value.length === 3) { 3524 this.inputDay = this.inputDay % 10; 3525 } 3526 if (this.timeoutID3 !== -1) { 3527 clearTimeout(this.timeoutID3); 3528 this.timeoutID3 = -1; 3529 } 3530 this.timeoutID3 = setTimeout(() => { 3531 this.hasInputText3 = false; 3532 this.day -= 1; 3533 if (this.inputDay >= 1 && this.inputDay <= this.getDayNumber()) { 3534 this.day = this.inputDay; 3535 } else { 3536 this.day += 1; 3537 this.inputDay = this.day; 3538 } 3539 }, 1000); 3540 if (value.length === 2) { 3541 this.hasInputText3 = false; 3542 this.day -= 1; 3543 if (this.inputDay >= 1 && this.inputDay <= this.getDayNumber()) { 3544 this.day = this.inputDay; 3545 let date = new DateData(this.year, this.month, this.day); 3546 this.onDateChange?.(date); 3547 } else { 3548 this.day += 1; 3549 this.inputDay = this.day; 3550 } 3551 } 3552 }); 3553 TextInput.onSubmit(enterKey => { 3554 if (this.timeoutID3 !== -1) { 3555 clearTimeout(this.timeoutID3); 3556 this.timeoutID3 = -1; 3557 } 3558 this.hasInputText3 = false; 3559 this.day -= 1; 3560 if (this.inputDay >= 1 && this.inputDay <= this.getDayNumber()) { 3561 this.day = this.inputDay; 3562 } else { 3563 this.day += 1; 3564 } 3565 }); 3566 TextInput.tabIndex(-2); 3567 TextInput.focusOnTouch(true); 3568 TextInput.focusable(true); 3569 TextInput.onFocus(() => { 3570 this.focusText = FocusText.TEXT3; 3571 this.hasFocusText3 = true; 3572 this.controller3.caretPosition(this.convertNumberToString(this.day).length); 3573 }); 3574 TextInput.onBlur(() => { 3575 this.focusText = FocusText.NONE; 3576 this.hasFocusText3 = false; 3577 }); 3578 TextInput.onClick(event => { 3579 this.focusText = FocusText.TEXT3; 3580 this.hasFocusText3 = true; 3581 this.controller3.caretPosition(this.convertNumberToString(this.day).length); 3582 }); 3583 }, TextInput); 3584 Row.pop(); 3585 this.observeComponentCreation2((elmtId, isInitialRender) => { 3586 Column.create(); 3587 Column.direction(this.counterDirection); 3588 Column.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 3589 Column.height(CounterResource.COUNTER_INLINE_CONTAINER_HEIGHT); 3590 Column.borderWidth({ 3591 start: LengthMetrics.vp(CounterResource.COUNTER_BORDER_WIDTH_NUMBER), 3592 }); 3593 Column.borderColor(CounterResource.COUNTER_BORDER_COLOR); 3594 }, Column); 3595 this.observeComponentCreation2((elmtId, isInitialRender) => { 3596 Stack.create(); 3597 Stack.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 3598 Stack.height(CounterResource.COUNTER_INLINE_BUTTON_HEIGHT); 3599 Stack.padding({ top: '1vp' }); 3600 Stack.borderWidth({ bottom: '1vp' }); 3601 Stack.borderColor(CounterResource.COUNTER_BORDER_COLOR); 3602 Stack.clip(true); 3603 }, Stack); 3604 this.observeComponentCreation2((elmtId, isInitialRender) => { 3605 Rect.create(); 3606 Rect.direction(this.counterDirection); 3607 Rect.width(CounterResource.COUNTER_INLINE_FOCUS_BORDER_WIDTH); 3608 Rect.height(CounterResource.COUNTER_INLINE_FOCUS_BORDER_HEIGHT); 3609 Rect.radius([ 3610 ['0vp', '0vp'], 3611 [CounterResource.COUNTER_INLINE_RADIUS, CounterResource.COUNTER_INLINE_RADIUS], 3612 ['0vp', '0vp'], 3613 ['0vp', '0vp'], 3614 ]); 3615 Rect.strokeWidth(this.addBtnFocusWidh); 3616 Rect.stroke(CounterResource.BUTTON_BORDER_FOCUSED_COLOR); 3617 Rect.margin({ end: LengthMetrics.vp(1) }); 3618 Rect.fillOpacity(0); 3619 }, Rect); 3620 this.observeComponentCreation2((elmtId, isInitialRender) => { 3621 Image.create(CounterResource.BUTTON_ARROW_UP); 3622 Image.direction(this.counterDirection); 3623 Image.width(CounterResource.COUNTER_INLINE_BUTTON_ICON_WIDTH); 3624 Image.height(CounterResource.COUNTER_INLINE_BUTTON_ICON_HEIGHT); 3625 Image.fillColor(CounterResource.BUTTON_ICON_COLOR); 3626 Image.opacity(this.addOpacity); 3627 }, Image); 3628 this.observeComponentCreation2((elmtId, isInitialRender) => { 3629 Button.createWithLabel({ 3630 type: ButtonType.Normal, 3631 stateEffect: this.addBtnStateEffect, 3632 }); 3633 Button.accessibilityText({ 3634 id: -1, 3635 type: 10003, 3636 params: ['sys.string.increase_used_for_accessibility_text'], 3637 bundleName: '__harDefaultBundleName__', 3638 moduleName: '__harDefaultModuleName__', 3639 }); 3640 Button.accessibilityDescription({ 3641 id: -1, 3642 type: 10003, 3643 params: ['sys.string.increase_counter_double_click_description'], 3644 bundleName: '__harDefaultBundleName__', 3645 moduleName: '__harDefaultModuleName__', 3646 }); 3647 Button.direction(this.counterDirection); 3648 Button.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 3649 Button.height(CounterResource.COUNTER_INLINE_BUTTON_HEIGHT); 3650 Button.backgroundColor(Color.Transparent); 3651 Button.opacity(this.addOpacity); 3652 Button.enabled(this.addBtnEnabled); 3653 Button.onClick(event => { 3654 this.accessibilityBroadcastAddDate(); 3655 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 3656 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3657 } 3658 }); 3659 Gesture.create(GesturePriority.Low); 3660 LongPressGesture.create({ repeat: true }); 3661 LongPressGesture.onAction(event => { 3662 if (event.repeat) { 3663 this.addDate(); 3664 } 3665 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3666 }); 3667 LongPressGesture.onActionEnd(() => { 3668 this.accessibilityBroadcastAddDate(); 3669 }); 3670 LongPressGesture.pop(); 3671 Gesture.pop(); 3672 Button.hoverEffect(this.choverEffect); 3673 Button.onHover(isHover => { 3674 this.onHoverIncrease && this.onHoverIncrease(isHover); 3675 }); 3676 Button.focusable(false); 3677 Button.onFocus(() => { 3678 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 3679 this.onFocusIncrease && this.onFocusIncrease(); 3680 }); 3681 Button.onBlur(() => { 3682 this.addBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3683 this.onBlurIncrease && this.onBlurIncrease(); 3684 }); 3685 }, Button); 3686 Button.pop(); 3687 Stack.pop(); 3688 this.observeComponentCreation2((elmtId, isInitialRender) => { 3689 Stack.create(); 3690 Stack.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 3691 Stack.height(CounterResource.COUNTER_INLINE_BUTTON_HEIGHT); 3692 Stack.clip(true); 3693 }, Stack); 3694 this.observeComponentCreation2((elmtId, isInitialRender) => { 3695 Rect.create(); 3696 Rect.direction(this.counterDirection); 3697 Rect.width(CounterResource.COUNTER_INLINE_FOCUS_BORDER_WIDTH); 3698 Rect.height(CounterResource.COUNTER_INLINE_FOCUS_BORDER_HEIGHT); 3699 Rect.radius([ 3700 ['0vp', '0vp'], 3701 ['0vp', '0vp'], 3702 [CounterResource.COUNTER_INLINE_RADIUS, CounterResource.COUNTER_INLINE_RADIUS], 3703 ['0vp', '0vp'], 3704 ]); 3705 Rect.strokeWidth(this.subBtnFocusWidh); 3706 Rect.stroke(CounterResource.BUTTON_BORDER_FOCUSED_COLOR); 3707 Rect.margin({ 3708 top: LengthMetrics.vp(1), 3709 end: LengthMetrics.vp(1), 3710 bottom: LengthMetrics.vp(2), 3711 }); 3712 Rect.fillOpacity(0); 3713 }, Rect); 3714 this.observeComponentCreation2((elmtId, isInitialRender) => { 3715 Image.create(CounterResource.BUTTON_ARROW_DOWN); 3716 Image.direction(this.counterDirection); 3717 Image.width(CounterResource.COUNTER_INLINE_BUTTON_ICON_WIDTH); 3718 Image.height(CounterResource.COUNTER_INLINE_BUTTON_ICON_HEIGHT); 3719 Image.fillColor(CounterResource.BUTTON_ICON_COLOR); 3720 Image.opacity(this.subOpacity); 3721 }, Image); 3722 this.observeComponentCreation2((elmtId, isInitialRender) => { 3723 Button.createWithLabel({ 3724 type: ButtonType.Normal, 3725 stateEffect: this.subBtnStateEffect, 3726 }); 3727 Button.accessibilityText({ 3728 id: -1, 3729 type: 10003, 3730 params: ['sys.string.reduce_used_for_accessibility_text'], 3731 bundleName: '__harDefaultBundleName__', 3732 moduleName: '__harDefaultModuleName__', 3733 }); 3734 Button.accessibilityDescription({ 3735 id: -1, 3736 type: 10003, 3737 params: ['sys.string.reduce_counter_double_click_description'], 3738 bundleName: '__harDefaultBundleName__', 3739 moduleName: '__harDefaultModuleName__', 3740 }); 3741 Button.direction(this.counterDirection); 3742 Button.width(CounterResource.COUNTER_INLINE_BUTTON_WIDTH); 3743 Button.height(CounterResource.COUNTER_INLINE_BUTTON_HEIGHT); 3744 Button.backgroundColor(Color.Transparent); 3745 Button.opacity(this.subOpacity); 3746 Button.enabled(this.subBtnEnabled); 3747 Button.onClick(event => { 3748 this.accessibilityBroadcastSubDate(); 3749 if (event.source === SourceType.Mouse || event.source === SourceType.TouchScreen) { 3750 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3751 } 3752 }); 3753 Gesture.create(GesturePriority.Low); 3754 LongPressGesture.create({ repeat: true }); 3755 LongPressGesture.onAction(event => { 3756 if (event.repeat) { 3757 this.subDate(); 3758 } 3759 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3760 }); 3761 LongPressGesture.onActionEnd(() => { 3762 this.accessibilityBroadcastSubDate(); 3763 }); 3764 LongPressGesture.pop(); 3765 Gesture.pop(); 3766 Button.hoverEffect(this.choverEffect); 3767 Button.onHover(isHover => { 3768 this.onHoverDecrease && this.onHoverDecrease(isHover); 3769 }); 3770 Button.focusable(false); 3771 Button.onFocus(() => { 3772 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_FOCUSED_WIDTH; 3773 this.onFocusDecrease && this.onFocusDecrease(); 3774 }); 3775 Button.onBlur(() => { 3776 this.subBtnFocusWidh = CounterResource.BUTTON_BORDER_BLUR_WIDTH; 3777 this.onBlurDecrease && this.onBlurDecrease(); 3778 }); 3779 }, Button); 3780 Button.pop(); 3781 Stack.pop(); 3782 Column.pop(); 3783 Row.pop(); 3784 }); 3785 } else { 3786 this.ifElseBranchUpdateFunction(4, () => {}); 3787 } 3788 }, If); 3789 If.pop(); 3790 } 3791 rerender() { 3792 this.updateDirtyElements(); 3793 } 3794} 3795 3796export default { 3797 CommonOptions, 3798 NumberStyleOptions, 3799 InlineStyleOptions, 3800 DateStyleOptions, 3801 CounterType, 3802 DateData, 3803 CounterOptions, 3804 CounterComponent, 3805}; 3806