1/* 2 * Copyright (c) 2023 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16/// <reference path='./import.ts' /> 17class ImageColorFilterModifier extends ModifierWithKey<ColorFilter> { 18 constructor(value: ColorFilter) { 19 super(value); 20 } 21 static identity: Symbol = Symbol('imageColorFilter'); 22 applyPeer(node: KNode, reset: boolean): void { 23 if (reset) { 24 getUINativeModule().image.resetColorFilter(node); 25 } else { 26 getUINativeModule().image.setColorFilter(node, this.value!); 27 } 28 } 29 checkObjectDiff(): boolean { 30 return true; 31 } 32} 33 34class ImageFillColorModifier extends ModifierWithKey<ResourceColor> { 35 constructor(value: ResourceColor) { 36 super(value); 37 } 38 static identity: Symbol = Symbol('imageFillColor'); 39 applyPeer(node: KNode, reset: boolean): void { 40 if (reset) { 41 getUINativeModule().image.resetFillColor(node); 42 } else { 43 getUINativeModule().image.setFillColor(node, this.value!); 44 } 45 } 46 checkObjectDiff(): boolean { 47 return !isBaseOrResourceEqual(this.stageValue, this.value); 48 } 49} 50 51class ImageAltModifier extends ModifierWithKey<ResourceStr> { 52 constructor(value: ResourceStr) { 53 super(value); 54 } 55 static identity: Symbol = Symbol('imageAlt'); 56 applyPeer(node: KNode, reset: boolean): void { 57 if (reset) { 58 getUINativeModule().image.resetAlt(node); 59 } else { 60 getUINativeModule().image.setAlt(node, this.value!); 61 } 62 } 63 checkObjectDiff(): boolean { 64 return !isBaseOrResourceEqual(this.stageValue, this.value); 65 } 66} 67 68class ImageCopyOptionModifier extends ModifierWithKey<CopyOptions> { 69 constructor(value: CopyOptions) { 70 super(value); 71 } 72 static identity: Symbol = Symbol('imageCopyOption'); 73 applyPeer(node: KNode, reset: boolean): void { 74 if (reset) { 75 getUINativeModule().image.resetCopyOption(node); 76 } else { 77 getUINativeModule().image.setCopyOption(node, this.value!); 78 } 79 } 80 checkObjectDiff(): boolean { 81 return this.stageValue !== this.value; 82 } 83} 84 85class ImageAutoResizeModifier extends ModifierWithKey<boolean> { 86 constructor(value: boolean) { 87 super(value); 88 } 89 static identity: Symbol = Symbol('imageAutoResize'); 90 applyPeer(node: KNode, reset: boolean): void { 91 if (reset) { 92 getUINativeModule().image.resetAutoResize(node); 93 } else { 94 getUINativeModule().image.setAutoResize(node, this.value!); 95 } 96 } 97 checkObjectDiff(): boolean { 98 return this.stageValue !== this.value; 99 } 100} 101 102class ImageFitOriginalSizeModifier extends ModifierWithKey<boolean> { 103 constructor(value: boolean) { 104 super(value); 105 } 106 static identity: Symbol = Symbol('imageFitOriginalSize'); 107 applyPeer(node: KNode, reset: boolean): void { 108 if (reset) { 109 getUINativeModule().image.resetFitOriginalSize(node); 110 } else { 111 getUINativeModule().image.setFitOriginalSize(node, this.value!); 112 } 113 } 114 checkObjectDiff(): boolean { 115 return this.stageValue !== this.value; 116 } 117} 118 119class ImageDraggableModifier extends ModifierWithKey<boolean> { 120 constructor(value: boolean) { 121 super(value); 122 } 123 static identity: Symbol = Symbol('imageDraggable'); 124 applyPeer(node: KNode, reset: boolean): void { 125 if (reset) { 126 getUINativeModule().image.resetDraggable(node); 127 } else { 128 getUINativeModule().image.setDraggable(node, this.value!); 129 } 130 } 131 checkObjectDiff(): boolean { 132 return this.stageValue !== this.value; 133 } 134} 135 136class ImageEdgeAntialiasingModifier extends ModifierWithKey<number> { 137 constructor(value: number) { 138 super(value); 139 } 140 static identity: Symbol = Symbol('edgeAntialiasing'); 141 applyPeer(node: KNode, reset: boolean): void { 142 if (reset) { 143 getUINativeModule().image.resetSourceSize(node); 144 } else { 145 getUINativeModule().image.setSourceSize(node, this.value); 146 } 147 } 148 checkObjectDiff(): boolean { 149 return this.stageValue !== this.value; 150 } 151} 152 153class ImageInterpolationModifier extends ModifierWithKey<ImageInterpolation> { 154 constructor(value: ImageInterpolation) { 155 super(value); 156 } 157 static identity: Symbol = Symbol('imageInterpolation'); 158 applyPeer(node: KNode, reset: boolean): void { 159 if (reset) { 160 getUINativeModule().image.resetImageInterpolation(node); 161 } else { 162 getUINativeModule().image.setImageInterpolation(node, this.value!); 163 } 164 } 165 checkObjectDiff(): boolean { 166 return this.stageValue !== this.value; 167 } 168} 169 170class ImageSourceSizeModifier extends ModifierWithKey<{ width: number; height: number }> { 171 constructor(value: { width: number; height: number }) { 172 super(value); 173 } 174 static identity: Symbol = Symbol('imageSourceSize'); 175 applyPeer(node: KNode, reset: boolean): void { 176 if (reset) { 177 getUINativeModule().image.resetSourceSize(node); 178 } else { 179 getUINativeModule().image.setSourceSize(node, this.value.width, this.value.height); 180 } 181 } 182 checkObjectDiff(): boolean { 183 return this.stageValue.width !== this.value.width || 184 this.stageValue.height !== this.value.height; 185 } 186} 187 188class ImageMatchTextDirectionModifier extends ModifierWithKey<boolean> { 189 constructor(value: boolean) { 190 super(value); 191 } 192 static identity: Symbol = Symbol('imageMatchTextDirection'); 193 applyPeer(node: KNode, reset: boolean): void { 194 if (reset) { 195 getUINativeModule().image.resetMatchTextDirection(node); 196 } else { 197 getUINativeModule().image.setMatchTextDirection(node, this.value!); 198 } 199 } 200 checkObjectDiff(): boolean { 201 return this.stageValue !== this.value; 202 } 203} 204 205class ImageObjectRepeatModifier extends ModifierWithKey<ImageRepeat> { 206 constructor(value: ImageRepeat) { 207 super(value); 208 } 209 static identity: Symbol = Symbol('imageObjectRepeat'); 210 applyPeer(node: KNode, reset: boolean): void { 211 if (reset) { 212 getUINativeModule().image.resetObjectRepeat(node); 213 } else { 214 getUINativeModule().image.setObjectRepeat(node, this.value!); 215 } 216 } 217 checkObjectDiff(): boolean { 218 return this.stageValue !== this.value; 219 } 220} 221 222class ImageRenderModeModifier extends ModifierWithKey<ImageRenderMode> { 223 constructor(value: ImageRenderMode) { 224 super(value); 225 } 226 static identity: Symbol = Symbol('imageRenderMode'); 227 applyPeer(node: KNode, reset: boolean): void { 228 if (reset) { 229 getUINativeModule().image.resetRenderMode(node); 230 } else { 231 getUINativeModule().image.setRenderMode(node, this.value!); 232 } 233 } 234 checkObjectDiff(): boolean { 235 return this.stageValue !== this.value; 236 } 237} 238 239class ImageSyncLoadModifier extends ModifierWithKey<boolean> { 240 constructor(value: boolean) { 241 super(value); 242 } 243 static identity: Symbol = Symbol('imageSyncLoad'); 244 applyPeer(node: KNode, reset: boolean): void { 245 if (reset) { 246 getUINativeModule().image.resetSyncLoad(node); 247 } else { 248 getUINativeModule().image.setSyncLoad(node, this.value!); 249 } 250 } 251 checkObjectDiff(): boolean { 252 return this.stageValue !== this.value; 253 } 254} 255 256class ImageObjectFitModifier extends ModifierWithKey<ImageFit> { 257 constructor(value: ImageFit) { 258 super(value); 259 } 260 static identity: Symbol = Symbol('imageObjectFit'); 261 applyPeer(node: KNode, reset: boolean): void { 262 if (reset) { 263 getUINativeModule().image.resetObjectFit(node); 264 } else { 265 getUINativeModule().image.setObjectFit(node, this.value!); 266 } 267 } 268 checkObjectDiff(): boolean { 269 return this.stageValue !== this.value; 270 } 271} 272class ImageBorderRadiusModifier extends ModifierWithKey<Length | BorderRadiuses> { 273 constructor(value: Length | BorderRadiuses) { 274 super(value); 275 } 276 static identity: Symbol = Symbol('imageBorderRadius'); 277 applyPeer(node: KNode, reset: boolean): void { 278 if (reset) { 279 getUINativeModule().image.resetBorderRadius(node); 280 } else { 281 if (isNumber(this.value) || isString(this.value) || isResource(this.value)) { 282 getUINativeModule().image.setBorderRadius(node, this.value, this.value, this.value, this.value); 283 } else { 284 getUINativeModule().image.setBorderRadius(node, 285 (this.value as BorderRadiuses).topLeft, 286 (this.value as BorderRadiuses).topRight, 287 (this.value as BorderRadiuses).bottomLeft, 288 (this.value as BorderRadiuses).bottomRight); 289 } 290 } 291 } 292 293 checkObjectDiff(): boolean { 294 if (isResource(this.stageValue) && isResource(this.value)) { 295 return !isResourceEqual(this.stageValue, this.value); 296 } else if (!isResource(this.stageValue) && !isResource(this.value)) { 297 return !((this.stageValue as BorderRadiuses).topLeft === (this.value as BorderRadiuses).topLeft && 298 (this.stageValue as BorderRadiuses).topRight === (this.value as BorderRadiuses).topRight && 299 (this.stageValue as BorderRadiuses).bottomLeft === (this.value as BorderRadiuses).bottomLeft && 300 (this.stageValue as BorderRadiuses).bottomRight === (this.value as BorderRadiuses).bottomRight); 301 } else { 302 return true; 303 } 304 } 305} 306class ImageBorderModifier extends ModifierWithKey<BorderOptions> { 307 constructor(value: BorderOptions) { 308 super(value); 309 } 310 static identity: Symbol = Symbol('imageBorder'); 311 applyPeer(node: KNode, reset: boolean): void { 312 if (reset) { 313 getUINativeModule().image.resetImageBorder(node); 314 } else { 315 let widthLeft; 316 let widthRight; 317 let widthTop; 318 let widthBottom; 319 if (!isUndefined(this.value.width) && this.value.width != null) { 320 if (isNumber(this.value.width) || isString(this.value.width) || isResource(this.value.width)) { 321 widthLeft = this.value.width; 322 widthRight = this.value.width; 323 widthTop = this.value.width; 324 widthBottom = this.value.width; 325 } else { 326 widthLeft = (this.value.width as EdgeWidths).left; 327 widthRight = (this.value.width as EdgeWidths).right; 328 widthTop = (this.value.width as EdgeWidths).top; 329 widthBottom = (this.value.width as EdgeWidths).bottom; 330 } 331 } 332 let leftColor; 333 let rightColor; 334 let topColor; 335 let bottomColor; 336 if (!isUndefined(this.value.color) && this.value.color != null) { 337 if (isNumber(this.value.color) || isString(this.value.color) || isResource(this.value.color)) { 338 leftColor = this.value.color; 339 rightColor = this.value.color; 340 topColor = this.value.color; 341 bottomColor = this.value.color; 342 } else { 343 leftColor = (this.value.color as EdgeColors).left; 344 rightColor = (this.value.color as EdgeColors).right; 345 topColor = (this.value.color as EdgeColors).top; 346 bottomColor = (this.value.color as EdgeColors).bottom; 347 } 348 } 349 let topLeft; 350 let topRight; 351 let bottomLeft; 352 let bottomRight; 353 if (!isUndefined(this.value.radius) && this.value.radius != null) { 354 if (isNumber(this.value.radius) || isString(this.value.radius) || isResource(this.value.radius)) { 355 topLeft = this.value.radius; 356 topRight = this.value.radius; 357 bottomLeft = this.value.radius; 358 bottomRight = this.value.radius; 359 } else { 360 topLeft = (this.value.radius as BorderRadiuses).topLeft; 361 topRight = (this.value.radius as BorderRadiuses).topRight; 362 bottomLeft = (this.value.radius as BorderRadiuses).bottomLeft; 363 bottomRight = (this.value.radius as BorderRadiuses).bottomRight; 364 } 365 } 366 let styleTop; 367 let styleRight; 368 let styleBottom; 369 let styleLeft; 370 if (!isUndefined(this.value.style) && this.value.style != null) { 371 if (isNumber(this.value.style) || isString(this.value.style) || isResource(this.value.style)) { 372 styleTop = this.value.style; 373 styleRight = this.value.style; 374 styleBottom = this.value.style; 375 styleLeft = this.value.style; 376 } else { 377 styleTop = (this.value.style as EdgeStyles).top; 378 styleRight = (this.value.style as EdgeStyles).right; 379 styleBottom = (this.value.style as EdgeStyles).bottom; 380 styleLeft = (this.value.style as EdgeStyles).left; 381 } 382 } 383 getUINativeModule().image.setImageBorder( 384 node, 385 widthLeft, 386 widthRight, 387 widthTop, 388 widthBottom, 389 leftColor, 390 rightColor, 391 topColor, 392 bottomColor, 393 topLeft, 394 topRight, 395 bottomLeft, 396 bottomRight, 397 styleTop, 398 styleRight, 399 styleBottom, 400 styleLeft 401 ); 402 } 403 } 404 405 checkObjectDiff(): boolean { 406 return ( 407 !isBaseOrResourceEqual(this.stageValue.width, this.value.width) || 408 !isBaseOrResourceEqual(this.stageValue.color, this.value.color) || 409 !isBaseOrResourceEqual(this.stageValue.radius, this.value.radius) || 410 !isBaseOrResourceEqual(this.stageValue.style, this.value.style) 411 ); 412 } 413} 414 415class ImageOpacityModifier extends ModifierWithKey<number | Resource> { 416 constructor(value: number | Resource) { 417 super(value); 418 } 419 static identity: Symbol = Symbol('imageOpacity'); 420 applyPeer(node: KNode, reset: boolean): void { 421 if (reset) { 422 getUINativeModule().image.resetImageOpacity(node); 423 } else { 424 getUINativeModule().image.setImageOpacity(node, this.value); 425 } 426 } 427 428 checkObjectDiff(): boolean { 429 return !isBaseOrResourceEqual(this.stageValue, this.value); 430 } 431} 432 433class ImageTransitionModifier extends ModifierWithKey<object> { 434 constructor(value: object) { 435 super(value); 436 } 437 static identity: Symbol = Symbol('imageTransition'); 438 applyPeer(node: KNode, reset: boolean): void { 439 if (reset) { 440 getUINativeModule().image.resetImageTransition(node); 441 } else { 442 getUINativeModule().image.setImageTransition(node, this.value); 443 } 444 } 445} 446 447class ArkImageComponent extends ArkComponent implements ImageAttribute { 448 constructor(nativePtr: KNode) { 449 super(nativePtr); 450 } 451 onGestureJudgeBegin(callback): this { 452 throw new Error('Method not implemented.'); 453 } 454 draggable(value: boolean): this { 455 modifierWithKey(this._modifiersWithKeys, ImageDraggableModifier.identity, ImageDraggableModifier, value); 456 return this; 457 } 458 edgeAntialiasing(value: number): this { 459 modifierWithKey(this._modifiersWithKeys, ImageEdgeAntialiasingModifier.identity, ImageEdgeAntialiasingModifier, value); 460 return this; 461 } 462 alt(value: ResourceStr): this { 463 modifierWithKey(this._modifiersWithKeys, ImageAltModifier.identity, ImageAltModifier, value); 464 return this; 465 } 466 matchTextDirection(value: boolean): this { 467 modifierWithKey(this._modifiersWithKeys, ImageMatchTextDirectionModifier.identity, ImageMatchTextDirectionModifier, value); 468 return this; 469 } 470 fitOriginalSize(value: boolean): this { 471 modifierWithKey(this._modifiersWithKeys, ImageFitOriginalSizeModifier.identity, ImageFitOriginalSizeModifier, value); 472 return this; 473 } 474 fillColor(value: ResourceColor): this { 475 modifierWithKey(this._modifiersWithKeys, ImageFillColorModifier.identity, 476 ImageFillColorModifier, value); 477 return this; 478 } 479 objectFit(value: ImageFit): this { 480 modifierWithKey(this._modifiersWithKeys, ImageObjectFitModifier.identity, 481 ImageObjectFitModifier, value); 482 return this; 483 } 484 objectRepeat(value: ImageRepeat): this { 485 modifierWithKey(this._modifiersWithKeys, ImageObjectRepeatModifier.identity, 486 ImageObjectRepeatModifier, value); 487 return this; 488 } 489 autoResize(value: boolean): this { 490 modifierWithKey(this._modifiersWithKeys, ImageAutoResizeModifier.identity, 491 ImageAutoResizeModifier, value); 492 return this; 493 } 494 renderMode(value: ImageRenderMode): this { 495 modifierWithKey(this._modifiersWithKeys, ImageRenderModeModifier.identity, 496 ImageRenderModeModifier, value); 497 return this; 498 } 499 interpolation(value: ImageInterpolation): this { 500 modifierWithKey(this._modifiersWithKeys, ImageInterpolationModifier.identity, 501 ImageInterpolationModifier, value); 502 return this; 503 } 504 sourceSize(value: { width: number; height: number }): this { 505 modifierWithKey(this._modifiersWithKeys, ImageSourceSizeModifier.identity, 506 ImageSourceSizeModifier, value); 507 return this; 508 } 509 syncLoad(value: boolean): this { 510 modifierWithKey(this._modifiersWithKeys, ImageSyncLoadModifier.identity, 511 ImageSyncLoadModifier, value); 512 return this; 513 } 514 515 colorFilter(value: ColorFilter): this { 516 modifierWithKey(this._modifiersWithKeys, ImageColorFilterModifier.identity, 517 ImageColorFilterModifier, value); 518 return this; 519 } 520 copyOption(value: CopyOptions): this { 521 modifierWithKey(this._modifiersWithKeys, ImageCopyOptionModifier.identity, 522 ImageCopyOptionModifier, value); 523 return this; 524 } 525 borderRadius(value: Length | BorderRadiuses): this { 526 modifierWithKey(this._modifiersWithKeys, ImageBorderRadiusModifier.identity, ImageBorderRadiusModifier, value); 527 return this; 528 } 529 onComplete( 530 callback: (event?: { 531 width: number; 532 height: number; 533 componentWidth: number; 534 componentHeight: number; 535 loadingStatus: number; 536 contentWidth: number; 537 contentHeight: number; 538 contentOffsetX: number; 539 contentOffsetY: number; 540 }) => void, 541 ): this { 542 throw new Error('Method not implemented.'); 543 } 544 545 onError(callback: (event: { 546 componentWidth: number; 547 componentHeight: number; 548 message: string 549 }) => void): this { 550 throw new Error('Method not implemented.'); 551 } 552 onFinish(event: () => void): this { 553 throw new Error('Method not implemented.'); 554 } 555 border(value: BorderOptions): this { 556 modifierWithKey(this._modifiersWithKeys, ImageBorderModifier.identity, ImageBorderModifier, value); 557 return this; 558 } 559 opacity(value: number | Resource): this { 560 modifierWithKey(this._modifiersWithKeys, ImageOpacityModifier.identity, ImageOpacityModifier, value); 561 return this; 562 } 563 transition(value: TransitionOptions | TransitionEffect): this { 564 modifierWithKey(this._modifiersWithKeys, ImageTransitionModifier.identity, ImageTransitionModifier, value); 565 return this; 566 } 567} 568// @ts-ignore 569globalThis.Image.attributeModifier = function (modifier) { 570 const elmtId = ViewStackProcessor.GetElmtIdToAccountFor(); 571 let nativeNode = getUINativeModule().getFrameNodeById(elmtId); 572 let component = this.createOrGetNode(elmtId, () => { 573 return new ArkImageComponent(nativeNode); 574 }); 575 applyUIAttributes(modifier, nativeNode, component); 576 component.applyModifierPatch(); 577};