1/* 2 * Copyright (c) 2020-2021 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16/** 17 * @file 18 * @kit ArkUI 19 */ 20 21import { Image, ImageData, ImageBitmap } from "./global"; 22import image from "../../@ohos.multimedia.image"; 23import { CanvasPattern } from './canvaspattern'; 24 25/** 26 * Defines the focus param. 27 * 28 * @interface FocusParamObj 29 * @syscap SystemCapability.ArkUI.ArkUI.Full 30 * @since 3 31 */ 32export interface FocusParamObj { 33 /** 34 * Whether needs to focus. 35 * 36 * @type { boolean } 37 * @syscap SystemCapability.ArkUI.ArkUI.Full 38 * @since 3 39 */ 40 focus: boolean; 41} 42 43/** 44 * RectObj 45 * 46 * @interface RectObj 47 * @syscap SystemCapability.ArkUI.ArkUI.Full 48 * @since 6 49 */ 50export interface RectObj { 51 /** 52 * @type { number } 53 * @syscap SystemCapability.ArkUI.ArkUI.Full 54 * @since 6 55 */ 56 width: number; 57 /** 58 * @type { number } 59 * @syscap SystemCapability.ArkUI.ArkUI.Full 60 * @since 6 61 */ 62 height: number; 63 /** 64 * @type { number } 65 * @syscap SystemCapability.ArkUI.ArkUI.Full 66 * @since 6 67 */ 68 left: number; 69 /** 70 * @type { number } 71 * @syscap SystemCapability.ArkUI.ArkUI.Full 72 * @since 6 73 */ 74 top: number; 75} 76 77/** 78 * ContextAttrOptions 79 * 80 * @interface ContextAttrOptions 81 * @syscap SystemCapability.ArkUI.ArkUI.Full 82 * @since 6 83 */ 84export interface ContextAttrOptions { 85 /** 86 * @type { boolean } 87 * @syscap SystemCapability.ArkUI.ArkUI.Full 88 * @since 6 89 */ 90 antialias: boolean; 91} 92 93/** 94 * AnimateStyle 95 * 96 * @interface AnimateStyle 97 * @syscap SystemCapability.ArkUI.ArkUI.Full 98 * @since 4 99 */ 100export interface AnimateStyle { 101 /** 102 * Width value applied to the component after the animation is executed. 103 * 104 * @type { number } 105 * @syscap SystemCapability.ArkUI.ArkUI.Full 106 * @since 4 107 */ 108 width: number; 109 /** 110 * Height value applied to the component after the animation is executed. 111 * 112 * @type { number } 113 * @syscap SystemCapability.ArkUI.ArkUI.Full 114 * @since 4 115 */ 116 height: number; 117 /** 118 * left offset applied to the component after the animation is executed. 119 * 120 * @type { number } 121 * @syscap SystemCapability.ArkUI.ArkUI.Full 122 * @since 4 123 */ 124 left: number; 125 /** 126 * top offset applied to the component after the animation is executed. 127 * 128 * @type { number } 129 * @syscap SystemCapability.ArkUI.ArkUI.Full 130 * @since 4 131 */ 132 top: number; 133 /** 134 * right offset applied to the component after the animation is executed. 135 * 136 * @type { number } 137 * @syscap SystemCapability.ArkUI.ArkUI.Full 138 * @since 4 139 */ 140 right: number; 141 /** 142 * bottom offset applied to the component after the animation is executed. 143 * 144 * @type { number } 145 * @syscap SystemCapability.ArkUI.ArkUI.Full 146 * @since 4 147 */ 148 bottom: number; 149 /** 150 * Background color applied to the component after the animation is executed. 151 * The default value is none. 152 * 153 * @type { string } 154 * @syscap SystemCapability.ArkUI.ArkUI.Full 155 * @since 4 156 */ 157 backgroundColor: string; 158 /** 159 * Opacity applied to the component. The value ranges from 0 to 1. 160 * The default value is 1. 161 * 162 * @type { number } 163 * @syscap SystemCapability.ArkUI.ArkUI.Full 164 * @since 4 165 */ 166 opacity: number; 167 /** 168 * The value format is "x y", in percentage or pixels. 169 * The first value indicates the horizontal position, and the second value indicates the vertical position. 170 * If only one value is specified, the other value is 50% by default. 171 * 172 * @type { string } 173 * @syscap SystemCapability.ArkUI.ArkUI.Full 174 * @since 4 175 */ 176 backgroundPosition: string; 177 /** 178 * Origin position of the transformed element. 179 * The first value indicates the x-axis position. The value can be left, center, right, a length, or percentage. 180 * The second value indicates the y-axis position. The value can be top, center, bottom, a length, or a percentage. 181 * 182 * @type { string } 183 * @syscap SystemCapability.ArkUI.ArkUI.Full 184 * @since 4 185 */ 186 transformOrigin: string; 187 /** 188 * Transformation type applied to an element. 189 * 190 * @type { "none" | TransformObject } 191 * @syscap SystemCapability.ArkUI.ArkUI.Full 192 * @since 4 193 */ 194 transform: "none" | TransformObject; 195 /** 196 * The value of offset must be within (0.0,1.0] and sorted in ascending order if it is provided. 197 * If there are only two frames, offset can be left empty. 198 * If there are more than two frames, offset is mandatory. 199 * 200 * @type { ?number } 201 * @syscap SystemCapability.ArkUI.ArkUI.Full 202 * @since 4 203 */ 204 offset?: number; 205} 206 207/** 208 * TransformObject 209 * 210 * @interface TransformObject 211 * @syscap SystemCapability.ArkUI.ArkUI.Full 212 * @since 4 213 */ 214export interface TransformObject { 215 /** 216 * Defines a 2D transformation, using a matrix of six values.. 217 * 218 * @param { number } scaleX - the scale value for x-axis 219 * @param { number } skewX - the skew value for y-axis 220 * @param { number } skewY - the skew value for x-axis 221 * @param { number } scaleY - the scale value for y-axis 222 * @param { number } translateX - the translate value for x-axis 223 * @param { number } translateY - the translate value for y-axis 224 * @syscap SystemCapability.ArkUI.ArkUI.Full 225 * @since 6 226 */ 227 matrix(scaleX: number, skewX: number, skewY: number, scaleY: number, translateX: number, translateY: number): void; 228 /** 229 * Defines a 3D transformation using a 4x4 matrix of 16 values. 230 * 231 * @param { number } n00 - the value of the 0 row and 0 column of the 4x4 matrix 232 * @param { number } n01 - the value of the 0 row and 1 column of the 4x4 matrix 233 * @param { number } n02 - the value of the 0 row and 2 column of the 4x4 matrix 234 * @param { number } n03 - the value of the 0 row and 3 column of the 4x4 matrix 235 * @param { number } n10 - the value of the 1 row and 0 column of the 4x4 matrix 236 * @param { number } n11 - the value of the 1 row and 1 column of the 4x4 matrix 237 * @param { number } n12 - the value of the 1 row and 2 column of the 4x4 matrix 238 * @param { number } n13 - the value of the 1 row and 3 column of the 4x4 matrix 239 * @param { number } n20 - the value of the 2 row and 0 column of the 4x4 matrix 240 * @param { number } n21 - the value of the 2 row and 1 column of the 4x4 matrix 241 * @param { number } n22 - the value of the 2 row and 2 column of the 4x4 matrix 242 * @param { number } n23 - the value of the 2 row and 3 column of the 4x4 matrix 243 * @param { number } n30 - the value of the 3 row and 0 column of the 4x4 matrix 244 * @param { number } n31 - the value of the 3 row and 1 column of the 4x4 matrix 245 * @param { number } n32 - the value of the 3 row and 2 column of the 4x4 matrix 246 * @param { number } n33 - the value of the 3 row and 3 column of the 4x4 matrix 247 * @syscap SystemCapability.ArkUI.ArkUI.Full 248 * @since 6 249 */ 250 matrix3d( 251 n00: number, 252 n01: number, 253 n02: number, 254 n03: number, 255 n10: number, 256 n11: number, 257 n12: number, 258 n13: number, 259 n20: number, 260 n21: number, 261 n22: number, 262 n23: number, 263 n30: number, 264 n31: number, 265 n32: number, 266 n33: number, 267 ): void; 268 /** 269 * Defines 2D transformations for translation of the X and Y axes 270 * 271 * @param { number } x - the translate value for x-axis 272 * @param { number } y - the translate value for y-axis 273 * @syscap SystemCapability.ArkUI.ArkUI.Full 274 * @since 4 275 */ 276 translate(x: number, y: number): void; 277 /** 278 * Defines 3D transformations for translation of the X / Y / Z axes 279 * 280 * @param { number } x - the translate value for x-axis 281 * @param { number } y - the translate value for y-axis 282 * @param { number } z - the translate value for z-axis 283 * @syscap SystemCapability.ArkUI.ArkUI.Full 284 * @since 6 285 */ 286 translate3d(x: number, y: number, z: number): void; 287 /** 288 * Defines 2D transformations for translation of the X axes 289 * 290 * @param { number } x - the translate value for x-axis 291 * @syscap SystemCapability.ArkUI.ArkUI.Full 292 * @since 4 293 */ 294 translateX(x: number): void; 295 /** 296 * Defines 2D transformations for translation of the Y axes 297 * 298 * @param { number } y - the translate value for y-axis 299 * @syscap SystemCapability.ArkUI.ArkUI.Full 300 * @since 4 301 */ 302 translateY(y: number): void; 303 /** 304 * Defines 3D transformations for translation of the Z axes 305 * 306 * @param { number } z the translate value for z-axis 307 * @syscap SystemCapability.ArkUI.ArkUI.Full 308 * @since 6 309 */ 310 translateZ(z: number): void; 311 /** 312 * Defines 2D transformations for scaling of the X and Y axes 313 * 314 * @param { number } x - the scale value for x-axis 315 * @param { number } y - the scale value for y-axis 316 * @syscap SystemCapability.ArkUI.ArkUI.Full 317 * @since 4 318 */ 319 scale(x: number, y: number): void; 320 /** 321 * Defines 3D transformations for scaling of the X / Y / Z axes 322 * 323 * @param { number } x - the scale value for x-axis 324 * @param { number } y - the scale value for y-axis 325 * @param { number } z - the scale value for z-axis 326 * @syscap SystemCapability.ArkUI.ArkUI.Full 327 * @since 6 328 */ 329 scale3d(x: number, y: number, z: number): void; 330 /** 331 * Defines 2D transformations for scaling of the X axes 332 * 333 * @param { number } x - the scale value for x-axis 334 * @syscap SystemCapability.ArkUI.ArkUI.Full 335 * @since 4 336 */ 337 scaleX(x: number): void; 338 /** 339 * Defines 2D transformations for scaling of the Y axes 340 * 341 * @param { number } y - the scale value for y-axis 342 * @syscap SystemCapability.ArkUI.ArkUI.Full 343 * @since 4 344 */ 345 scaleY(y: number): void; 346 /** 347 * Defines 3D transformations for scaling of the Z axes 348 * 349 * @param { number } z - the scale value for z-axis 350 * @syscap SystemCapability.ArkUI.ArkUI.Full 351 * @since 6 352 */ 353 scaleZ(z: number): void; 354 /** 355 * Define the 2D rotation and specify the angle in the parameters. 356 * 357 * @param { number } angle - the rotate value for z-axis 358 * @syscap SystemCapability.ArkUI.ArkUI.Full 359 * @since 4 360 */ 361 rotate(angle: number): void; 362 /** 363 * Defines a 3D transformation for rotating the X / Y / Z axes. 364 * 365 * @param { number } x - the vector value of the x-axis 366 * @param { number } y - the vector value of the y-axis 367 * @param { number } z - the vector value of the z-axis 368 * @param { number } angle - the rotate value for x&y&z vector. 369 * @syscap SystemCapability.ArkUI.ArkUI.Full 370 * @since 6 371 */ 372 rotate3d(x: number, y: number, z: number, angle: number): void; 373 /** 374 * Defines 3D transformations for rotating of the X axes. 375 * 376 * @param { number } angle - the scale value for x-axis 377 * @syscap SystemCapability.ArkUI.ArkUI.Full 378 * @since 4 379 */ 380 rotateX(angle: number): void; 381 /** 382 * Defines 3D transformations for rotating of the Y axes. 383 * 384 * @param { number } angle - the scale value for y-axis 385 * @syscap SystemCapability.ArkUI.ArkUI.Full 386 * @since 4 387 */ 388 rotateY(angle: number): void; 389 /** 390 * Defines 3D transformations for rotating of the Z axes. 391 * 392 * @param { number } angle - the scale value for z-axis 393 * @syscap SystemCapability.ArkUI.ArkUI.Full 394 * @since 6 395 */ 396 rotateZ(angle: number): void; 397 /** 398 * Defines the 2D skew transition along the X and Y axes. 399 * 400 * @param { number } xAngle - the angle of inclination along the x axis. 401 * @param { number } yAngle - the angle of inclination along the y axis. 402 * @syscap SystemCapability.ArkUI.ArkUI.Full 403 * @since 6 404 */ 405 skew(xAngle: number, yAngle: number): void; 406 /** 407 * Defines the 2D skew transition along the X axes. 408 * 409 * @param { number } angle - the angle of inclination along the x axis. 410 * @syscap SystemCapability.ArkUI.ArkUI.Full 411 * @since 6 412 */ 413 skewX(angle: number): void; 414 /** 415 * Defines the 2D skew transition along the Y axes. 416 * 417 * @param { number } angle - the angle of inclination along the y axis. 418 * @syscap SystemCapability.ArkUI.ArkUI.Full 419 * @since 6 420 */ 421 skewY(angle: number): void; 422 /** 423 * Defines a perspective view for the 3D transformation element. 424 * 425 * @param { number } verticalDistance - the vertical distance from the observation point to the component plane. 426 * @syscap SystemCapability.ArkUI.ArkUI.Full 427 * @since 6 428 */ 429 perspective(verticalDistance: number): void; 430} 431 432/** 433 * AnimateOptions 434 * 435 * @interface AnimateOptions 436 * @syscap SystemCapability.ArkUI.ArkUI.Full 437 * @since 4 438 */ 439export interface AnimateOptions { 440 /** 441 * Duration of the animation, in milliseconds. 442 * The default value is 0. 443 * 444 * @type { number } 445 * @syscap SystemCapability.ArkUI.ArkUI.Full 446 * @since 4 447 */ 448 duration: number; 449 450 /** 451 * Time curve of the animation. For details about the supported types. 452 * linear The animation speed keeps unchanged. 453 * ease The animation starts and ends at a low speed, cubic-bezier(0.25, 0.1, 0.25, 1.0). 454 * ease-in The animation starts at a low speed, cubic-bezier(0.42, 0.0, 1.0, 1.0). 455 * ease-out The animation ends at a low speed, cubic-bezier(0.0, 0.0, 0.58, 1.0). 456 * ease-in-out The animation starts and ends at a low speed, cubic-bezier(0.42, 0.0, 0.58, 1.0). 457 * fast-out-slow-in Standard curve, cubic-bezier(0.4, 0.0, 0.2, 1.0). 458 * linear-out-slow-in Deceleration curve, cubic-bezier(0.0, 0.0, 0.2, 1.0). 459 * fast-out-linear-in Acceleration curve, cubic-bezier(0.4, 0.0, 1.0, 1.0). 460 * friction Damping curve, cubic-bezier(0.2, 0.0, 0.2, 1.0). 461 * extreme-deceleration Extreme deceleration curve, cubic-bezier(0.0, 0.0, 0.0, 1.0). 462 * sharp Sharp curve, cubic-bezier(0.33, 0.0, 0.67, 1.0). 463 * rhythm Rhythm curve, cubic-bezier(0.7, 0.0, 0.2, 1.0). 464 * smooth Smooth curve, cubic-bezier(0.4, 0.0, 0.4, 1.0). 465 * cubic-bezier(x1, y1, x2, y2) You can customize an animation speed curve in the cubic-bezier() function. 466 * The x and y values of each input parameter must be between 0 and 1. 467 * Step curve. The number must be set and only an integer is supported, step-position is optional. It can be set to start or end. The default value is end. 468 * The default value is ease. 469 * 470 * @type { string } 471 * @syscap SystemCapability.ArkUI.ArkUI.Full 472 * @since 4 473 */ 474 easing: string; 475 476 /** 477 * Delay for the animation start. The default value indicates no delay. 478 * The default value is 0. 479 * 480 * @type { number } 481 * @syscap SystemCapability.ArkUI.ArkUI.Full 482 * @since 4 483 */ 484 delay: number; 485 486 /** 487 * Number of times the animation will be played. number indicates a fixed number of playback operations, 488 * and Infinity indicates an unlimited number of playback operations. 489 * The default value is 1. 490 * 491 * @type { number | string } 492 * @syscap SystemCapability.ArkUI.ArkUI.Full 493 * @since 4 494 */ 495 iterations: number | string; 496 497 /** 498 * The animation playback mode. 499 * The default value is "normal". 500 * 501 * @type { "normal" | "reverse" | "alternate" | "alternate-reverse" } 502 * @syscap SystemCapability.ArkUI.ArkUI.Full 503 * @since 6 504 */ 505 direction: "normal" | "reverse" | "alternate" | "alternate-reverse"; 506 507 /** 508 * Whether to resume to the initial state after the animation is executed. 509 * none: The initial state is restored after the animation is executed. 510 * forwards: The state at the end of the animation (defined in the last key frame) is retained after the animation is executed. 511 * 512 * @type { "none" | "forwards" | "backwards" | "both" } 513 * @syscap SystemCapability.ArkUI.ArkUI.Full 514 * @since 4 515 */ 516 fill: "none" | "forwards" | "backwards" | "both"; 517} 518 519/** 520 * AnimationResult 521 * 522 * @interface AnimationResult 523 * @syscap SystemCapability.ArkUI.ArkUI.Full 524 * @since 4 525 */ 526export interface AnimationResult { 527 /** 528 * Read-only attribute, which indicates whether the animation playback is complete. 529 * 530 * @type { boolean } 531 * @syscap SystemCapability.ArkUI.ArkUI.Full 532 * @since 4 533 */ 534 finished: boolean; 535 /** 536 * Read-only attribute, which indicates whether an animation is waiting for the completion of other asynchronous operations 537 * (for example, start an animation with a delay). 538 * 539 * @type { boolean } 540 * @syscap SystemCapability.ArkUI.ArkUI.Full 541 * @since 4 542 */ 543 pending: boolean; 544 /** 545 * Animation running state: 546 * idle: The animation is not running (playback ended or not started). 547 * running: The animation is running. 548 * paused: The animation is paused. 549 * finished: Animation playback ends. 550 * 551 * @type { string } 552 * @syscap SystemCapability.ArkUI.ArkUI.Full 553 * @since 4 554 */ 555 playstate: string; 556 /** 557 * Animation start time. This attribute is similar to that of delay in the options parameters. 558 * 559 * @type { number } 560 * @syscap SystemCapability.ArkUI.ArkUI.Full 561 * @since 4 562 */ 563 startTime: number; 564 /** 565 * Starts the animation. 566 * 567 * @syscap SystemCapability.ArkUI.ArkUI.Full 568 * @since 4 569 */ 570 play(): void; 571 /** 572 * Ends the animation. 573 * 574 * @syscap SystemCapability.ArkUI.ArkUI.Full 575 * @since 4 576 */ 577 finish(): void; 578 /** 579 * Pauses the animation. 580 * 581 * @syscap SystemCapability.ArkUI.ArkUI.Full 582 * @since 4 583 */ 584 pause(): void; 585 /** 586 * Cancels the animation. 587 * 588 * @syscap SystemCapability.ArkUI.ArkUI.Full 589 * @since 4 590 */ 591 cancel(): void; 592 /** 593 * Plays the animation in reverse direction. 594 * 595 * @syscap SystemCapability.ArkUI.ArkUI.Full 596 * @since 4 597 */ 598 reverse(): void; 599 /** 600 * The animation is started. 601 * 602 * @type { function } 603 * @syscap SystemCapability.ArkUI.ArkUI.Full 604 * @since 4 605 */ 606 onstart: () => void; 607 /** 608 * The animation is finished. 609 * 610 * @type { function } 611 * @syscap SystemCapability.ArkUI.ArkUI.Full 612 * @since 4 613 */ 614 onfinish: () => void; 615 /** 616 * The animation is canceled. 617 * 618 * @type { function } 619 * @syscap SystemCapability.ArkUI.ArkUI.Full 620 * @since 4 621 */ 622 oncancel: () => void; 623 /** 624 * The animation is repeated. 625 * 626 * @type { function } 627 * @syscap SystemCapability.ArkUI.ArkUI.Full 628 * @since 4 629 */ 630 onrepeat: () => void; 631} 632 633/** 634 * Element 635 * 636 * @interface Element 637 * @syscap SystemCapability.ArkUI.ArkUI.Full 638 * @since 4 639 */ 640export interface Element { 641 /** 642 * Requests or cancels the focus for a component. 643 * If focus is set to true, the focus is requested for the component. 644 * If focus is set to false, the focus is canceled for the component. 645 * This attribute can be defaulted to true. 646 * 647 * @param { FocusParamObj } [obj] - { focus: true | false } 648 * @syscap SystemCapability.ArkUI.ArkUI.Full 649 * @since 4 650 */ 651 focus(obj?: FocusParamObj): void; 652 653 /** 654 * Requests or cancels the crown rotation focus for a component. 655 * If focus is set to true, the crown event focus is requested. 656 * If focus is set to false, the crown event focus is canceled. 657 * This attribute can be defaulted to true. 658 * 659 * @param { FocusParamObj } [obj] - { focus: true | false } 660 * @syscap SystemCapability.ArkUI.ArkUI.Full 661 * @since 4 662 */ 663 rotation(obj?: FocusParamObj): void; 664 665 /** 666 * Creates and runs an animation shortcut on the component. Specify the keyframes and options required for the animation. 667 * 668 * @param { Array<AnimateStyle> } keyframes - keyframes is used to describe key frame parameters of the animation. 669 * @param { AnimateOptions } options - Options. is used to describe animation parameters. 670 * @returns { AnimationResult } This method returns the animation object. 671 * @syscap SystemCapability.ArkUI.ArkUI.Full 672 * @since 4 673 */ 674 animate(keyframes: Array<AnimateStyle>, options: AnimateOptions): AnimationResult; 675 676 /** 677 * Obtains the size and position of the element. 678 * 679 * @returns { RectObj } RectObj the size position of the element. 680 * @syscap SystemCapability.ArkUI.ArkUI.Full 681 * @since 6 682 */ 683 getBoundingClientRect(): RectObj; 684 685 /** 686 * Obtains attributes of the element. 687 * 688 * @returns { string } attributes of the element in json string. 689 * @syscap SystemCapability.ArkUI.ArkUI.Full 690 * @systemapi 691 * @since 8 692 */ 693 getInspector(): string; 694 695 /** 696 * If 0.5 is returned, 50% of the current component is visible. 697 * 698 * @param { object } param - Scope of Monitoring components. 699 * @returns { observer } 700 * @syscap SystemCapability.ArkUI.ArkUI.Full 701 * @since 6 702 */ 703 createIntersectionObserver(param: { ratios: Array<number> }): observer; 704 705 /** 706 * Adds a node to the end of the child node list of the current node. 707 * 708 * @param { Element } child - Subnode object to be added 709 * @syscap SystemCapability.ArkUI.ArkUI.Full 710 * @since 8 711 */ 712 addChild(child: Element): void; 713 714 /** 715 * Sets the value of an attribute on a specified element. If the attribute already exists, update the value. Otherwise, a new attribute is added with the specified name and value. 716 * 717 * @param { string } name - attribute name 718 * @param { string } value - attribute value¡¢ 719 * @syscap SystemCapability.ArkUI.ArkUI.Full 720 * @since 8 721 */ 722 setAttribute(name: string, value: string): void; 723 724 /** 725 * Sets a style value on a specified element. If the style exists and the style value is valid, the setting is successful. Otherwise, the setting is invalid. 726 * 727 * @param { string } name - style name 728 * @param { string } value - style value 729 * @returns { boolean } If the setting is successful, true is returned. If the setting fails, false is returned. 730 * @syscap SystemCapability.ArkUI.ArkUI.Full 731 * @since 8 732 */ 733 setStyle(name: string, value: string): boolean; 734} 735 736/** 737 * Defines the observer interface. 738 * 739 * @interface observer 740 * @syscap SystemCapability.ArkUI.ArkUI.Full 741 * @since 6 742 */ 743export interface observer { 744 /** 745 * Turn on the listener. 746 * 747 * @param { string } callback 748 * @syscap SystemCapability.ArkUI.ArkUI.Full 749 * @since 6 750 */ 751 observe(callback: string): void; 752 753 /** 754 * Turn off the listener. 755 * 756 * @syscap SystemCapability.ArkUI.ArkUI.Full 757 * @since 6 758 */ 759 unobserve(): void; 760} 761 762/** 763 * animation element 764 * 765 * @interface AnimationElement 766 * @syscap SystemCapability.ArkUI.ArkUI.Full 767 * @since 4 768 */ 769export interface AnimationElement extends Element { 770 /** 771 * Starts the animation. 772 * 773 * @syscap SystemCapability.ArkUI.ArkUI.Full 774 * @since 4 775 */ 776 play(): void; 777 /** 778 * Ends the animation. 779 * 780 * @syscap SystemCapability.ArkUI.ArkUI.Full 781 * @since 4 782 */ 783 finish(): void; 784 /** 785 * Pauses the animation. 786 * 787 * @syscap SystemCapability.ArkUI.ArkUI.Full 788 * @since 4 789 */ 790 pause(): void; 791 /** 792 * Cancels the animation. 793 * 794 * @syscap SystemCapability.ArkUI.ArkUI.Full 795 * @since 4 796 */ 797 cancel(): void; 798 /** 799 * Plays the animation in reverse direction. 800 * 801 * @syscap SystemCapability.ArkUI.ArkUI.Full 802 * @since 4 803 */ 804 reverse(): void; 805} 806 807/** 808 * ScrollParam 809 * 810 * @interface ScrollParam 811 * @syscap SystemCapability.ArkUI.ArkUI.Full 812 * @since 4 813 */ 814export interface ScrollParam { 815 /** 816 * Offset for scrolling in the horizontal direction, in px. 817 * 818 * @type { ?number } 819 * @syscap SystemCapability.ArkUI.ArkUI.Full 820 * @since 4 821 */ 822 dx?: number; 823 824 /** 825 * Offset for scrolling in the vertical direction, in px. 826 * 827 * @type { ?number } 828 * @syscap SystemCapability.ArkUI.ArkUI.Full 829 * @since 4 830 */ 831 dy?: number; 832 833 /** 834 * Whether a sliding animation is displayed when scroll position is changed. 835 * 836 * @type { ?boolean } 837 * @syscap SystemCapability.ArkUI.ArkUI.Full 838 * @since 4 839 */ 840 smooth?: boolean; 841} 842 843/** 844 * CurrentOffsetResultValue 845 * 846 * @interface CurrentOffsetResultValue 847 * @syscap SystemCapability.ArkUI.ArkUI.Full 848 * @since 4 849 */ 850export interface CurrentOffsetResultValue { 851 /** 852 * Scrolling offset in the x-axis, in px. 853 * 854 * @type { number } 855 * @syscap SystemCapability.ArkUI.ArkUI.Full 856 * @since 4 857 */ 858 x: number; 859 860 /** 861 * Scrolling offset in the y-axis, in px. 862 * 863 * @type { number } 864 * @syscap SystemCapability.ArkUI.ArkUI.Full 865 * @since 4 866 */ 867 y: number; 868} 869 870/** 871 * ListScrollToOptions 872 * 873 * @interface ListScrollToOptions 874 * @syscap SystemCapability.ArkUI.ArkUI.Full 875 * @since 4 876 */ 877export interface ListScrollToOptions { 878 /** 879 * specified position. 880 * 881 * @type { number } 882 * @syscap SystemCapability.ArkUI.ArkUI.Lite 883 * @since 4 884 */ 885 index: number; 886} 887 888/** 889 * The <list> component provides a list container. 890 * 891 * @interface ListElement 892 * @syscap SystemCapability.ArkUI.ArkUI.Full 893 * @since 4 894 */ 895export interface ListElement extends Element { 896 /** 897 * Scrolls the list to the position of the item at the specified index. 898 * 899 * @param { ListScrollToOptions } position 900 * @syscap SystemCapability.ArkUI.ArkUI.Lite 901 * @since 4 902 */ 903 scrollTo(position: ListScrollToOptions): void; 904 905 /** 906 * Scrolls the list for a certain distance. 907 * This method applies only to smart TVs. 908 * 909 * @param { ScrollParam } data 910 * @syscap SystemCapability.ArkUI.ArkUI.Full 911 * @since 4 912 */ 913 scrollBy(data: ScrollParam): void; 914 915 /** 916 * If smooth is set to false (default value), the list is directly scrolled to the top. 917 * If smooth is set to true, the list is smoothly scrolled to the top. 918 * 919 * @param { object } param 920 * @syscap SystemCapability.ArkUI.ArkUI.Full 921 * @since 4 922 */ 923 scrollTop(param: { smooth: boolean }): void; 924 925 /** 926 * If smooth is set to false (default value), the list is directly scrolled to the bottom. 927 * If smooth is set to true, the list is smoothly scrolled to the bottom. 928 * 929 * @param { object } param 930 * @syscap SystemCapability.ArkUI.ArkUI.Full 931 * @since 4 932 */ 933 scrollBottom(param: { smooth: boolean }): void; 934 935 /** 936 * If reverse is set to false (default value), the next page is displayed. If there is no next page, the list scrolls to the bottom. 937 * If reverse is set to true, the previous page is displayed. If there is no previous page, the list scrolls to the top. 938 * If smooth is set to false (default value), the list is directly scrolled to another page. 939 * If smooth is set to true, the list is smoothly scrolled to another page. 940 * 941 * @param { object } params 942 * @syscap SystemCapability.ArkUI.ArkUI.Full 943 * @since 4 944 */ 945 scrollPage(params: { reverse: boolean; smooth: boolean }): void; 946 947 /** 948 * If reverse is set to false (default value), the list scrolls towards the bottom for a certain distance. If there is no sufficient distance, the list scrolls to the bottom. 949 * If reverse is set to true, the list scrolls towards the top for a certain distance. If there is no sufficient distance, the list scrolls to the top. 950 * If smooth is set to false (default value), the list is directly scrolled. 951 * If smooth is set to true, the list is smoothly scrolled. 952 * 953 * @param { object } params 954 * @syscap SystemCapability.ArkUI.ArkUI.Full 955 * @since 4 956 */ 957 scrollArrow(params: { reverse: boolean; smooth: boolean }): void; 958 959 /** 960 * Collapses a group. 961 * 962 * @param { object } param 963 * @syscap SystemCapability.ArkUI.ArkUI.Full 964 * @since 4 965 */ 966 collapseGroup(param: { 967 /** 968 * groupid: ID of the group to collapse. 969 * All groups are collapsed when groupid is not specified. 970 * 971 * @type { string } 972 * @syscap SystemCapability.ArkUI.ArkUI.Full 973 * @since 4 974 */ 975 groupid: string; 976 }): void; 977 978 /** 979 * Expands a group. 980 * 981 * @param { object } param 982 * @syscap SystemCapability.ArkUI.ArkUI.Full 983 * @since 4 984 */ 985 expandGroup(param: { 986 /** 987 * groupid: ID of the group to expand. 988 * All groups are expanded when groupid is not specified. 989 * 990 * @type { string } 991 * @syscap SystemCapability.ArkUI.ArkUI.Full 992 * @since 4 993 */ 994 groupid: string; 995 }): void; 996 997 /** 998 * Returns the offset of the current scrolling. The return value type is Object. 999 * 1000 * @returns { CurrentOffsetResultValue } 1001 * @syscap SystemCapability.ArkUI.ArkUI.Full 1002 * @since 4 1003 */ 1004 currentOffset(): CurrentOffsetResultValue; 1005} 1006 1007/** 1008 * The <swiper> component provides a swiper container. 1009 * 1010 * @interface SwiperElement 1011 * @syscap SystemCapability.ArkUI.ArkUI.Full 1012 * @since 4 1013 */ 1014export interface SwiperElement extends Element { 1015 /** 1016 * Scrolls the child component to the position at the specified index. 1017 * 1018 * @param { object } position 1019 * @syscap SystemCapability.ArkUI.ArkUI.Full 1020 * @since 4 1021 */ 1022 swipeTo(position: { 1023 /** 1024 * specified position. 1025 * 1026 * @type { number } 1027 * @syscap SystemCapability.ArkUI.ArkUI.Full 1028 * @since 4 1029 */ 1030 index: number; 1031 }): void; 1032 1033 /** 1034 * Shows the next child component. 1035 * 1036 * @syscap SystemCapability.ArkUI.ArkUI.Full 1037 * @since 4 1038 */ 1039 showNext(): void; 1040 1041 /** 1042 * Shows the previous child component. 1043 * 1044 * @syscap SystemCapability.ArkUI.ArkUI.Full 1045 * @since 4 1046 */ 1047 showPrevious(): void; 1048} 1049 1050/** 1051 * CameraTakePhotoOptions 1052 * 1053 * @interface CameraTakePhotoOptions 1054 * @syscap SystemCapability.ArkUI.ArkUI.Full 1055 * @since 6 1056 */ 1057export interface CameraTakePhotoOptions { 1058 /** 1059 * Picture quality. 1060 * 1061 * @type { "high" | "normal" | "low" } 1062 * @syscap SystemCapability.ArkUI.ArkUI.Full 1063 * @since 6 1064 */ 1065 quality: "high" | "normal" | "low"; 1066 1067 /** 1068 * Callback function for successful interface invocation. 1069 * 1070 * @type { ?function } 1071 * @syscap SystemCapability.ArkUI.ArkUI.Full 1072 * @since 6 1073 */ 1074 success?: (result: Object) => void; 1075 1076 /** 1077 * Callback function for interface invocation failure. 1078 * 1079 * @type { ?function } 1080 * @syscap SystemCapability.ArkUI.ArkUI.Full 1081 * @since 6 1082 */ 1083 fail?: (result: Object) => void; 1084 1085 /** 1086 * Callback function at the end of the interface invoking (executed both successfully and unsuccessfully). 1087 * 1088 * @type { ?function } 1089 * @syscap SystemCapability.ArkUI.ArkUI.Full 1090 * @since 6 1091 */ 1092 complete?: (result: Object) => void; 1093} 1094 1095/** 1096 * The <camera> component provides preview and photographing functions. 1097 * 1098 * @interface CameraElement 1099 * @syscap SystemCapability.ArkUI.ArkUI.Full 1100 * @since 6 1101 */ 1102export interface CameraElement extends Element { 1103 /** 1104 * Take photos with specified parameters. 1105 * 1106 * @param { CameraTakePhotoOptions } options - the parameters of camera. 1107 * @syscap SystemCapability.ArkUI.ArkUI.Full 1108 * @since 6 1109 */ 1110 takePhoto(options: CameraTakePhotoOptions): void; 1111} 1112 1113/** 1114 * The <web> component is a container for displaying web page content. 1115 * 1116 * @interface WebElement 1117 * @syscap SystemCapability.ArkUI.ArkUI.Full 1118 * @since 6 1119 */ 1120export interface WebElement extends Element { 1121 /** 1122 * Reload the web page content 1123 * 1124 * @syscap SystemCapability.ArkUI.ArkUI.Full 1125 * @since 6 1126 */ 1127 reload(): void; 1128} 1129 1130/** 1131 * The <dialog> component is a custom pop-up container. 1132 * 1133 * @interface DialogElement 1134 * @syscap SystemCapability.ArkUI.ArkUI.Full 1135 * @since 4 1136 */ 1137export interface DialogElement extends Element { 1138 /** 1139 * Shows a dialog box. 1140 * 1141 * @syscap SystemCapability.ArkUI.ArkUI.Full 1142 * @since 4 1143 */ 1144 show(): void; 1145 /** 1146 * Closes a dialog box. 1147 * 1148 * @syscap SystemCapability.ArkUI.ArkUI.Full 1149 * @since 4 1150 */ 1151 close(): void; 1152} 1153 1154/** 1155 * The <image-animator> component is used to provide an image frame animator. 1156 * 1157 * @interface ImageAnimatorElement 1158 * @syscap SystemCapability.ArkUI.ArkUI.Lite 1159 * @since 4 1160 */ 1161export interface ImageAnimatorElement extends Element { 1162 /** 1163 * Starts to play the frame animation of an image. If this method is called again, the playback starts from the first frame. 1164 * 1165 * @syscap SystemCapability.ArkUI.ArkUI.Full 1166 * @since 4 1167 */ 1168 start(): void; 1169 /** 1170 * Pauses the frame animation playback of an image. 1171 * 1172 * @syscap SystemCapability.ArkUI.ArkUI.Full 1173 * @since 4 1174 */ 1175 pause(): void; 1176 /** 1177 * Stops the frame animation playback of an image. 1178 * 1179 * @syscap SystemCapability.ArkUI.ArkUI.Full 1180 * @since 4 1181 */ 1182 stop(): void; 1183 /** 1184 * Resumes the frame animation playback of an image. 1185 * 1186 * @syscap SystemCapability.ArkUI.ArkUI.Full 1187 * @since 4 1188 */ 1189 resume(): void; 1190 /** 1191 * Obtains the playback state. Available values are as follows: 1192 * Playing 1193 * Paused 1194 * Stopped 1195 * 1196 * @returns { "Playing" | "Paused" | "Stopped" } 1197 * @syscap SystemCapability.ArkUI.ArkUI.Full 1198 * @since 4 1199 */ 1200 getState(): "Playing" | "Paused" | "Stopped"; 1201} 1202 1203/** 1204 * The <marquee> component inserts scrolling text, which is displayed in a single line by default. 1205 * When the text length exceeds the display area of the component, the marquee effect is displayed. 1206 * 1207 * @interface MarqueeElement 1208 * @syscap SystemCapability.ArkUI.ArkUI.Full 1209 * @since 4 1210 */ 1211export interface MarqueeElement extends Element { 1212 /** 1213 * Starts scrolling. 1214 * 1215 * @syscap SystemCapability.ArkUI.ArkUI.Full 1216 * @since 4 1217 */ 1218 start(): void; 1219 1220 /** 1221 * Stops scrolling. 1222 * 1223 * @syscap SystemCapability.ArkUI.ArkUI.Full 1224 * @since 4 1225 */ 1226 stop(): void; 1227} 1228 1229/** 1230 * The <menu> component provides menus as temporary pop-up windows to display operations that can be performed by users. 1231 * 1232 * @interface MenuElement 1233 * @syscap SystemCapability.ArkUI.ArkUI.Full 1234 * @since 4 1235 */ 1236export interface MenuElement extends Element { 1237 /** 1238 * Displays the menu. 1239 * x and y specify the position of the displayed menu. 1240 * x indicates the X-axis coordinate from the left edge of the visible area, and does not include any scrolling offset. 1241 * y indicates the Y-axis coordinate from the upper edge of the visible area, and does not include any scrolling offset or a status bar. 1242 * The menu is preferentially displayed in the lower right corner. 1243 * When the visible space on the right is insufficient, the menu is moved leftward. 1244 * When the visible space in the lower part is insufficient, the menu is moved upward. 1245 * 1246 * @param { object } position 1247 * @syscap SystemCapability.ArkUI.ArkUI.Full 1248 * @since 4 1249 */ 1250 show(position: { x: number; y: number }): void; 1251} 1252 1253/** 1254 * The <chart> component displays line charts, gauge charts, and bar charts. 1255 * 1256 * @interface ChartElement 1257 * @syscap SystemCapability.ArkUI.ArkUI.Full 1258 * @since 4 1259 */ 1260export interface ChartElement extends Element { 1261 /** 1262 * Data is dynamically added to an existing data sequence. 1263 * The target sequence is specified based on serial, which is the subscript of the datasets array and starts from 0. 1264 * datasets[index].data is not updated. Only line charts support this attribute. 1265 * The value is incremented by 1 based on the horizontal coordinate and is related to the xAxis min/max setting. 1266 * 1267 * @param { object } params 1268 * @syscap SystemCapability.ArkUI.ArkUI.Full 1269 * @since 4 1270 */ 1271 append(params: { 1272 /** 1273 * Set the data subscript of the line chart to be updated. 1274 * 1275 * @type { number } 1276 * @syscap SystemCapability.ArkUI.ArkUI.Full 1277 * @since 4 1278 */ 1279 serial: number; 1280 /** 1281 * Set the new data. 1282 * 1283 * @type { Array<number> } 1284 * @syscap SystemCapability.ArkUI.ArkUI.Full 1285 * @since 4 1286 */ 1287 data: Array<number>; 1288 }): void; 1289} 1290 1291/** 1292 * The <input> component provides an interactive interface to receive user input, which is displayed in a single line by default. 1293 * 1294 * @interface InputElement 1295 * @syscap SystemCapability.ArkUI.ArkUI.Full 1296 * @since 4 1297 */ 1298export interface InputElement extends Element { 1299 /** 1300 * Obtains or loses the focus of a component. 1301 * When the component type is set to text, email, date, time, number, or password, the input method can be displayed or collapsed. 1302 * 1303 * @param { object } param - If focus is not passed, the default value true is used. 1304 * @syscap SystemCapability.ArkUI.ArkUI.Full 1305 * @since 4 1306 */ 1307 focus(param: { focus: boolean }): void; 1308 1309 /** 1310 * Displays the error message. 1311 * This attribute is available when the component type is set to text, email, date, time, number, or password. 1312 * 1313 * @param { object } param 1314 * @syscap SystemCapability.ArkUI.ArkUI.Full 1315 * @since 4 1316 */ 1317 showError(param: { error: string }): void; 1318 1319 /** 1320 * Deletes the previous character at the cursor position. 1321 * 1322 * @syscap SystemCapability.ArkUI.ArkUI.Full 1323 * @since 6 1324 */ 1325 delete(): void; 1326} 1327 1328/** 1329 * The <button> component includes capsule, circle, text, arc, and download buttons. 1330 * 1331 * @interface ButtonElement 1332 * @syscap SystemCapability.ArkUI.ArkUI.Full 1333 * @since 4 1334 */ 1335export interface ButtonElement extends Element { 1336 /** 1337 * Progress bar of the download button. 1338 * The value ranges from 0 to 100. The progress bar is displayed if the value is greater than 0. 1339 * If the value is greater than or equal to 100, the progress bar is not displayed. 1340 * NOTE 1341 * The text displayed on the progress bar is changed based on the value. 1342 * 1343 * @param { object } param 1344 * @syscap SystemCapability.ArkUI.ArkUI.Full 1345 * @since 4 1346 */ 1347 setProgress(param: { progress: number }): void; 1348} 1349 1350/** 1351 * The <textarea> component provides an interactive interface to receive user input, which is displayed in multiple lines by default. 1352 * 1353 * @interface TextAreaElement 1354 * @syscap SystemCapability.ArkUI.ArkUI.Full 1355 * @since 4 1356 */ 1357export interface TextAreaElement extends Element { 1358 /** 1359 * Obtains or loses the focus of a component, which can display or collapse the input method. 1360 * 1361 * @param { object } param - If focus is not passed, the default value true is used. 1362 * @syscap SystemCapability.ArkUI.ArkUI.Full 1363 * @since 4 1364 */ 1365 focus(param: { focus: boolean }): void; 1366} 1367 1368/** 1369 * The <picker> component supports common, date, time, and multi-column text selectors. 1370 * 1371 * @interface PickerElement 1372 * @syscap SystemCapability.ArkUI.ArkUI.Full 1373 * @since 4 1374 */ 1375export interface PickerElement extends Element { 1376 /** 1377 * Displays the picker. 1378 * 1379 * @syscap SystemCapability.ArkUI.ArkUI.Full 1380 * @since 4 1381 */ 1382 show(): void; 1383} 1384 1385/** 1386 * The <video> component provides a video player. 1387 * 1388 * @interface VideoElement 1389 * @syscap SystemCapability.ArkUI.ArkUI.Full 1390 * @since 4 1391 */ 1392export interface VideoElement extends Element { 1393 /** 1394 * Requests to start playing a video. 1395 * 1396 * @syscap SystemCapability.ArkUI.ArkUI.Full 1397 * @since 4 1398 */ 1399 start(): void; 1400 1401 /** 1402 * Requests to pause a video. 1403 * 1404 * @syscap SystemCapability.ArkUI.ArkUI.Full 1405 * @since 4 1406 */ 1407 pause(): void; 1408 1409 /** 1410 * Specifies the video playing position. 1411 * 1412 * @param { object } param 1413 * @syscap SystemCapability.ArkUI.ArkUI.Full 1414 * @since 4 1415 */ 1416 setCurrentTime(param: { currenttime: number }): void; 1417 1418 /** 1419 * Requests to enter the full screen mode. 1420 * 1421 * @param { object } param 1422 * @syscap SystemCapability.ArkUI.ArkUI.Full 1423 * @since 4 1424 */ 1425 requestFullscreen(param: { screenOrientation: "default" }): void; 1426 1427 /** 1428 * Requests to exit the full screen mode. 1429 * 1430 * @syscap SystemCapability.ArkUI.ArkUI.Full 1431 * @since 4 1432 */ 1433 exitFullscreen(): void; 1434 1435 /** 1436 * Requests to stop playing a video. 1437 * 1438 * @syscap SystemCapability.ArkUI.ArkUI.Full 1439 * @since 6 1440 */ 1441 stop(): void; 1442} 1443 1444/** 1445 * TextMetrics 1446 * 1447 * @interface TextMetrics 1448 * @syscap SystemCapability.ArkUI.ArkUI.Full 1449 * @since 4 1450 */ 1451export interface TextMetrics { 1452 /** 1453 * @type { number } 1454 * @syscap SystemCapability.ArkUI.ArkUI.Full 1455 * @since 4 1456 */ 1457 width: number; 1458 /** 1459 * @type { number } 1460 * @syscap SystemCapability.ArkUI.ArkUI.Full 1461 * @since 8 1462 */ 1463 height: number; 1464} 1465 1466/** 1467 * Provides a 2D rendering context for the drawing surface of the < Canvas > element. 1468 * It is used to draw shapes, text, images and other objects. 1469 * 1470 * @interface OffscreenCanvasRenderingContext2D 1471 * @syscap SystemCapability.ArkUI.ArkUI.Full 1472 * @since 7 1473 */ 1474export interface OffscreenCanvasRenderingContext2D { 1475 /** 1476 * Gets the dotted spacing of a line. 1477 * Returns the current line segment style array containing an even number of non-negative numbers. 1478 * 1479 * @type { Array<number> } 1480 * @syscap SystemCapability.ArkUI.ArkUI.Full 1481 * @since 7 1482 */ 1483 getLineDash: Array<number>; 1484 1485 /** 1486 * Fill style attribute. 1487 * Paint color used to fill the area. 1488 * Canvas gradient object used by the paint. You can call createLinearGradient() to create a CanvasGradient object. 1489 * Canvas pattern. You can call createPattern() to create a CanvasPattern object. 1490 * 1491 * @type { ?(string | CanvasGradient | CanvasPattern) } 1492 * @syscap SystemCapability.ArkUI.ArkUI.Full 1493 * @since 7 1494 */ 1495 fillStyle?: string | CanvasGradient | CanvasPattern; 1496 1497 /** 1498 * Sets the stroke paint style. 1499 * Color of the stroke paint. 1500 * Canvas gradient object used by the paint. You can call createLinearGradient() to create a CanvasGradient object. 1501 * Canvas pattern. You can call createPattern() to create a CanvasPattern object. 1502 * 1503 * @type { ?(string | CanvasGradient | CanvasPattern) } 1504 * @syscap SystemCapability.ArkUI.ArkUI.Full 1505 * @since 7 1506 */ 1507 strokeStyle?: string | CanvasGradient | CanvasPattern; 1508 1509 /** 1510 * Sets the dotted spacing of a line. 1511 * 1512 * @param { Array<number> } segments - A set of numbers describing the length of alternating drawn line segments and spacing (coordinate space units). 1513 * @syscap SystemCapability.ArkUI.ArkUI.Full 1514 * @since 7 1515 */ 1516 setLineDash(segments: Array<number>): void; 1517 1518 /** 1519 * Draw an Image object. 1520 * 1521 * @param { Image } image - An element drawn to the context. 1522 * @param { number } dx - The top left corner of the image is the X-axis coordinates on the target canvas. 1523 * @param { number } dy - The top left corner of the image is the Y-axis coordinates on the target canvas. 1524 * @param { number } dw - Image The width drawn on the target canvas. 1525 * @param { number } dh - Image The height drawn on the target canvas. 1526 * @syscap SystemCapability.ArkUI.ArkUI.Full 1527 * @since 7 1528 */ 1529 drawImage(image: Image, dx: number, dy: number, dw: number, dh: number): void; 1530 1531 /** 1532 * Draw an Image object. 1533 * 1534 * @param { Image } image - An element drawn to the context. 1535 * @param { number } sx - The upper-left X-axis coordinates of the image's rectangular (clipped) selection box that need to be drawn into the target context. 1536 * @param { number } sy - The upper-left Y-axis coordinates of the image's rectangular (clipped) selection box that need to be drawn into the target context. 1537 * @param { number } sw - The width of the image's rectangular (clipped) selection box that needs to be drawn into the target context. 1538 * @param { number } sh - The height of the image's rectangular (clipped) selection box that needs to be drawn into the target context. 1539 * @param { number } dx - The top left corner of the image is the X-axis coordinates on the target canvas. 1540 * @param { number } dy - The top left corner of the image is the Y-axis coordinates on the target canvas. 1541 * @param { number } dw - Image The width drawn on the target canvas. 1542 * @param { number } dh - Image The height drawn on the target canvas. 1543 * @syscap SystemCapability.ArkUI.ArkUI.Full 1544 * @since 7 1545 */ 1546 drawImage( 1547 image: Image, 1548 sx: number, 1549 sy: number, 1550 sw: number, 1551 sh: number, 1552 dx: number, 1553 dy: number, 1554 dw: number, 1555 dh: number, 1556 ): void; 1557 1558 /** 1559 * Draw an Image object. 1560 * 1561 * @param { image.PixelMap } image - An element drawn to the context. 1562 * @param { number } dx - The top left corner of the image is the X-axis coordinates on the target canvas. 1563 * @param { number } dy - The top left corner of the image is the Y-axis coordinates on the target canvas. 1564 * @param { number } dw - Image The width drawn on the target canvas. 1565 * @param { number } dh - Image The height drawn on the target canvas. 1566 * @syscap SystemCapability.ArkUI.ArkUI.Full 1567 * @since 9 1568 */ 1569 drawImage(image: image.PixelMap, dx: number, dy: number, dw: number, dh: number): void; 1570 1571 /** 1572 * Draw an Image object. 1573 * 1574 * @param { image.PixelMap } image - An element drawn to the context. 1575 * @param { number } sx - The upper-left X-axis coordinates of the image's rectangular (clipped) selection box that need to be drawn into the target context. 1576 * @param { number } sy - The upper-left Y-axis coordinates of the image's rectangular (clipped) selection box that need to be drawn into the target context. 1577 * @param { number } sw - The width of the image's rectangular (clipped) selection box that needs to be drawn into the target context. 1578 * @param { number } sh - The height of the image's rectangular (clipped) selection box that needs to be drawn into the target context. 1579 * @param { number } dx - The top left corner of the image is the X-axis coordinates on the target canvas. 1580 * @param { number } dy - The top left corner of the image is the Y-axis coordinates on the target canvas. 1581 * @param { number } dw - Image The width drawn on the target canvas. 1582 * @param { number } dh - Image The height drawn on the target canvas. 1583 * @syscap SystemCapability.ArkUI.ArkUI.Full 1584 * @since 9 1585 */ 1586 drawImage( 1587 image: image.PixelMap, 1588 sx: number, 1589 sy: number, 1590 sw: number, 1591 sh: number, 1592 dx: number, 1593 dy: number, 1594 dw: number, 1595 dh: number, 1596 ): void; 1597 1598 /** 1599 * Creates a drawing path. 1600 * 1601 * @syscap SystemCapability.ArkUI.ArkUI.Full 1602 * @since 7 1603 */ 1604 beginPath(): void; 1605 1606 /** 1607 * Crop the current canvas. 1608 * 1609 * @syscap SystemCapability.ArkUI.ArkUI.Full 1610 * @since 7 1611 */ 1612 clip(): void; 1613 1614 /** 1615 * Fills the current canvas with color. 1616 * 1617 * @syscap SystemCapability.ArkUI.ArkUI.Full 1618 * @since 7 1619 */ 1620 fill(): void; 1621 1622 /** 1623 * Check whether the specified coordinate point is on the Path. 1624 * 1625 * @param { number } x - The X coordinate of the detection point. 1626 * @param { number } y - The Y coordinate of the detection point. 1627 * @returns { boolean } boolean Return true if the detection point is contained within the current or specified path Otherwise return false. 1628 * @syscap SystemCapability.ArkUI.ArkUI.Full 1629 * @since 7 1630 */ 1631 isPointInPath(x: number, y: number): boolean; 1632 1633 /** 1634 * Check whether the specified coordinate point is on the Path. 1635 * 1636 * @param { Path2D } path - The Path2D path that needs to be populated. 1637 * @param { number } x - The X coordinate of the detection point. 1638 * @param { number } y - The Y coordinate of the detection point. 1639 * @returns { boolean } boolean Return true if the detection point is contained within the current or specified path Otherwise return false. 1640 * @syscap SystemCapability.ArkUI.ArkUI.Full 1641 * @since 7 1642 */ 1643 isPointInPath(path: Path2D, x: number, y: number): boolean; 1644 1645 /** 1646 * Checks whether the specified coordinate point is on the stroke edge. 1647 * 1648 * @param { number } x - The X coordinate of the detection point. 1649 * @param { number } y - The Y coordinate of the detection point. 1650 * @returns { boolean } boolean A Boolean value that returns true when the point is on the line of the path, false otherwise. 1651 * @syscap SystemCapability.ArkUI.ArkUI.Full 1652 * @since 7 1653 */ 1654 isPointInStroke(x: number, y: number): boolean; 1655 1656 /** 1657 * Checks whether the specified coordinate point is on the stroke edge. 1658 * 1659 * @param { Path2D } path - Path2D path. 1660 * @param { number } x - The X coordinate of the detection point. 1661 * @param { number } y - The Y coordinate of the detection point. 1662 * @returns { boolean } boolean A Boolean value that returns true when the point is on the line of the path, false otherwise. 1663 * @syscap SystemCapability.ArkUI.ArkUI.Full 1664 * @since 7 1665 */ 1666 isPointInStroke(path: Path2D, x: number, y: number): boolean; 1667 1668 /** 1669 * Stroke draws the current path. 1670 * 1671 * @syscap SystemCapability.ArkUI.ArkUI.Full 1672 * @since 7 1673 */ 1674 stroke(): void; 1675 1676 /** 1677 * Stroke draws the current path. 1678 * 1679 * @param { Path2D } path - The object of Path2D. 1680 * @syscap SystemCapability.ArkUI.ArkUI.Full 1681 * @since 7 1682 */ 1683 stroke(path: Path2D): void; 1684 1685 /** 1686 * Create a radial tween object. 1687 * 1688 * @param { number } x0 - The x coordinate of the circle at the beginning. 1689 * @param { number } y0 - The y coordinate of the circle at the beginning. 1690 * @param { number } r0 - The radius of the starting circle. 1691 * @param { number } x1 - X-coordinate of the end point. 1692 * @param { number } y1 - Y-coordinate of the end point. 1693 * @param { number } r1 - The radius of End Circle. 1694 * @returns { CanvasGradient } RadialGradient object. 1695 * @syscap SystemCapability.ArkUI.ArkUI.Full 1696 * @since 7 1697 */ 1698 createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number, r1: number): CanvasGradient; 1699 1700 /** 1701 * Create a drawing style template. 1702 * 1703 * @param { Image } image - The CanvasImageSource object that is the source of the duplicate image. 1704 * @param { string } repetition - Specify how to repeat images. 1705 * @returns { CanvasPattern } CanvasPattern An opaque object that describes a schema. 1706 * @syscap SystemCapability.ArkUI.ArkUI.Full 1707 * @since 7 1708 */ 1709 createPattern(image: Image, repetition: string): CanvasPattern; 1710 1711 /** 1712 * Creates a linear gradient color. 1713 * 1714 * @param { number } x0 - X-coordinate of the start point. 1715 * @param { number } y0 - Y-coordinate of the start point. 1716 * @param { number } x1 - X-coordinate of the end point. 1717 * @param { number } y1 - Y-coordinate of the end point. 1718 * @returns { CanvasGradient } LinearGradient object. 1719 * @syscap SystemCapability.ArkUI.ArkUI.Full 1720 * @since 7 1721 */ 1722 createLinearGradient(x0: number, y0: number, x1: number, y1: number): CanvasGradient; 1723 1724 /** 1725 * Create an ImageData object. 1726 * 1727 * @param { number } sw - The width of the new object. 1728 * @param { number } sh - The height of the new object. 1729 * @returns { ImageData } ImageData New ImageData object with width and height specified. 1730 * @syscap SystemCapability.ArkUI.ArkUI.Full 1731 * @since 7 1732 */ 1733 createImageData(sw: number, sh: number): ImageData; 1734 1735 /** 1736 * Create an ImageData object. 1737 * 1738 * @param { ImageData } imagedata - Copy an object of the same width and height from an existing ImageData object 1739 * The image itself is not allowed to be copied. 1740 * @returns { ImageData } ImageData New ImageData object with width and height specified. 1741 * @syscap SystemCapability.ArkUI.ArkUI.Full 1742 * @since 7 1743 */ 1744 createImageData(imagedata: ImageData): ImageData; 1745 1746 /** 1747 * Creates a path that is later used by the CanvasRenderingContext2D object. 1748 * 1749 * @param { Path2D } [path] - another created Path2D object. 1750 * @returns { Path2D } the object of Path2D. 1751 * @syscap SystemCapability.ArkUI.ArkUI.Full 1752 * @since 7 1753 */ 1754 createPath2D(path?: Path2D): Path2D; 1755 1756 /** 1757 * Creates a path that is later used by the CanvasRenderingContext2D object. 1758 * 1759 * @param { string } [cmds] - a string defined using the SVG path command. 1760 * @returns { Path2D } the object of Path2D. 1761 * @syscap SystemCapability.ArkUI.ArkUI.Full 1762 * @since 7 1763 */ 1764 createPath2D(cmds?: string): Path2D; 1765 1766 /** 1767 * Get an ImageData object. 1768 * 1769 * @param { number } sx - The upper-left x-coordinate of the rectangular area of the image data to be extracted. 1770 * @param { number } sy - The upper-left y coordinate of the rectangular region of the image data to be extracted. 1771 * @param { number } sw - The width of the rectangular area of the image data to be extracted. 1772 * @param { number } sh - The height of the rectangular area of the image data to be extracted. 1773 * @returns { ImageData } ImageData An ImageData object that contains the rectangular ImageData given by the canvas. 1774 * @syscap SystemCapability.ArkUI.ArkUI.Full 1775 * @since 7 1776 */ 1777 getImageData(sx: number, sy: number, sw: number, sh: number): ImageData; 1778 1779 /** 1780 * Get an PixelMap object. 1781 * 1782 * @param { number } sx - The upper-left x-coordinate of the rectangular area of the image data to be extracted. 1783 * @param { number } sy - The upper-left y coordinate of the rectangular region of the image data to be extracted. 1784 * @param { number } sw - The width of the rectangular area of the image data to be extracted. 1785 * @param { number } sh - The height of the rectangular area of the image data to be extracted. 1786 * @returns { image.PixelMap } PixelMap A PixelMap object that contains the rectangular ImageData given by the canvas. 1787 * @syscap SystemCapability.ArkUI.ArkUI.Full 1788 * @since 9 1789 */ 1790 getPixelMap(sx: number, sy: number, sw: number, sh: number): image.PixelMap 1791 1792 /** 1793 * Draws the specified ImageData object to the canvas. 1794 * 1795 * @param { ImageData } imagedata - An array object containing pixel values. 1796 * @param { number } dx - The offset of the position of the source image data in the target canvas (the offset in the X-axis direction). 1797 * @param { number } dy - The offset of the position of the source image data in the target canvas (the Y-axis offset). 1798 * @syscap SystemCapability.ArkUI.ArkUI.Full 1799 * @since 7 1800 */ 1801 putImageData(imagedata: ImageData, dx: number, dy: number): void; 1802 1803 /** 1804 * Draws the specified ImageData object to the canvas. 1805 * 1806 * @param { ImageData } imagedata - An array object containing pixel values. 1807 * @param { number } dx - The offset of the position of the source image data in the target canvas (the offset in the X-axis direction). 1808 * @param { number } dy - he offset of the position of the source image data in the target canvas (the Y-axis offset). 1809 * @param { number } dirtyX - In the source image data, 1810 * the position of the upper left corner of the rectangular region Default is the upper left corner of the entire image data (x coordinate). 1811 * @param { number } dirtyY - In the source image data, 1812 * the position of the upper left corner of the rectangular region Default is the top left corner (y coordinate) of the entire image data. 1813 * @param { number } dirtyWidth - In the source image data, the width of a rectangular region. Default is the width of the image data. 1814 * @param { number } dirtyHeight - In the source image data, the height of a rectangular region. Default is the height of the image data. 1815 * @syscap SystemCapability.ArkUI.ArkUI.Full 1816 * @since 7 1817 */ 1818 putImageData( 1819 imagedata: ImageData, 1820 dx: number, 1821 dy: number, 1822 dirtyX: number, 1823 dirtyY: number, 1824 dirtyWidth: number, 1825 dirtyHeight: number, 1826 ): void; 1827 1828 /** 1829 * Draw an arc. 1830 * 1831 * @param { number } radius - Radius of an arc. 1832 * @param { number } x - The X-axis coordinates of the center of the circle. 1833 * @param { number } y - The Y-axis coordinates of the center of an arc (center of a circle). 1834 * @param { number } startAngle - The starting point of the arc, in the X-axis direction, is calculated in radians. 1835 * @param { number } endAngle - The end point of an arc, expressed in radians. 1836 * @param { boolean } [anticlockwise] - An optional Boolean value. If true, the arc is drawn counterclockwise, and otherwise clockwise. 1837 * @syscap SystemCapability.ArkUI.ArkUI.Full 1838 * @since 7 1839 */ 1840 arc(radius: number, x: number, y: number, startAngle: number, endAngle: number, anticlockwise?: boolean): void; 1841 1842 /** 1843 * Draws an arc from the beginning to the end. 1844 * 1845 * @param { number } x1 - The X-axis coordinates of the first control point. 1846 * @param { number } x2 - The X-axis coordinates of the second control point. 1847 * @param { number } y1 - The y-coordinate of the first control point. 1848 * @param { number } y2 - The Y-axis coordinates of the second control point. 1849 * @param { number } radius - Radius of an arc. 1850 * @syscap SystemCapability.ArkUI.ArkUI.Full 1851 * @since 7 1852 */ 1853 arcTo(x1: number, x2: number, y1: number, y2: number, radius: number): void; 1854 1855 /** 1856 * Draw a third order Bezier curve. 1857 * 1858 * @param { number } cp1x - The X-axis coordinates of the first control point. 1859 * @param { number } cp1y - The y-coordinate of the first control point. 1860 * @param { number } cp2x - The X-axis coordinates of the second control point. 1861 * @param { number } cp2y - The Y-axis coordinates of the second control point. 1862 * @param { number } x - The x-coordinate of the end point. 1863 * @param { number } y - The y-coordinate of the end point 1864 * @syscap SystemCapability.ArkUI.ArkUI.Full 1865 * @since 7 1866 */ 1867 bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void; 1868 1869 /** 1870 * Closing the current path. 1871 * 1872 * @syscap SystemCapability.ArkUI.ArkUI.Full 1873 * @since 7 1874 */ 1875 closePath(): void; 1876 1877 /** 1878 * Draw a straight line. 1879 * 1880 * @param { number } x - The X-axis coordinates at the end of the line. 1881 * @param { number } y - The Y-axis coordinates at the end of the line. 1882 * @syscap SystemCapability.ArkUI.ArkUI.Full 1883 * @since 7 1884 */ 1885 lineTo(x: number, y: number): void; 1886 1887 /** 1888 * Draw an ellipse. 1889 * 1890 * @param { number } x - The X-axis coordinates of the center of the ellipse. 1891 * @param { number } y - The Y-axis coordinates of the center of the ellipse. 1892 * @param { number } radiusX - The radius of the major axis of an ellipse. 1893 * @param { number } radiusY - The radius of the short axis of an ellipse. 1894 * @param { number } rotation - The Angle of rotation of an ellipse, expressed in radians. 1895 * @param { number } startAngle - The starting point Angle to be plotted, measured from the X-axis, is expressed in radians. 1896 * @param { number } endAngle - The Angle, expressed in radians, at which the ellipse will be drawn. 1897 * @param { boolean } [anticlockwise] - If true, the ellipse is drawn counterclockwise (counterclockwise) and clockwise otherwise. 1898 * @syscap SystemCapability.ArkUI.ArkUI.Full 1899 * @since 7 1900 */ 1901 ellipse( 1902 x: number, 1903 y: number, 1904 radiusX: number, 1905 radiusY: number, 1906 rotation: number, 1907 startAngle: number, 1908 endAngle: number, 1909 anticlockwise?: boolean, 1910 ): void; 1911 1912 /** 1913 * Moves the current canvas to the specified coordinate point. 1914 * 1915 * @param { number } x - The x axis. 1916 * @param { number } y - The y axis. 1917 * @syscap SystemCapability.ArkUI.ArkUI.Full 1918 * @since 7 1919 */ 1920 moveTo(x: number, y: number): void; 1921 1922 /** 1923 * Draw a second order Bezier curve. 1924 * 1925 * @param { number } cpx - The X-axis coordinates of the control points. 1926 * @param { number } cpy - The y-coordinate of the control point. 1927 * @param { number } x - The X-axis of the end point. 1928 * @param { number } y - The Y-axis of the end point. 1929 * @syscap SystemCapability.ArkUI.ArkUI.Full 1930 * @since 7 1931 */ 1932 quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void; 1933 1934 /** 1935 * Draw a rectangle. 1936 * 1937 * @param { number } x - The X-axis coordinates at the beginning of the rectangle. 1938 * @param { number } y - The Y-axis coordinates at the beginning of the rectangle. 1939 * @param { number } w - The width of a rectangle. 1940 * @param { number } h - The height of a rectangle. 1941 * @syscap SystemCapability.ArkUI.ArkUI.Full 1942 * @since 7 1943 */ 1944 rect(x: number, y: number, w: number, h: number): void; 1945 1946 /** 1947 * Clears the contents of the specified rectangular area. 1948 * 1949 * @param { number } x - The X-axis coordinates at the beginning of the rectangle. 1950 * @param { number } y - The Y-axis coordinates at the beginning of the rectangle. 1951 * @param { number } w - The width of a rectangle. 1952 * @param { number } h - The height of a rectangle. 1953 * @syscap SystemCapability.ArkUI.ArkUI.Full 1954 * @since 7 1955 */ 1956 clearRect(x: number, y: number, w: number, h: number): void; 1957 1958 /** 1959 * Fills a rectangular area. 1960 * 1961 * @param { number } x - The X-axis coordinates at the beginning of the rectangle. 1962 * @param { number } y - The Y-axis coordinates at the beginning of the rectangle. 1963 * @param { number } w - The width of a rectangle. 1964 * @param { number } h - The height of a rectangle. 1965 * @syscap SystemCapability.ArkUI.ArkUI.Full 1966 * @since 7 1967 */ 1968 fillRect(x: number, y: number, w: number, h: number): void; 1969 1970 /** 1971 * Stroke a rectangular area. 1972 * 1973 * @param { number } x - The X-axis coordinates at the beginning of the rectangle. 1974 * @param { number } y - The Y-axis coordinates at the beginning of the rectangle. 1975 * @param { number } w - The width of the rectangle. Positive values on the right, negative values on the left. 1976 * @param { number } h - The height of the rectangle. Positive values are down, negative values are up. 1977 * @syscap SystemCapability.ArkUI.ArkUI.Full 1978 * @since 7 1979 */ 1980 strokeRect(x: number, y: number, w: number, h: number): void; 1981 1982 /** 1983 * Stroke a rectangular area. 1984 * 1985 * @param { string } text - Render text using the current values of font, textAlign, textBaseline, and direction. 1986 * @param { number } y - The Y-axis coordinates of the starting point of the text. 1987 * @param { number } x - The X-axis coordinates of the starting point of the text. 1988 * @syscap SystemCapability.ArkUI.ArkUI.Full 1989 * @since 7 1990 */ 1991 fillText(text: string, y: number, x: number /*, maxWidth?: number*/): void; 1992 1993 /** 1994 * Returns a TextMetrics object used to obtain the width of specified text. 1995 * 1996 * @param { string } text - Text to be measured. 1997 * @returns { TextMetrics } Object that contains the text width. You can obtain the width by TextMetrics.width. 1998 * @syscap SystemCapability.ArkUI.ArkUI.Full 1999 * @since 7 2000 */ 2001 measureText(text: string): TextMetrics; 2002 2003 /** 2004 * Draws the stroke of a text string. 2005 * 2006 * @param { string } text - Text stroke to draw. 2007 * @param { number } x - X-coordinate of the lower left corner of the text stroke. 2008 * @param { number } y - Y-coordinate of the lower left corner of the text stroke. 2009 * @syscap SystemCapability.ArkUI.ArkUI.Full 2010 * @since 7 2011 */ 2012 strokeText(text: string, x: number, y: number /*, maxWidth?: number*/): void; 2013 2014 /** 2015 * Resets the current matrix transformation effect. 2016 * 2017 * @syscap SystemCapability.ArkUI.ArkUI.Full 2018 * @since 7 2019 */ 2020 resetTransform(): void; 2021 2022 /** 2023 * Adds a rotation effect to the current canvas. 2024 * 2025 * @param { number } angle - The radian of clockwise rotation. 2026 * @syscap SystemCapability.ArkUI.ArkUI.Full 2027 * @since 7 2028 */ 2029 rotate(angle: number): void; 2030 2031 /** 2032 * Adds a zoom effect to the current canvas. 2033 * 2034 * @param { number } x - The horizontal scaling factor. 2035 * @param { number } y - The scaling factor in the vertical direction. 2036 * @syscap SystemCapability.ArkUI.ArkUI.Full 2037 * @since 7 2038 */ 2039 scale(x: number, y: number): void; 2040 2041 /** 2042 * Set the rotation, pan, and zoom effects. 2043 * 2044 * @param { number } a - The level of zoom. 2045 * @param { number } b - Vertical tilt. 2046 * @param { number } c - Horizontal tilt. 2047 * @param { number } d - Vertical scaling. 2048 * @param { number } e - The level of mobile. 2049 * @param { number } f - Vertical movement. 2050 * @syscap SystemCapability.ArkUI.ArkUI.Full 2051 * @since 7 2052 */ 2053 setTransform(a: number, b: number, c: number, d: number, e: number, f: number): void; 2054 2055 /** 2056 * Set the rotation, pan, and zoom effects. 2057 * 2058 * @param { number } a - The level of zoom. 2059 * @param { number } b - Vertical tilt. 2060 * @param { number } c - Horizontal tilt. 2061 * @param { number } d - Vertical scaling. 2062 * @param { number } e - The level of mobile. 2063 * @param { number } f - Vertical movement. 2064 * @syscap SystemCapability.ArkUI.ArkUI.Full 2065 * @since 7 2066 */ 2067 transform(a: number, b: number, c: number, d: number, e: number, f: number): void; 2068 2069 /** 2070 * Adds a pan effect to the current canvas. 2071 * 2072 * @param { number } x - Horizontal movement distance. 2073 * @param { number } y - Vertical movement. 2074 * @syscap SystemCapability.ArkUI.ArkUI.Full 2075 * @since 7 2076 */ 2077 translate(x: number, y: number): void; 2078 2079 /** 2080 * Restores the configuration information of the last saved canvas context. 2081 * 2082 * @syscap SystemCapability.ArkUI.ArkUI.Full 2083 * @since 7 2084 */ 2085 restore(): void; 2086 2087 /** 2088 * Saves configuration information for the current canvas context. 2089 * 2090 * @syscap SystemCapability.ArkUI.ArkUI.Full 2091 * @since 7 2092 */ 2093 save(): void; 2094} 2095 2096/** 2097 * CanvasRenderingContext2D allows you to draw rectangles, text, images, and other objects on a canvas. 2098 * You can call getContext('2d') on canvas to obtain a CanvasRenderingContext2D object. 2099 * 2100 * @interface CanvasRenderingContext2D 2101 * @syscap SystemCapability.ArkUI.ArkUI.Full 2102 * @since 4 2103 */ 2104export interface CanvasRenderingContext2D { 2105 /** 2106 * Fills a rectangle on the canvas. 2107 * 2108 * @param { number } x - X-coordinate of the upper left corner of the rectangle. 2109 * @param { number } y - Y-coordinate of the upper left corner of the rectangle. 2110 * @param { number } width - Width of the rectangle. 2111 * @param { number } height - Height of the rectangle. 2112 * @syscap SystemCapability.ArkUI.ArkUI.Full 2113 * @since 4 2114 */ 2115 fillRect(x: number, y: number, width: number, height: number): void; 2116 2117 /** 2118 * Sets the style of a paint to fill an area. 2119 * Paint color used to fill the area. 2120 * Canvas gradient object used by the paint. You can call createLinearGradient() to create a CanvasGradient object. 2121 * Canvas pattern. You can call createPattern() to create a CanvasPattern object. 2122 * 2123 * @type { ?(string | CanvasGradient | CanvasPattern) } 2124 * @syscap SystemCapability.ArkUI.ArkUI.Full 2125 * @since 4 2126 */ 2127 fillStyle?: string | CanvasGradient | CanvasPattern; 2128 2129 /** 2130 * Clears the content in a rectangle on the canvas. 2131 * 2132 * @param { number } x - X-coordinate of the upper left corner of the rectangle. 2133 * @param { number } y - Y-coordinate of the upper left corner of the rectangle. 2134 * @param { number } width - Width of the rectangle. 2135 * @param { number } height - Height of the rectangle. 2136 * @syscap SystemCapability.ArkUI.ArkUI.Full 2137 * @since 4 2138 */ 2139 clearRect(x: number, y: number, width: number, height: number): void; 2140 2141 /** 2142 * Draws a rectangle stroke on the canvas. 2143 * 2144 * @param { number } x - X-coordinate of the upper left corner of the rectangle stroke. 2145 * @param { number } y - Y-coordinate of the upper left corner of the rectangle stroke. 2146 * @param { number } width - Width of the rectangle stroke. 2147 * @param { number } height - Height of the rectangle stroke. 2148 * @syscap SystemCapability.ArkUI.ArkUI.Full 2149 * @since 4 2150 */ 2151 strokeRect(x: number, y: number, width: number, height: number): void; 2152 2153 /** 2154 * Draws filled text on the canvas. 2155 * 2156 * @param { string } text - Text to draw. 2157 * @param { number } x - X-coordinate of the lower left corner of the text. 2158 * @param { number } y - Y-coordinate of the lower left corner of the text. 2159 * @syscap SystemCapability.ArkUI.ArkUI.Full 2160 * @since 4 2161 */ 2162 fillText(text: string, x: number, y: number): void; 2163 2164 /** 2165 * Draws a text stroke on the canvas. 2166 * 2167 * @param { string } text - Text stroke to draw. 2168 * @param { number } x - X-coordinate of the lower left corner of the text stroke. 2169 * @param { number } y - Y-coordinate of the lower left corner of the text stroke. 2170 * @syscap SystemCapability.ArkUI.ArkUI.Full 2171 * @since 4 2172 */ 2173 strokeText(text: string, x: number, y: number): void; 2174 2175 /** 2176 * Returns a TextMetrics object used to obtain the width of specified text. 2177 * 2178 * @param { string } text - Text to be measured. 2179 * @returns { TextMetrics } Object that contains the text width. You can obtain the width by TextMetrics.width. 2180 * @syscap SystemCapability.ArkUI.ArkUI.Full 2181 * @since 4 2182 */ 2183 measureText(text: string): TextMetrics; 2184 2185 /** 2186 * Sets the width of a line. 2187 * 2188 * @type { ?number } 2189 * @syscap SystemCapability.ArkUI.ArkUI.Full 2190 * @since 4 2191 */ 2192 lineWidth?: number; 2193 2194 /** 2195 * Sets the stroke paint style. 2196 * Color of the stroke paint. 2197 * Canvas gradient object used by the paint. You can call createLinearGradient() to create a CanvasGradient object. 2198 * Canvas pattern. You can call createPattern() to create a CanvasPattern object. 2199 * 2200 * @type { ?(string | CanvasGradient | CanvasPattern) } 2201 * @syscap SystemCapability.ArkUI.ArkUI.Full 2202 * @since 4 2203 */ 2204 strokeStyle?: string | CanvasGradient | CanvasPattern; 2205 2206 /** 2207 * Draws a border stroke. 2208 * 2209 * @syscap SystemCapability.ArkUI.ArkUI.Full 2210 * @since 4 2211 */ 2212 stroke(): void; 2213 2214 /** 2215 * Draws a path stroke. 2216 * 2217 * @param { Path2D } path - The object of Path2D. 2218 * @syscap SystemCapability.ArkUI.ArkUI.Full 2219 * @since 4 2220 */ 2221 stroke(path: Path2D): void; 2222 2223 /** 2224 * Creates a drawing path. 2225 * 2226 * @syscap SystemCapability.ArkUI.ArkUI.Full 2227 * @since 4 2228 */ 2229 beginPath(): void; 2230 2231 /** 2232 * Moves a drawing path to a target position on the canvas. 2233 * 2234 * @param { number } x - X-coordinate of the target position. 2235 * @param { number } y - Y-coordinate of the target position. 2236 * @syscap SystemCapability.ArkUI.ArkUI.Full 2237 * @since 4 2238 */ 2239 moveTo(x: number, y: number): void; 2240 2241 /** 2242 * Connects the current point to a target position using a straight line. 2243 * 2244 * @param { number } x - X-coordinate of the target position. 2245 * @param { number } y - Y-coordinate of the target position. 2246 * @syscap SystemCapability.ArkUI.ArkUI.Full 2247 * @since 4 2248 */ 2249 lineTo(x: number, y: number): void; 2250 2251 /** 2252 * Draws a closed path. 2253 * 2254 * @syscap SystemCapability.ArkUI.ArkUI.Full 2255 * @since 4 2256 */ 2257 closePath(): void; 2258 2259 /** 2260 * Sets the style of line endpoints. 2261 * Style of line endpoints. Available values include: 2262 * butt (default): The endpoints of the line are in square. 2263 * round: The endpoints of the line are rounded. 2264 * square: The endpoints of the line are in square, 2265 * and each end of the line is added with a rectangle whose length is the same as the line thickness and whose width is half of the line thickness. 2266 * 2267 * @type { string } 2268 * @syscap SystemCapability.ArkUI.ArkUI.Full 2269 * @since 4 2270 */ 2271 lineCap: string; 2272 2273 /** 2274 * Sets the style for an intersection point where a line joins another. 2275 * Style of the intersection point of lines. Available values include: 2276 * round: The intersection part is a sector. The radius of a rounded corner is equal to the line width. 2277 * bevel: The intersection part is a triangle. The rectangular corner of each line is independent. 2278 * miter (default): The intersection part has a miter corner by extending the outside edges of the lines until they meet. 2279 * You can view the effect of this attribute in miterLimit. 2280 * 2281 * @type { string } 2282 * @syscap SystemCapability.ArkUI.ArkUI.Full 2283 * @since 4 2284 */ 2285 lineJoin: string; 2286 2287 /** 2288 * Sets the maximum miter length. The miter length is the distance between the inner corner and the outer corner where two lines meet. 2289 * Maximum miter length. The default value is 10. 2290 * 2291 * @type { number } 2292 * @syscap SystemCapability.ArkUI.ArkUI.Full 2293 * @since 4 2294 */ 2295 miterLimit: number; 2296 2297 /** 2298 * Sets the font style. 2299 * Font style. 2300 * The default value is 10px sans-serif in tv, phone, tablet, wearable. 2301 * The default value is 30px SourceHanSansSC-Regular in smartVision. 2302 * 2303 * @type { string } 2304 * @syscap SystemCapability.ArkUI.ArkUI.Full 2305 * @since 4 2306 */ 2307 font: string; 2308 2309 /** 2310 * Sets the text alignment mode. 2311 * Text alignment mode. Available values include: 2312 * left (default): The text is left-aligned. 2313 * right: The text is right-aligned. 2314 * center: The text is center-aligned. 2315 * start: The text is aligned with the start bound. Can't be supported by smartVision. 2316 * end: The text is aligned with the end bound. Can't be supported by smartVision. 2317 * NOTE 2318 * In the ltr layout mode, the value start equals to left. In the rtl layout mode, the value start equals to right. 2319 * 2320 * @type { "left" | "right" | "center" | "start" | "end" } 2321 * @syscap SystemCapability.ArkUI.ArkUI.Full 2322 * @since 4 2323 */ 2324 textAlign: "left" | "right" | "center" | "start" | "end"; 2325 2326 /** 2327 * Sets whether an image is smooth. 2328 * default value is true. 2329 * 2330 * @type { boolean } 2331 * @syscap SystemCapability.ArkUI.ArkUI.Full 2332 * @since 4 2333 */ 2334 imageSmoothingEnabled: boolean; 2335 2336 /** 2337 * Sets a text baseline in the horizontal direction for text alignment. 2338 * Text baseline. Available values include: 2339 * alphabetic (default): The text baseline is the normal alphabetic baseline. 2340 * top: The text baseline is on the top of the text bounding box. 2341 * hanging: The text baseline is a hanging baseline over the text. 2342 * middle: The text baseline is in the middle of the text bounding box. 2343 * ideographic: The text baseline is the ideographic baseline. If a character exceeds the alphabetic baseline, 2344 * the ideographic baseline is located at the bottom of the excessive character. 2345 * bottom: The text baseline is at the bottom of the text bounding box. 2346 * Its difference from the ideographic baseline is that the ideographic baseline does not consider letters in the next line. 2347 * 2348 * @type { string } 2349 * @syscap SystemCapability.ArkUI.ArkUI.Full 2350 * @since 4 2351 */ 2352 textBaseline: string; 2353 2354 /** 2355 * Creates a linear gradient color. 2356 * 2357 * @param { number } x0 - X-coordinate of the start point. 2358 * @param { number } y0 - Y-coordinate of the start point. 2359 * @param { number } x1 - X-coordinate of the end point. 2360 * @param { number } y1 - Y-coordinate of the end point. 2361 * @returns { CanvasGradient } LinearGradient object. 2362 * @syscap SystemCapability.ArkUI.ArkUI.Full 2363 * @since 6 2364 */ 2365 createLinearGradient(x0: number, y0: number, x1: number, y1: number): CanvasGradient; 2366 2367 /** 2368 * Creates a radial gradient color. 2369 * 2370 * @param { number } x0 - X-coordinate of the start point. 2371 * @param { number } y0 - Y-coordinate of the start point. 2372 * @param { number } r0 - The radius of the starting circle. 2373 * @param { number } x1 - X-coordinate of the end point. 2374 * @param { number } y1 - Y-coordinate of the end point. 2375 * @param { number } r1 - The radius of End Circle. 2376 * @returns { CanvasGradient } RadialGradient object. 2377 * @syscap SystemCapability.ArkUI.ArkUI.Full 2378 * @since 6 2379 */ 2380 createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number, r1: number): CanvasGradient; 2381 2382 /** 2383 * Creates a pattern for image filling based on a specified source image and repetition mode. 2384 * 2385 * @param { Image } image - Source image. 2386 * @param { string } repetition - Repetition mode. The value can be "repeat", "repeat-x", "repeat-y", or "no-repeat". 2387 * @returns { object } Pattern of image filling. 2388 * @syscap SystemCapability.ArkUI.ArkUI.Full 2389 * @since 4 2390 */ 2391 createPattern(image: Image, repetition: string): object; 2392 2393 /** 2394 * Creates a path that is later used by the CanvasRenderingContext2D object. 2395 * 2396 * @param { Path2D } [path] - another created Path2D object. 2397 * @returns { Path2D } the object of Path2D. 2398 * @syscap SystemCapability.ArkUI.ArkUI.Full 2399 * @since 4 2400 */ 2401 createPath2D(path?: Path2D): Path2D; 2402 2403 /** 2404 * Creates a path that is later used by the CanvasRenderingContext2D object. 2405 * 2406 * @param { string } [cmds] - a string defined using the SVG path command. 2407 * @returns { Path2D } the object of Path2D. 2408 * @syscap SystemCapability.ArkUI.ArkUI.Full 2409 * @since 4 2410 */ 2411 createPath2D(cmds?: string): Path2D; 2412 2413 /** 2414 * Draws a cubic bezier curve on the canvas. 2415 * 2416 * @param { number } cp1x - X-coordinate of the first parameter of the bezier curve. 2417 * @param { number } cp1y - Y-coordinate of the first parameter of the bezier curve. 2418 * @param { number } cp2x - X-coordinate of the second parameter of the bezier curve. 2419 * @param { number } cp2y - Y-coordinate of the second parameter of the bezier curve. 2420 * @param { number } x - End point x-coordinate of the bezier curve. 2421 * @param { number } y - End point y-coordinate of the bezier curve. 2422 * @syscap SystemCapability.ArkUI.ArkUI.Full 2423 * @since 4 2424 */ 2425 bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void; 2426 2427 /** 2428 * Draws a quadratic curve on the canvas. 2429 * 2430 * @param { number } cpx - X-coordinate of the bezier curve parameter. 2431 * @param { number } cpy - Y-coordinate of the bezier curve parameter. 2432 * @param { number } x - End point x-coordinate of the bezier curve. 2433 * @param { number } y - End point y-coordinate of the bezier curve. 2434 * @syscap SystemCapability.ArkUI.ArkUI.Full 2435 * @since 4 2436 */ 2437 quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void; 2438 2439 /** 2440 * Draws an arc on the canvas. 2441 * 2442 * @param { number } x - X-coordinate of the center point of the arc. 2443 * @param { number } y - Y-coordinate of the center point of the arc. 2444 * @param { number } radius - Radius of the arc. 2445 * @param { number } startAngle - Start radian of the arc. 2446 * @param { number } endAngel - End radian of the arc. 2447 * @param { boolean } [anticlockwise] - Whether to draw the arc counterclockwise. 2448 * @syscap SystemCapability.ArkUI.ArkUI.Full 2449 * @since 4 2450 */ 2451 arc(x: number, y: number, radius: number, startAngle: number, endAngel: number, anticlockwise?: boolean): void; 2452 2453 /** 2454 * Draws an arc based on the radius and points on the arc. 2455 * 2456 * @param { number } x1 - X-coordinate of the first point on the arc. 2457 * @param { number } y1 - Y-coordinate of the first point on the arc. 2458 * @param { number } x2 - X-coordinate of the second point on the arc. 2459 * @param { number } y2 - Y-coordinate of the second point on the arc. 2460 * @param { number } radius - Radius of the arc. 2461 * @syscap SystemCapability.ArkUI.ArkUI.Full 2462 * @since 4 2463 */ 2464 arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void; 2465 2466 /** 2467 * Draws an ellipse based on the coordinate and radius. 2468 * 2469 * @param { number } x - X-coordinate of the center point on the ellipse. 2470 * @param { number } y - Y-coordinate of the center point on the ellipse. 2471 * @param { number } radiusX - X-coordinate of the radius Length on the ellipse. 2472 * @param { number } radiusY - Y-coordinate of the radius Length on the ellipse. 2473 * @param { number } rotation - The rotation angle of the ellipse, in radians. 2474 * @param { number } startAngle - Angle of the start point for ellipse drawing. 2475 * @param { number } endAngle - End Point Angle for Ellipse Drawing. 2476 * @param { number } anticlockwise - Indicates whether to draw an ellipse counterclockwise. 2477 * 0: clockwise; 1: counterclockwise. The default value is 0. 2478 * @syscap SystemCapability.ArkUI.ArkUI.Full 2479 * @since 4 2480 */ 2481 ellipse( 2482 x: number, 2483 y: number, 2484 radiusX: number, 2485 radiusY: number, 2486 rotation: number, 2487 startAngle: number, 2488 endAngle: number, 2489 anticlockwise?: number, 2490 ): void; 2491 2492 /** 2493 * Creates a rectangular. 2494 * 2495 * @param { number } x - X-coordinate of the upper left corner of the rectangle. 2496 * @param { number } y - Y-coordinate of the upper left corner of the rectangle. 2497 * @param { number } width - Width of the rectangle. 2498 * @param { number } height - Height of the rectangle. 2499 * @syscap SystemCapability.ArkUI.ArkUI.Full 2500 * @since 4 2501 */ 2502 rect(x: number, y: number, width: number, height: number): void; 2503 2504 /** 2505 * Fills the area inside a closed path. 2506 * 2507 * @syscap SystemCapability.ArkUI.ArkUI.Full 2508 * @since 4 2509 */ 2510 fill(): void; 2511 2512 /** 2513 * Sets a path as the clipping path. 2514 * 2515 * @syscap SystemCapability.ArkUI.ArkUI.Full 2516 * @since 4 2517 */ 2518 clip(): void; 2519 2520 /** 2521 * Rotates a canvas clockwise around its coordinate axes. 2522 * 2523 * @param { number } rotate - Clockwise rotation angle. You can use Math.PI / 180 to convert the angle to radian. 2524 * @syscap SystemCapability.ArkUI.ArkUI.Full 2525 * @since 4 2526 */ 2527 rotate(rotate: number): void; 2528 2529 /** 2530 * Scales a canvas based on scaling factors. 2531 * 2532 * @param { number } x - Horizontal scale factor. 2533 * @param { number } y - Vertical scale factor. 2534 * @syscap SystemCapability.ArkUI.ArkUI.Full 2535 * @since 4 2536 */ 2537 scale(x: number, y: number): void; 2538 2539 /** 2540 * Defines a transformation matrix. 2541 * To transform a graph, you only need to set parameters of the matrix. 2542 * The coordinates of the corresponding graph are multiplied by the matrix values to obtain new coordinates of the transformed graph. 2543 * You can use the matrix to implement multiple transform effects. 2544 * 2545 * @param { number } scaleX - X-axis scale. 2546 * @param { number } skewX - X-axis skew. 2547 * @param { number } skewY - Y-axis skew. 2548 * @param { number } scaleY - Y-axis scale. 2549 * @param { number } translateX - X-axis translation. 2550 * @param { number } translateY - Y-axis translation. 2551 * @syscap SystemCapability.ArkUI.ArkUI.Full 2552 * @since 4 2553 */ 2554 transform(scaleX: number, skewX: number, skewY: number, scaleY: number, translateX: number, translateY: number): void; 2555 2556 /** 2557 * Uses same parameters as the transform() function to reset the existing transformation matrix and create a new transformation matrix. 2558 * 2559 * @param { number } scaleX - X-axis scale. 2560 * @param { number } skewX - X-axis skew. 2561 * @param { number } skewY - Y-axis skew. 2562 * @param { number } scaleY - Y-axis scale. 2563 * @param { number } translateX - X-axis translation. 2564 * @param { number } translateY - Y-axis translation. 2565 * @syscap SystemCapability.ArkUI.ArkUI.Full 2566 * @since 4 2567 */ 2568 setTransform( 2569 scaleX: number, 2570 skewX: number, 2571 skewY: number, 2572 scaleY: number, 2573 translateX: number, 2574 translateY: number, 2575 ): void; 2576 2577 /** 2578 * Moves the origin of the coordinate system. 2579 * 2580 * @param { number } x - X-axis translation. 2581 * @param { number } y - Y-axis translation. 2582 * @syscap SystemCapability.ArkUI.ArkUI.Full 2583 * @since 4 2584 */ 2585 translate(x: number, y: number): void; 2586 2587 /** 2588 * Sets the alpha value. 2589 * Global alpha value to set. 2590 * The value ranges from 0.0 (completely transparent) to 1.0 (completely opaque). 2591 * 2592 * @type { number } 2593 * @syscap SystemCapability.ArkUI.ArkUI.Full 2594 * @since 4 2595 */ 2596 globalAlpha: number; 2597 2598 /** 2599 * Draws an image. 2600 * 2601 * @param { Image } image - Image resource. 2602 * @param { number } dx - X-coordinate of the upper left corner of the drawing area on the canvas. 2603 * @param { number } dy - Y-coordinate of the upper left corner of the drawing area on the canvas. 2604 * @param { number } dWidth - Width of the drawing area. 2605 * @param { number } dHeight - Height of the drawing area. 2606 * @syscap SystemCapability.ArkUI.ArkUI.Full 2607 * @since 4 2608 */ 2609 drawImage(image: Image, dx: number, dy: number, dWidth: number, dHeight: number): void; 2610 2611 /** 2612 * Draws an image. 2613 * 2614 * @param { Image } image - Image resource. 2615 * @param { number } sx - X-coordinate of the upper left corner of the rectangle used to crop the source image. 2616 * @param { number } sy - Y-coordinate of the upper left corner of the rectangle used to crop the source image. 2617 * @param { number } sWidth - Target width of the image to crop. 2618 * @param { number } sHeight - Target height of the image to crop. 2619 * @param { number } dx - X-coordinate of the upper left corner of the drawing area on the canvas. 2620 * @param { number } dy - Y-coordinate of the upper left corner of the drawing area on the canvas. 2621 * @param { number } dWidth - Width of the drawing area. 2622 * @param { number } dHeight - Height of the drawing area. 2623 * @syscap SystemCapability.ArkUI.ArkUI.Full 2624 * @since 4 2625 */ 2626 drawImage( 2627 image: Image, 2628 sx: number, 2629 sy: number, 2630 sWidth: number, 2631 sHeight: number, 2632 dx: number, 2633 dy: number, 2634 dWidth: number, 2635 dHeight: number, 2636 ): void; 2637 2638 /** 2639 * Draws an image. 2640 * 2641 * @param { image.PixelMap } image - Image resource. 2642 * @param { number } dx - X-coordinate of the upper left corner of the drawing area on the canvas. 2643 * @param { number } dy - Y-coordinate of the upper left corner of the drawing area on the canvas. 2644 * @param { number } dWidth - Width of the drawing area. 2645 * @param { number } dHeight - Height of the drawing area. 2646 * @syscap SystemCapability.ArkUI.ArkUI.Full 2647 * @since 9 2648 */ 2649 drawImage(image: image.PixelMap, dx: number, dy: number, dWidth: number, dHeight: number): void; 2650 2651 /** 2652 * Draws an image. 2653 * 2654 * @param { image.PixelMap } image - Image resource. 2655 * @param { number } sx - X-coordinate of the upper left corner of the rectangle used to crop the source image. 2656 * @param { number } sy - Y-coordinate of the upper left corner of the rectangle used to crop the source image. 2657 * @param { number } sWidth - Target width of the image to crop. 2658 * @param { number } sHeight - Target height of the image to crop. 2659 * @param { number } dx - X-coordinate of the upper left corner of the drawing area on the canvas. 2660 * @param { number } dy - Y-coordinate of the upper left corner of the drawing area on the canvas. 2661 * @param { number } dWidth - Width of the drawing area. 2662 * @param { number } dHeight - Height of the drawing area. 2663 * @syscap SystemCapability.ArkUI.ArkUI.Full 2664 * @since 9 2665 */ 2666 drawImage( 2667 image: image.PixelMap, 2668 sx: number, 2669 sy: number, 2670 sWidth: number, 2671 sHeight: number, 2672 dx: number, 2673 dy: number, 2674 dWidth: number, 2675 dHeight: number, 2676 ): void; 2677 2678 /** 2679 * Restores the saved drawing context. 2680 * 2681 * @type { function } 2682 * @syscap SystemCapability.ArkUI.ArkUI.Full 2683 * @since 4 2684 */ 2685 restore: () => void; 2686 2687 /** 2688 * Saves the current drawing context. 2689 * 2690 * @type { function } 2691 * @syscap SystemCapability.ArkUI.ArkUI.Full 2692 * @since 4 2693 */ 2694 save: () => void; 2695 2696 /** 2697 * Creates an ImageData object. 2698 * 2699 * @param { number } width - Width of the ImageData object. 2700 * @param { number } height - Height of the ImageData object. 2701 * @returns { ImageData } Returns the newly created FunctionCallable object. 2702 * @syscap SystemCapability.ArkUI.ArkUI.Full 2703 * @since 4 2704 */ 2705 createImageData(width: number, height: number): ImageData; 2706 /** 2707 * Creates an ImageData object. 2708 * 2709 * @param { ImageData } imagedata - ImageData object with the same width and height copied from the original ImageData object. 2710 * @returns { ImageData } Returns the newly created FunctionCallable object. 2711 * @syscap SystemCapability.ArkUI.ArkUI.Full 2712 * @since 4 2713 */ 2714 createImageData(imagedata: ImageData): ImageData; 2715 2716 /** 2717 * ImageData object created with pixels in the specified area on the canvas. 2718 * 2719 * @param { number } sx - X-coordinate of the upper left corner of the output area. 2720 * @param { number } sy - Y-coordinate of the upper left corner of the output area. 2721 * @param { number } sw - Width of the output area. 2722 * @param { number } sh - Height of the output area. 2723 * @returns { ImageData } ImageData object that contains pixels in the specified area on the canvas. 2724 * @syscap SystemCapability.ArkUI.ArkUI.Full 2725 * @since 4 2726 */ 2727 getImageData(sx: number, sy: number, sw: number, sh: number): ImageData; 2728 2729 /** 2730 * Get an PixelMap object. 2731 * 2732 * @param { number } sx - The upper-left x-coordinate of the rectangular area of the image data to be extracted. 2733 * @param { number } sy - The upper-left y coordinate of the rectangular region of the image data to be extracted. 2734 * @param { number } sw - The width of the rectangular area of the image data to be extracted. 2735 * @param { number } sh - The height of the rectangular area of the image data to be extracted. 2736 * @returns { image.PixelMap } PixelMap A PixelMap object that contains the rectangular ImageData given by the canvas. 2737 * @syscap SystemCapability.ArkUI.ArkUI.Full 2738 * @since 9 2739 */ 2740 getPixelMap(sx: number, sy: number, sw: number, sh: number): image.PixelMap 2741 2742 /** 2743 * Puts the ImageData onto a rectangular area on the canvas. 2744 * 2745 * @param { ImageData } imageData - ImageData object with pixels to put onto the canvas. 2746 * @param { number } dx - X-axis offset of the rectangle area on the canvas. 2747 * @param { number } dy - Y-axis offset of the rectangle area on the canvas. 2748 * @syscap SystemCapability.ArkUI.ArkUI.Full 2749 * @since 4 2750 */ 2751 putImageData(imageData: ImageData, dx: number, dy: number): void; 2752 2753 /** 2754 * Puts the ImageData onto a rectangular area on the canvas. 2755 * 2756 * @param { ImageData } imageData - ImageData object with pixels to put onto the canvas. 2757 * @param { number } dx - X-axis offset of the rectangle area on the canvas. 2758 * @param { number } dy - Y-axis offset of the rectangle area on the canvas. 2759 * @param { number } dirtyX - X-axis offset of the upper left corner of the rectangle area relative to that of the source image. 2760 * @param { number } dirtyY - Y-axis offset of the upper left corner of the rectangle area relative to that of the source image. 2761 * @param { number } dirtyWidth - Width of the rectangle area to cop the source image. 2762 * @param { number } dirtyHeight - Height of the rectangle area to cop the source image. 2763 * @syscap SystemCapability.ArkUI.ArkUI.Full 2764 * @since 4 2765 */ 2766 putImageData( 2767 imageData: ImageData, 2768 dx: number, 2769 dy: number, 2770 dirtyX: number, 2771 dirtyY: number, 2772 dirtyWidth: number, 2773 dirtyHeight: number, 2774 ): void; 2775 2776 /** 2777 * Sets the dash line style. 2778 * 2779 * @param { Array<number> } segments - Interval of alternate line segments and the length of spacing. 2780 * @syscap SystemCapability.ArkUI.ArkUI.Full 2781 * @since 4 2782 */ 2783 setLineDash(segments: Array<number>): void; 2784 2785 /** 2786 * Obtains the dash line style. 2787 * 2788 * @returns { Array<number> } Interval of alternate line segments and the length of spacing. 2789 * @syscap SystemCapability.ArkUI.ArkUI.Full 2790 * @since 4 2791 */ 2792 getLineDash(): Array<number>; 2793 2794 /** 2795 * Sets the dash line offset. 2796 * Dash line offset. The value is a float number starting from 0.0. 2797 * 2798 * @type { number } 2799 * @syscap SystemCapability.ArkUI.ArkUI.Full 2800 * @since 4 2801 */ 2802 lineDashOffset: number; 2803 2804 /** 2805 * Sets the composite operation type. 2806 * source-over Default value. Displays the new drawing above the existing drawing. 2807 * source-atop Displays the new drawing on the top of the existing drawing. 2808 * source-in Displays the new drawing inside the existing drawing. 2809 * source-out Displays part of the new drawing that is outside of the existing drawing. 2810 * destination-over Displays the existing drawing above the new drawing. 2811 * destination-atop Displays the existing drawing above the new drawing. 2812 * destination-in Displays the existing drawing inside the new drawing. 2813 * destination-out Displays part of the existing drawing that is outside of the new drawing. 2814 * lighter Displays both the new drawing and the existing drawing. 2815 * copy Displays the new drawing and neglects the existing drawing. 2816 * xor Combines the new drawing and existing drawing using the XOR operation. 2817 * 2818 * @type { string } 2819 * @syscap SystemCapability.ArkUI.ArkUI.Full 2820 * @since 4 2821 */ 2822 globalCompositeOperation: string; 2823 2824 /** 2825 * Sets the shadow blur degree. 2826 * Shadow blur degree. A larger value indicates a more blurred shadow. The value is of the float type, and the default value is 0. 2827 * 2828 * @type { number } 2829 * @syscap SystemCapability.ArkUI.ArkUI.Full 2830 * @since 4 2831 */ 2832 shadowBlur: number; 2833 2834 /** 2835 * Sets the shadow color. 2836 * 2837 * @type { string } 2838 * @syscap SystemCapability.ArkUI.ArkUI.Full 2839 * @since 4 2840 */ 2841 shadowColor: string; 2842 2843 /** 2844 * Sets the x-axis shadow offset relative to the original object. 2845 * X-axis shadow offset relative to the original object. 2846 * 2847 * @type { number } 2848 * @syscap SystemCapability.ArkUI.ArkUI.Full 2849 * @since 4 2850 */ 2851 shadowOffsetX: number; 2852 2853 /** 2854 * Sets the y-axis shadow offset relative to the original object. 2855 * Y-axis shadow offset relative to the original object. 2856 * 2857 * @type { number } 2858 * @syscap SystemCapability.ArkUI.ArkUI.Full 2859 * @since 4 2860 */ 2861 shadowOffsetY: number; 2862 2863 /** 2864 * Draws the Bitmap to the current canvas. 2865 * 2866 * @param { ImageBitmap } bitmap 2867 * @syscap SystemCapability.ArkUI.ArkUI.Full 2868 * @since 7 2869 */ 2870 transferFromImageBitmap(bitmap: ImageBitmap): void; 2871} 2872 2873/** 2874 * You can create a gradient object on the canvas by calling CanvasRenderingContext2D.createLinearGradient(). 2875 * 2876 * @interface CanvasGradient 2877 * @syscap SystemCapability.ArkUI.ArkUI.Full 2878 * @since 4 2879 */ 2880export interface CanvasGradient { 2881 /** 2882 * Adds a color stop for the CanvasGradient object based on the specified offset and gradient color. 2883 * 2884 * @param { number } offset - Proportion of the distance between the color stop and the start point to the total length. 2885 * The value ranges from 0 to 1. 2886 * @param { string } color - Sets the gradient color. 2887 * @syscap SystemCapability.ArkUI.ArkUI.Full 2888 * @since 4 2889 */ 2890 addColorStop(offset: number, color: string): void; 2891} 2892 2893/** 2894 * Path2D 2895 * 2896 * @interface Path2D 2897 * @syscap SystemCapability.ArkUI.ArkUI.Full 2898 * @since 4 2899 */ 2900export interface Path2D { 2901 /** 2902 * Add another path to current path. 2903 * 2904 * @param { Path2D } path - another created Path2D object. 2905 * @syscap SystemCapability.ArkUI.ArkUI.Full 2906 * @since 4 2907 */ 2908 addPath(path: Path2D): void; 2909 2910 /** 2911 * Uses same parameters as the transform() function to reset the existing transformation matrix and create a new transformation matrix. 2912 * 2913 * @param { number } scaleX - X-axis scale. 2914 * @param { number } skewX - X-axis skew. 2915 * @param { number } skewY - Y-axis skew. 2916 * @param { number } scaleY - Y-axis scale. 2917 * @param { number } translateX - X-axis translation. 2918 * @param { number } translateY - Y-axis translation. 2919 * @syscap SystemCapability.ArkUI.ArkUI.Full 2920 * @since 4 2921 */ 2922 setTransform( 2923 scaleX: number, 2924 skewX: number, 2925 skewY: number, 2926 scaleY: number, 2927 translateX: number, 2928 translateY: number, 2929 ): void; 2930 2931 /** 2932 * Draws a closed path. 2933 * 2934 * @syscap SystemCapability.ArkUI.ArkUI.Full 2935 * @since 4 2936 */ 2937 closePath(): void; 2938 2939 /** 2940 * Moves a drawing path to a target position on the canvas. 2941 * 2942 * @param { number } x - X-coordinate of the target position. 2943 * @param { number } y - Y-coordinate of the target position. 2944 * @syscap SystemCapability.ArkUI.ArkUI.Full 2945 * @since 4 2946 */ 2947 moveTo(x: number, y: number): void; 2948 2949 /** 2950 * Connects the current point to a target position using a straight line. 2951 * 2952 * @param { number } x - X-coordinate of the target position. 2953 * @param { number } y - Y-coordinate of the target position. 2954 * @syscap SystemCapability.ArkUI.ArkUI.Full 2955 * @since 4 2956 */ 2957 lineTo(x: number, y: number): void; 2958 2959 /** 2960 * Draws a cubic bezier curve on the canvas. 2961 * 2962 * @param { number } cp1x - X-coordinate of the first parameter of the bezier curve. 2963 * @param { number } cp1y - Y-coordinate of the first parameter of the bezier curve. 2964 * @param { number } cp2x - X-coordinate of the second parameter of the bezier curve. 2965 * @param { number } cp2y - Y-coordinate of the second parameter of the bezier curve. 2966 * @param { number } x - End point x-coordinate of the bezier curve. 2967 * @param { number } y - End point y-coordinate of the bezier curve. 2968 * @syscap SystemCapability.ArkUI.ArkUI.Full 2969 * @since 4 2970 */ 2971 bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void; 2972 2973 /** 2974 * Draws a quadratic curve on the canvas. 2975 * 2976 * @param { number } cpx - X-coordinate of the bezier curve parameter. 2977 * @param { number } cpy - Y-coordinate of the bezier curve parameter. 2978 * @param { number } x - End point x-coordinate of the bezier curve. 2979 * @param { number } y - End point y-coordinate of the bezier curve. 2980 * @syscap SystemCapability.ArkUI.ArkUI.Full 2981 * @since 4 2982 */ 2983 quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void; 2984 2985 /** 2986 * Draws an arc on the canvas. 2987 * 2988 * @param { number } x - X-coordinate of the center point of the arc. 2989 * @param { number } y - Y-coordinate of the center point of the arc. 2990 * @param { number } radius - Radius of the arc. 2991 * @param { number } startAngle - Start radian of the arc. 2992 * @param { number } endAngel - End radian of the arc. 2993 * @param { boolean } [anticlockwise] - Whether to draw the arc counterclockwise. 2994 * @syscap SystemCapability.ArkUI.ArkUI.Full 2995 * @since 4 2996 */ 2997 arc(x: number, y: number, radius: number, startAngle: number, endAngel: number, anticlockwise?: boolean): void; 2998 2999 /** 3000 * Draws an arc based on the radius and points on the arc. 3001 * 3002 * @param { number } x1 - X-coordinate of the first point on the arc. 3003 * @param { number } y1 - Y-coordinate of the first point on the arc. 3004 * @param { number } x2 - X-coordinate of the second point on the arc. 3005 * @param { number } y2 - Y-coordinate of the second point on the arc. 3006 * @param { number } radius - Radius of the arc. 3007 * @syscap SystemCapability.ArkUI.ArkUI.Full 3008 * @since 4 3009 */ 3010 arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void; 3011 3012 /** 3013 * Draws an ellipse based on the coordinate and radius. 3014 * 3015 * @param { number } x - X-coordinate of the center point on the ellipse. 3016 * @param { number } y - Y-coordinate of the center point on the ellipse. 3017 * @param { number } radiusX - X-coordinate of the radius Length on the ellipse. 3018 * @param { number } radiusY - Y-coordinate of the radius Length on the ellipse. 3019 * @param { number } rotation - The rotation angle of the ellipse, in radians. 3020 * @param { number } startAngle - Angle of the start point for ellipse drawing. 3021 * @param { number } endAngle - End Point Angle for Ellipse Drawing. 3022 * @param { number } anticlockwise - Indicates whether to draw an ellipse counterclockwise. 3023 * 0: clockwise; 1: counterclockwise. The default value is 0. 3024 * @syscap SystemCapability.ArkUI.ArkUI.Full 3025 * @since 4 3026 */ 3027 ellipse( 3028 x: number, 3029 y: number, 3030 radiusX: number, 3031 radiusY: number, 3032 rotation: number, 3033 startAngle: number, 3034 endAngle: number, 3035 anticlockwise?: number, 3036 ): void; 3037 3038 /** 3039 * Creates a rectangular. 3040 * 3041 * @param { number } x - X-coordinate of the upper left corner of the rectangle. 3042 * @param { number } y - Y-coordinate of the upper left corner of the rectangle. 3043 * @param { number } width - Width of the rectangle. 3044 * @param { number } height - Height of the rectangle. 3045 * @syscap SystemCapability.ArkUI.ArkUI.Full 3046 * @since 4 3047 */ 3048 rect(x: number, y: number, width: number, height: number): void; 3049} 3050 3051/** 3052 * <canvas> provides a rectangular canvas component for drawing graphics on the screen. 3053 * You can control each pixel to draw on the canvas. 3054 * <canvas> offers a variety of functions for drawing paths, rectangles, circles, text, and allows for adding images to it. 3055 * 3056 * @interface CanvasElement 3057 * @syscap SystemCapability.ArkUI.ArkUI.Full 3058 * @since 4 3059 */ 3060export interface CanvasElement extends Element { 3061 /** 3062 * Obtains the context of 2D canvas drawing. 3063 * Only parameters related to 2D canvas drawing are supported. 3064 * The return value is a 2D drawing object that provides specific 2D drawing operations. 3065 * 3066 * @param { "2d" } type - identifier defining the drawing context associated to the canvas. 3067 * @param { ContextAttrOptions } [options] - use this context attributes to creating rendering context. 3068 * @returns { CanvasRenderingContext2D } 3069 * @syscap SystemCapability.ArkUI.ArkUI.Full 3070 * @since 4 3071 */ 3072 getContext(type: "2d", options?: ContextAttrOptions): CanvasRenderingContext2D; 3073 3074 /** 3075 * Obtains the context of webgl canvas drawing. 3076 * Only parameters related to webgl canvas drawing are supported. 3077 * The return value is a webgl drawing object that provides specific webgl drawing operations. 3078 * 3079 * @param { "webgl" } type - identifier defining the drawing context associated to the canvas. 3080 * @param { WebGLContextAttributes } [options] - use this context attributes to creating rendering context. 3081 * @returns { WebGLRenderingContext } 3082 * @syscap SystemCapability.ArkUI.ArkUI.Full 3083 * @since 6 3084 */ 3085 getContext(type: "webgl", options?: WebGLContextAttributes): WebGLRenderingContext; 3086 3087 /** 3088 * Obtains the context of webgl2 canvas drawing. 3089 * Only parameters related to webgl2 canvas drawing are supported. 3090 * The return value is a webgl2 drawing object that provides specific webgl2 drawing operations. 3091 * 3092 * @param { "webgl2" } type - identifier defining the drawing context associated to the canvas. 3093 * @param { WebGLContextAttributes } [options] - use this context attributes to creating rendering context. 3094 * @returns { WebGL2RenderingContext } 3095 * @syscap SystemCapability.ArkUI.ArkUI.Full 3096 * @since 4 3097 */ 3098 getContext(type: "webgl2", options?: WebGLContextAttributes): WebGL2RenderingContext; 3099 3100 /** 3101 * Creates a data URI that contains the image display. 3102 * 3103 * @param { string } type - A DOMString indicating the image format. The default type is image/png. 3104 * @param { number } [quality] - A Number between 0 and 1 indicating image quality if the type option 3105 * is image/jpeg or image/webp. If this argument is anything else, 3106 * the default value for image quality is used. Other arguments are ignored. 3107 * @returns { string } 3108 * @syscap SystemCapability.ArkUI.ArkUI.Full 3109 * @since 4 3110 */ 3111 toDataURL(type?: string, quality?: number): string; 3112} 3113 3114/** 3115 * ScrollOptions 3116 * 3117 * @interface ScrollOptions 3118 * @syscap SystemCapability.ArkUI.ArkUI.Full 3119 * @since 6 3120 */ 3121export interface ScrollOptions { 3122 /** 3123 * Scroll to the target position of the page. Unit: px 3124 * 3125 * @type { number } 3126 * @syscap SystemCapability.ArkUI.ArkUI.Full 3127 * @since 6 3128 */ 3129 position: number; 3130 3131 /** 3132 * Duration of the scrolling animation, in ms. 3133 * 3134 * @type { number } 3135 * @syscap SystemCapability.ArkUI.ArkUI.Full 3136 * @since 6 3137 */ 3138 duration: number; 3139 3140 /** 3141 * The selector for current scroll. 3142 * 3143 * @type { ?string } 3144 * @syscap SystemCapability.ArkUI.ArkUI.Full 3145 * @since 6 3146 */ 3147 id?: string; 3148 3149 /** 3150 * The timing function for current scroll animation. 3151 * 3152 * @type { ?string } 3153 * @syscap SystemCapability.ArkUI.ArkUI.Full 3154 * @since 6 3155 */ 3156 timingFunction?: string; 3157 3158 /** 3159 * Callback function for successful interface invocation. 3160 * 3161 * @type { ?function } 3162 * @syscap SystemCapability.ArkUI.ArkUI.Full 3163 * @since 6 3164 */ 3165 success?: (result: Object) => void; 3166 3167 /** 3168 * Callback function for interface invocation failure. 3169 * 3170 * @type { ?function } 3171 * @syscap SystemCapability.ArkUI.ArkUI.Full 3172 * @since 6 3173 */ 3174 fail?: (result: Object) => void; 3175 3176 /** 3177 * Callback function at the end of the interface invoking (executed both successfully and unsuccessfully). 3178 * 3179 * @type { ?function } 3180 * @syscap SystemCapability.ArkUI.ArkUI.Full 3181 * @since 6 3182 */ 3183 complete?: (result: Object) => void; 3184} 3185 3186/** 3187 * ScrollOffset 3188 * 3189 * @interface ScrollOffset 3190 * @syscap SystemCapability.ArkUI.ArkUI.Full 3191 * @since 6 3192 */ 3193export interface ScrollOffset { 3194 /** 3195 * Scrolling offset in the x-axis, in px. 3196 * 3197 * @type { number } 3198 * @syscap SystemCapability.ArkUI.ArkUI.Full 3199 * @since 6 3200 */ 3201 x: number; 3202 3203 /** 3204 * Scrolling offset in the y-axis, in px. 3205 * 3206 * @type { number } 3207 * @syscap SystemCapability.ArkUI.ArkUI.Full 3208 * @since 6 3209 */ 3210 y: number; 3211} 3212 3213/** 3214 * The <div> component provides a div container. 3215 * 3216 * @interface DivElement 3217 * @syscap SystemCapability.ArkUI.ArkUI.Full 3218 * @since 6 3219 */ 3220export interface DivElement extends Element { 3221 /** 3222 * Scrolls the div for a certain distance. 3223 * 3224 * @param { ScrollParam } data 3225 * @syscap SystemCapability.ArkUI.ArkUI.Full 3226 * @since 6 3227 */ 3228 scrollBy(data: ScrollParam): void; 3229 3230 /** 3231 * Returns the offset of the current scrolling. The return value type is Object. 3232 * 3233 * @returns { ScrollOffset } 3234 * @syscap SystemCapability.ArkUI.ArkUI.Full 3235 * @since 6 3236 */ 3237 getScrollOffset(): ScrollOffset; 3238} 3239 3240/** 3241 * Application 3242 * 3243 * @interface Application 3244 * @syscap SystemCapability.ArkUI.ArkUI.Full 3245 * @since 4 3246 */ 3247export interface Application { 3248 /** 3249 * Object that is exposed in the app.js file and obtained by this.$app.$def. 3250 * 3251 * @type { any } 3252 * @syscap SystemCapability.ArkUI.ArkUI.Full 3253 * @since 4 3254 */ 3255 $def: any; 3256} 3257 3258/** 3259 * ViewModel 3260 * 3261 * @interface ViewModel 3262 * @syscap SystemCapability.ArkUI.ArkUI.Full 3263 * @since 4 3264 */ 3265export interface ViewModel { 3266 /** 3267 * Object that is exposed in the app.js file and obtained by this.$app 3268 * 3269 * @type { Application } 3270 * @syscap SystemCapability.ArkUI.ArkUI.Full 3271 * @since 4 3272 */ 3273 $app: Application; 3274 3275 /** 3276 * Sets the parameters based on the system language, for example, this.$t('strings.hello'). 3277 * 3278 * @param { string } path - Path of the language resource key. 3279 * @param { object | Array<any> } [params] - Content used to replace placeholders during runtime. 3280 * @returns { string } Content. 3281 * There are two types of placeholders available:Named placeholder, for example, {name}. 3282 * The actual content must be of the object type, for example, $t('strings.object', { name: 'Hello world' }). 3283 * Digit placeholder, for example, {0}. The actual content must be of the array type, for example, $t('strings.array', ['Hello world']. 3284 * @syscap SystemCapability.ArkUI.ArkUI.Lite 3285 * @since 4 3286 */ 3287 $t(path: string, params?: object | Array<any>): string; 3288 3289 /** 3290 * Converse between singular and plural forms based on the system language, for example, this.$tc('strings.plurals'). 3291 * NOTE 3292 * The resource content is distinguished by the following JSON keys: zero, one, two, few, many, and other. 3293 * 3294 * @param { string } path - Resource file path. 3295 * @param { number } count - Value. 3296 * @returns { string } Content. 3297 * @syscap SystemCapability.ArkUI.ArkUI.Full 3298 * @since 4 3299 */ 3300 $tc(path: string, count: number): string; 3301 3302 /** 3303 * Replace the resource path based on the DPI of the current device: this.$r('image.tv'). 3304 * 3305 * @param { string } path - Resource file path. 3306 * @returns { string } Content. 3307 * @syscap SystemCapability.ArkUI.ArkUI.Full 3308 * @since 4 3309 */ 3310 $r(path: string): string; 3311 3312 /** 3313 * Adds an attribute or modifies an existing attribute. 3314 * Usage: this.$set('key',value): Add an attribute. 3315 * 3316 * @param { string } key 3317 * @param { any } value 3318 * @syscap SystemCapability.ArkUI.ArkUI.Full 3319 * @since 4 3320 */ 3321 $set(key: string, value: any): void; 3322 3323 /** 3324 * Deletes an attribute. 3325 * Usage:this.$delete('key'): Delete an attribute. 3326 * 3327 * @param { string } key 3328 * @syscap SystemCapability.ArkUI.ArkUI.Full 3329 * @since 4 3330 */ 3331 $delete(key: string): void; 3332 3333 /** 3334 * Obtains the component with a specified ID. If no ID is specified, the root component is returned. 3335 * Usage: 3336 * <div id='xxx'></div> 3337 * this.$element('xxx'): Obtain the component whose ID is xxx. 3338 * this.$element(): Obtain the root component. 3339 * 3340 * @param { string } [id] - Component ID. 3341 * @returns {AnimationElement &CanvasElement & 3342 * object &WebElement &CameraElement &ListElement & 3343 * SwiperElement &DialogElement &ImageAnimatorElement & 3344 * MarqueeElement &MenuElement &ChartElement &InputElement & 3345 * ButtonElement &TextAreaElement &PickerElement &VideoElement &DivElement} 3346 * @syscap SystemCapability.ArkUI.ArkUI.Full 3347 * @since 4 3348 */ 3349 $element( 3350 id?: string, 3351 ): AnimationElement & 3352 CanvasElement & 3353 object & 3354 WebElement & 3355 CameraElement & 3356 ListElement & 3357 SwiperElement & 3358 DialogElement & 3359 ImageAnimatorElement & 3360 MarqueeElement & 3361 MenuElement & 3362 ChartElement & 3363 InputElement & 3364 ButtonElement & 3365 TextAreaElement & 3366 PickerElement & 3367 VideoElement & 3368 DivElement; 3369 3370 /** 3371 * Obtains the root ViewModel instance. 3372 * 3373 * @returns { ViewModel & object } 3374 * @syscap SystemCapability.ArkUI.ArkUI.Full 3375 * @since 4 3376 */ 3377 $root(): ViewModel & object; 3378 3379 /** 3380 * Obtains the parent ViewModel instance. 3381 * 3382 * @returns { ViewModel & object } 3383 * @syscap SystemCapability.ArkUI.ArkUI.Full 3384 * @since 4 3385 */ 3386 $parent(): ViewModel & object; 3387 3388 /** 3389 * Obtains the ViewModel instance of a custom child component with a specified ID. 3390 * Usage:this.$child('xxx'): Obtain the ViewModel instance of a custom child component whose ID is xxx. 3391 * 3392 * @param { string } id - Component ID. 3393 * @returns { ViewModel & object } 3394 * @syscap SystemCapability.ArkUI.ArkUI.Full 3395 * @since 4 3396 */ 3397 $child(id: string): ViewModel & object; 3398 3399 /** 3400 * Listens for attribute changes. If the value of the data attribute changes, the bound event is triggered. 3401 * 3402 * @param { string } data - Attribute. 3403 * @param { string } callback - Function name. 3404 * @syscap SystemCapability.ArkUI.ArkUI.Full 3405 * @since 4 3406 */ 3407 $watch(data: string, callback: string): void; 3408 3409 /** 3410 * An object that holds all DOM elements and component instances that have been registered with the refs attribute. 3411 * 3412 * @type { ElementReferences } 3413 * @syscap SystemCapability.ArkUI.ArkUI.Lite 3414 * @since 4 3415 */ 3416 $refs: ElementReferences; 3417 3418 /** 3419 * Custom events. 3420 * 3421 * @param { string } event - The name of event. 3422 * @param { object } [params] - The params of event. 3423 * @syscap SystemCapability.ArkUI.ArkUI.Full 3424 * @since 4 3425 */ 3426 $emit(event: string, params?: object): void; 3427 3428 /** 3429 * Scroll the page to the destination. 3430 * 3431 * @param { ScrollOptions } options - The properties of event. 3432 * @syscap SystemCapability.ArkUI.ArkUI.Full 3433 * @since 6 3434 */ 3435 scrollTo(options: ScrollOptions): void; 3436} 3437 3438/** 3439 * ElementReferences 3440 * 3441 * @interface ElementReferences 3442 * @syscap SystemCapability.ArkUI.ArkUI.Full 3443 * @since 4 3444 */ 3445export interface ElementReferences { 3446 [k: string]: AnimationElement & 3447 CanvasElement & 3448 object & 3449 WebElement & 3450 CameraElement & 3451 ListElement & 3452 SwiperElement & 3453 DialogElement & 3454 ImageAnimatorElement & 3455 MarqueeElement & 3456 MenuElement & 3457 ChartElement & 3458 InputElement & 3459 ButtonElement & 3460 TextAreaElement & 3461 PickerElement & 3462 VideoElement & 3463 DivElement; 3464} 3465 3466/** 3467 * @syscap SystemCapability.ArkUI.ArkUI.Full 3468 * @since 4 3469 */ 3470export declare class Locate { 3471 /** 3472 * language, such as 'zh'. 3473 * 3474 * @type { string } 3475 * @syscap SystemCapability.ArkUI.ArkUI.Full 3476 * @since 4 3477 */ 3478 language: string; 3479 3480 /** 3481 * country or region, such ass 'CN'. 3482 * 3483 * @type { string } 3484 * @syscap SystemCapability.ArkUI.ArkUI.Full 3485 * @since 4 3486 */ 3487 countryOrRegion: string; 3488 3489 /** 3490 * text layout direction, ltr or rtl. 3491 * 3492 * @type { "ltr" | "rtl" } 3493 * @syscap SystemCapability.ArkUI.ArkUI.Full 3494 * @since 4 3495 */ 3496 dir: "ltr" | "rtl"; 3497 3498 /** 3499 * The Unicode locale key set defined by the locale. If this locale does not have a specific key set, an empty set is 3500 * returned. For example: {"nu": "arab"}, which means that the numbers in the current environment use Arabic numbers. 3501 * 3502 * @type { object } 3503 * @syscap SystemCapability.ArkUI.ArkUI.Full 3504 * @since 5 3505 */ 3506 unicodeSetting: object; 3507} 3508 3509/** 3510 * @syscap SystemCapability.ArkUI.ArkUI.Full 3511 * @since 6 3512 */ 3513export declare class Configuration { 3514 /** 3515 * Internationalization related information, such as language, country, text layout direction, etc. 3516 * 3517 * @type { Locate } 3518 * @syscap SystemCapability.ArkUI.ArkUI.Full 3519 * @since 6 3520 */ 3521 locate: Locate; 3522 3523 /** 3524 * The magnification of the current system font. 3525 * 3526 * @type { number } 3527 * @syscap SystemCapability.ArkUI.ArkUI.Full 3528 * @since 6 3529 */ 3530 fontScale: number; 3531} 3532 3533/** 3534 * Options 3535 * 3536 * @interface Options 3537 * @syscap SystemCapability.ArkUI.ArkUI.Full 3538 * @since 4 3539 */ 3540export interface Options<T extends ViewModel, Data = DefaultData<T>> { 3541 /** 3542 * Data model of the page that can be converted into a JSON object. 3543 * The attribute name cannot start with $ or an underscore (_) or contain the reserved words such as for, if, show, and tid. 3544 * For a function, the return value must be an object. 3545 * Set the value of data to the return value of the function during page initialization. 3546 * 3547 * @type { ?Data } 3548 * @syscap SystemCapability.ArkUI.ArkUI.Lite 3549 * @since 4 3550 */ 3551 data?: Data; 3552 3553 /** 3554 * Listens for page initialization. 3555 * Called when page initialization is complete. This function is called only once in a lifecycle. 3556 * 3557 * @syscap SystemCapability.ArkUI.ArkUI.Full 3558 * @since 4 3559 */ 3560 onInit?(): void; 3561 3562 /** 3563 * Listens for page creation. 3564 * Called when a page is created. This function is called only once in a lifecycle. 3565 * 3566 * @syscap SystemCapability.ArkUI.ArkUI.Full 3567 * @since 4 3568 */ 3569 onReady?(): void; 3570 3571 /** 3572 * Listens for page display. 3573 * Called when the page is displayed. 3574 * 3575 * @syscap SystemCapability.ArkUI.ArkUI.Full 3576 * @since 4 3577 */ 3578 onShow?(): void; 3579 3580 /** 3581 * Listens for page hiding. 3582 * Called when the page disappears. 3583 * 3584 * @syscap SystemCapability.ArkUI.ArkUI.Full 3585 * @since 4 3586 */ 3587 onHide?(): void; 3588 3589 /** 3590 * Listens for page destruction. 3591 * Called when the page is destroyed. 3592 * 3593 * @syscap SystemCapability.ArkUI.ArkUI.Full 3594 * @since 4 3595 */ 3596 onDestroy?(): void; 3597 3598 /** 3599 * Listens for the back button action. 3600 * The back button is tapped: 3601 * 3602 * @returns { boolean } true means that the page processes the return logic. 3603 * false means that the default return logic is used. 3604 * If no value is returned, the default return logic is used. 3605 * @syscap SystemCapability.ArkUI.ArkUI.Full 3606 * @since 4 3607 */ 3608 onBackPress?(): boolean; 3609 3610 /** 3611 * Listens for page active. 3612 * Called when the page is active. 3613 * 3614 * @syscap SystemCapability.ArkUI.ArkUI.Full 3615 * @since 5 3616 */ 3617 onActive?(): void; 3618 3619 /** 3620 * Listens for page inactive. 3621 * Called when the page is paused. 3622 * 3623 * @syscap SystemCapability.ArkUI.ArkUI.Full 3624 * @since 5 3625 */ 3626 onInactive?(): void; 3627 3628 /** 3629 * This callback is triggered when a new request is received when the FA has started. 3630 * 3631 * @syscap SystemCapability.ArkUI.ArkUI.Full 3632 * @since 5 3633 */ 3634 onNewRequest?(): void; 3635 3636 /** 3637 * Callback when FA initiates a migration, in this callback, the application can decide whether 3638 * to migrate according to the current state. 3639 * 3640 * @returns { boolean } 3641 * @syscap SystemCapability.ArkUI.ArkUI.Full 3642 * @since 5 3643 */ 3644 onStartContinuation?(): boolean; 3645 3646 /** 3647 * For the callback of saving state data, the developer needs to fill in the parameter object 3648 * the data to be migrated to the target device. 3649 * 3650 * @param { object } value 3651 * @syscap SystemCapability.ArkUI.ArkUI.Full 3652 * @since 5 3653 */ 3654 onSaveData?(value: object): void; 3655 3656 /** 3657 * The callback to restore the data saved by the onSaveData method when the migration was initiated. 3658 * 3659 * @param { object } value 3660 * @syscap SystemCapability.ArkUI.ArkUI.Full 3661 * @since 5 3662 */ 3663 onRestoreData?(value: object): void; 3664 3665 /** 3666 * The callback for the completion of the migration, which is triggered on the calling side, indicates 3667 * the result of the application migration to the target device. 3668 * 3669 * @param { number } code 3670 * @syscap SystemCapability.ArkUI.ArkUI.Full 3671 * @since 5 3672 */ 3673 onCompleteContinuation?(code: number): void; 3674 3675 /** 3676 * This callback is triggered when the corresponding system configuration changes, such as system font size, 3677 * language region, etc. 3678 * 3679 * @param { Configuration } configuration 3680 * @syscap SystemCapability.ArkUI.ArkUI.Full 3681 * @since 6 3682 */ 3683 onConfigurationUpdated?(configuration: Configuration): void; 3684 3685 /** 3686 * Listens for application creation. 3687 * Called when the application is created. 3688 * 3689 * @syscap SystemCapability.ArkUI.ArkUI.Full 3690 * @since 4 3691 */ 3692 onCreate?(): void; 3693} 3694 3695/** 3696 * Used for ide. 3697 * 3698 * @typedef { object } DefaultData<T> 3699 * @syscap SystemCapability.ArkUI.ArkUI.Lite 3700 * @systemapi 3701 * @since 4 3702 */ 3703type DefaultData<T> = object; 3704/** 3705 * Used for ide. 3706 * 3707 * @typedef { object & Options<T, Data> & ThisType<T & ViewModel & Data> } CombinedOptions<T extends ViewModel, Data> 3708 * @syscap SystemCapability.ArkUI.ArkUI.Lite 3709 * @systemapi 3710 * @since 4 3711 */ 3712type CombinedOptions<T extends ViewModel, Data> = object & Options<T, Data> & ThisType<T & ViewModel & Data>; 3713/** 3714 * @param { CombinedOptions<T, Data> } options 3715 * @returns { ViewModel & Data } 3716 * @syscap SystemCapability.ArkUI.ArkUI.Lite 3717 * @systemapi 3718 * @since 4 3719 */ 3720export declare function extendViewModel<T extends ViewModel, Data>(options: CombinedOptions<T, Data>): ViewModel & Data; 3721