1 2 3# Image组件 4 5- [简介](#introduction) 6- [目录](#index) 7- [使用说明](#usage-guidelines) 8 - [读像素到数组](#readPixelsToBuffer) 9 - [从区域读像素](readpixels) 10 - [写像素到区域](#writePixels) 11 - [写buffer到像素](#writeBufferToPixels) 12 - [获取图片基本信息](#getImageInfo1) 13 - [获取字节](#getBytesNumberPerRow) 14 - [获取位图buffer](#getPixelBytesNumber) 15 - [获取像素密度](#getDensity) 16 - [设置透明比率](#opacity) 17 - [生成Alpha通道](#createAlphaPixelmap) 18 - [图片缩放](#scale) 19 - [位置变换](#translate) 20 - [图片旋转](#rotate) 21 - [图片翻转](#flip) 22 - [图片裁剪](#crop) 23 - [释放位图](#release1) 24 - [从图片源获取信息](#getImageInfo) 25 - [获取整型值](#getImagePropertyInt) 26 - [修改图片属性](#modifyImageProperty) 27 - [创建位图](#createPixelMap) 28 - [更新数据](#updateData) 29 - [释放图片源实例](#release2) 30 - [打包图片](#packing) 31 - [释放packer实例](#release3) 32 - [获取surface id](#getReceivingSurfaceId) 33 - [读取最新图片](#readLatestImage) 34 - [读取下一张图片](#readNextImage) 35 - [注册回调](#on) 36 - [释放receiver实例](#release4) 37 - [获取组件缓存](#getComponent) 38 - [释放image实例](#release5) 39 - [CreateIncrementalSource](#CreateIncrementalSource) 40 - [创建ImageSource实例](#createImageSource2) 41 - [创建PixelMap实例](#createPixelMap2) 42 - [创建imagepacker实例](#createImagePacker2) 43 - [创建imagereceiver实例](#createImageReceiver2) 44 45## 简介<a name="introduction"></a> 46 47**image_framework仓库**提供了一系列易用的接口用于存放image的源码信息,提供创建图片源和位图管理能力,支持运行标准系统的设备使用。 48 49**图1** Image组件架构图 50 51 52 53 54 55支持能力列举如下: 56 57- 创建、释放位图。 58- 读写像素。 59- 获取位图信息。 60- 创建、释放图片源。 61- 获取图片源信息。 62- 创建、释放packer实例。 63 64## 目录<a name="index"></a> 65 66仓目录结构如下: 67 68``` 69/foundation/multimedia/image_framework 70├── frameworks # 框架代码 71│ ├── innerkitsimpl # 内部接口实现 72│ │ └──image # Native 实现 73│ └── kitsimpl # 外部接口实现 74│ └──image # 外部 NAPI 实现 75├── interfaces # 接口代码 76│ ├── innerkits # 内部 Native 接口 77│ └── kits # 外部 JS 接口 78├── LICENSE # 证书文件 79├── ohos.build # 编译文件 80├── sa_profile # 服务配置文件 81└── services # 服务实现 82``` 83 84## 使用说明<a name="usage-guidelines"></a> 85 86### 1.读像素到数组<a name="readPixelsToBuffer"></a> 87 88image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何将像素读到缓冲区。 89 90通过调用readPixelsToBuffer读pixels到buffer。 91 92``` 93readPixelsToBuffer(dst: ArrayBuffer): Promise<void>; 94readPixelsToBuffer(dst: ArrayBuffer, callback: AsyncCallback<void>): void; 95``` 96 97示例: 98 99``` 100pixelmap.readPixelsToBuffer(readBuffer).then(() => {}) 101``` 102 103### 2.读pixels<a name="readPixels"></a> 104 105image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何按照区域读像素。 106 107通过调用readPixels读pixels。 108 109``` 110readPixels(area: PositionArea): Promise<void>; 111readPixels(area: PositionArea, callback: AsyncCallback<void>): void; 112``` 113 114示例: 115 116``` 117pixelmap.readPixels(area).then(() => {}) 118``` 119 120### 3.写pixels<a name="writePixels"></a> 121 122image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何写像素。 123 124通过调用writepixels写到指定区域。 125 126``` 127writePixels(area: PositionArea): Promise<void>; 128writePixels(area: PositionArea, callback: AsyncCallback<void>): void; 129``` 130 131示例: 132 133``` 134pixelmap.writePixels(area, () => {}) 135``` 136 137### 4.writeBufferToPixels<a name="writeBufferToPixels"></a> 138 139image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何将数据写进pixels。 140 141通过调用writeBufferToPixels写到pixel。 142 143``` 144writeBufferToPixels(src: ArrayBuffer): Promise<void>; 145writeBufferToPixels(src: ArrayBuffer, callback: AsyncCallback<void>): void; 146``` 147 148示例: 149 150``` 151pixelmap.writeBufferToPixels(writeColor, () => {}) 152``` 153 154### 5.getImageInfo<a name="getImageInfo1"></a> 155 156image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何获取图片信息。 157 158通过调用getImageInfo获取图片基本信息。 159 1601.使用create通过属性创建pixelmap。 161 162``` 163image.createPixelMap(color, opts, pixelmap =>{}) 164``` 165 1662.使用getImageInfo获取图片基本信息。 167 168``` 169pixelmap.getImageInfo( imageInfo => {}) 170``` 171 172### 6.getBytesNumberPerRow<a name="getBytesNumberPerRow"></a> 173 174image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何获取每行字节数。 175 176通过调用getBytesNumberPerRow获取字节数。 177 178``` 179getBytesNumberPerRow(): Promise<number>; 180getBytesNumberPerRow(callback: AsyncCallback<number>): void; 181``` 182 183示例: 184 185``` 186pixelmap.getBytesNumberPerRow((num) => {}) 187``` 188 189### 7.getPixelBytesNumber<a name="getPixelBytesNumber"></a> 190 191image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何获取buffer。 192 193通过调用getPixelBytesNumber获取buffer数。 194 195``` 196getPixelBytesNumber(): Promise<number>; 197getPixelBytesNumber(callback: AsyncCallback<number>): void; 198``` 199 200示例: 201 202``` 203pixelmap.getPixelBytesNumber().then((num) => { 204 console.info('TC_026 num is ' + num) 205 expect(num == expectNum).assertTrue() 206 done() 207 }) 208``` 209 210### 8.getDensity<a name="getDensity"></a> 211 212image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何获取图片像素密度。 213 214通过调用getDensity获取图片像素密度。 215 216``` 217getDensity():number; 218``` 219 220示例: 221 222``` 223let getDensity = pixelmap.getDensity(); 224``` 225 226### 9.opacity<a name="opacity"></a> 227 228image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何设置图片透明比率。 229 230通过调用opacity设置图片透明比率。 231 232``` 233opacity(rate: number, callback: AsyncCallback<void>): void; 234opacity(rate: number): Promise<void>; 235``` 236 237示例: 238 239``` 240async function () { 241 await pixelMap.opacity(0.5); 242} 243``` 244 245### 10.createAlphaPixelmap<a name="createAlphaPixelmap"></a> 246 247image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何生成一个仅包含Alpha通道信息的pixelmap。 248 249通过调用createAlphaPixelmap生成一个仅包含Alpha通道信息的pixelmap,可用于阴影效果。 250 251``` 252createAlphaPixelmap(): Promise<PixelMap>; 253createAlphaPixelmap(callback: AsyncCallback<PixelMap>): void; 254``` 255 256示例: 257 258``` 259pixelMap.createAlphaPixelmap(async (err, alphaPixelMap) => {}) 260``` 261 262### 11.scale<a name="scale"></a> 263 264image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何根据输入的宽高对图片进行缩放。 265 266通过调用scale对图片进行缩放。 267 268``` 269scale(x: number, y: number, callback: AsyncCallback<void>): void; 270scale(x: number, y: number): Promise<void>; 271``` 272 273示例: 274 275``` 276await pixelMap.scale(2.0, 1.0); 277``` 278 279### 12.translate<a name="translate"></a> 280 281image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何根据输入的坐标对图片进行位置变换。 282 283通过调用translate对图片进行位置变换。 284 285``` 286translate(x: number, y: number, callback: AsyncCallback<void>): void; 287translate(x: number, y: number): Promise<void>; 288``` 289 290示例: 291 292``` 293await pixelMap.translate(3.0, 1.0); 294``` 295 296### 13.rotate<a name="rotate"></a> 297 298image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何根据输入的角度对图片进行旋转。 299 300通过调用rotate对图片进行旋转。 301 302``` 303rotate(angle: number, callback: AsyncCallback<void>): void; 304rotate(angle: number): Promise<void>; 305``` 306 307示例: 308 309``` 310await pixelMap.rotate(90.0); 311``` 312 313### 14.flip<a name="flip"></a> 314 315image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何根据输入的条件对图片进行翻转。 316 317通过调用flip对图片进行翻转。 318 319``` 320flip(horizontal: boolean, vertical: boolean, callback: AsyncCallback<void>): void; 321flip(horizontal: boolean, vertical: boolean): Promise<void>; 322``` 323 324示例: 325 326``` 327await pixelMap.flip(false, true); 328``` 329 330### 15.crop<a name="crop"></a> 331 332image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何根据输入的尺寸对图片进行裁剪。 333 334通过调用crop对图片进行裁剪。 335 336``` 337crop(region: Region, callback: AsyncCallback<void>): void; 338crop(region: Region): Promise<void>; 339``` 340 341示例: 342 343``` 344await pixelMap.crop({ x: 0, y: 0, size: { height: 100, width: 100 } }); 345``` 346 347### 16.release<a name="release1"></a> 348 349image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何释放pixelmap实例。 350 351通过调用release释放pixelmap。 352 3531.使用create通过属性创建pixelmap。 354 355``` 356image.createPixelMap(color, opts, pixelmap =>{} 357``` 358 3592.使用release释放pixelmap实例 360 361``` 362pixelmap.release(()=>{ 363 expect(true).assertTrue(); 364 console.log('TC_027-1 suc'); 365 done(); 366 }) 367``` 368 369### 17.getImageInfo<a name="getImageInfo"></a> 370 371image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何根据特定数字获取图片信息。 372 373``` 374getImageInfo(index: number, callback: AsyncCallback<ImageInfo>): void; 375getImageInfo(callback: AsyncCallback<ImageInfo>): void; 376getImageInfo(index?: number): Promise<ImageInfo>; 377``` 378 3791.创建imagesource。 380 381``` 382const imageSourceApi = image.createImageSource('/sdcard/test.jpg') 383``` 384 3852.获取图片信息。 386 387``` 388imageSourceApi.getImageInfo((imageInfo) => { 389 console.info('TC_045 imageInfo') 390 expect(imageInfo !== null).assertTrue() 391 done() 392 }) 393``` 394 395### 18.getImageProperty<a name="getImageProperty"></a> 396 397image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何根据索引获取图像的指定属性键的值。 398 399``` 400getImageProperty(key:string, options?: GetImagePropertyOptions): Promise<string>; 401getImageProperty(key:string, callback: AsyncCallback<string>): void; 402``` 403 404### 19.modifyImageProperty<a name="modifyImageProperty"></a> 405 406image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何通过指定的键修改图片属性的值。 407 408``` 409modifyImageProperty(key: string, value: string): Promise<void>; 410modifyImageProperty(key: string, value: string, callback: AsyncCallback<void>): void; 411``` 412 413### 20.createPixelMap<a name="createPixelMap"></a> 414 415image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何创建pixelmap实例。 416 4171.使用createImageSource创建图片源。 418 419``` 420const imageSourceApi = image.createImageSource('/sdcard/test.jpg') 421``` 422 4232.使用createPixelMap创建pixelmap 424 425``` 426imageSourceApi.createPixelMap(decodingOptions, (pixelmap) => {}) 427``` 428 429### 21.updateData<a name="updateData"></a> 430 431image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何更新图片数据源。 432 433``` 434updateData(buf: ArrayBuffer, isFinished: boolean, value: number, length: number): Promise<void>; 435updateData(buf: ArrayBuffer, isFinished: boolean, value: number, length: number, callback: AsyncCallback<void>): void; 436``` 437 4381.使用CreateIncrementalSource创建imagesource。 439 440``` 441const dataBuffer = new ArrayBuffer(96) 442const imageSourceIncrementalSApi = image.CreateIncrementalSource(dataBuffer) 443``` 444 4452.使用updateData更新图片源。 446 447``` 448imageSourceIncrementalSApi.updateData(array, false, (error, data) => {}) 449``` 450 451### 22.release<a name="release2"></a> 452 453image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何释放图片源实例。 454 455``` 456release(callback: AsyncCallback<void>): void; 457release(): Promise<void>; 458``` 459 460### 23.packing<a name="packing"></a> 461 462image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何压缩图片。 463 464``` 465packing(source: ImageSource, option: PackingOption, callback: AsyncCallback<ArrayBuffer>): void; 466packing(source: ImageSource, option: PackingOption): Promise<ArrayBuffer>; 467packing(source: PixelMap, option: PackingOption, callback: AsyncCallback<ArrayBuffer>): void; 468packing(source: PixelMap, option: PackingOption): Promise<ArrayBuffer>; 469``` 470 4711.使用createImageSource创建图片源。 472 473``` 474const imageSourceApi = image.createImageSource('/sdcard/test.png') 475``` 476 4772.创建packer实例。 478 479``` 480imagePackerApi.packing(imageSourceApi, packOpts).then((data) => {}) 481``` 482 483### 24.release<a name="release3"></a> 484 485image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何释放packer实例。 486 487``` 488release(callback: AsyncCallback<void>): void; 489release(): Promise<void>; 490``` 491 4921.使用createImagePacker创建packer实例。 493 494``` 495const imagePackerApi = image.createImagePacker() 496``` 497 4982.使用release释放packer实例。 499 500``` 501imagePackerApi.release() 502``` 503 504### 25.getReceivingSurfaceId<a name="getReceivingSurfaceId"></a> 505 506image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何获取surface id供Camera或其他组件使用。 507 508``` 509getReceivingSurfaceId(): Promise<string>; 510getReceivingSurfaceId(callback: AsyncCallback<string>): void; 511``` 512 513示例: 514``` 515receiver.getReceivingSurfaceId().then( id => { } ) 516``` 517 518### 26.readLatestImage<a name="readLatestImage"></a> 519 520image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何读取最新的图片。 521 522``` 523readLatestImage(callback: AsyncCallback<Image>): void; 524readLatestImage(): Promise<Image>; 525``` 526 527示例: 528``` 529receiver.readLatestImage().then(img => { }) 530``` 531 532### 27.readNextImage<a name="readNextImage"></a> 533 534image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何读取下一张图片。 535 536``` 537readNextImage(callback: AsyncCallback<Image>): void; 538readNextImage(): Promise<Image>; 539``` 540 541示例: 542``` 543receiver.readNextImage().then(img => {}) 544``` 545 546### 28.on<a name="on"></a> 547 548image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何接收图片时注册回调。 549 550``` 551on(type: 'imageArrival', callback: AsyncCallback<void>): void; 552``` 553 554示例: 555``` 556receiver.on('imageArrival', () => {}) 557``` 558 559### 29.release<a name="release4"></a> 560 561image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何释放receiver实例。 562 563``` 564release(callback: AsyncCallback<void>): void; 565release(): Promise<void>; 566``` 567 5681.使用createImageReceiver创建receiver实例。 569 570``` 571const imageReceiverApi = image.createImageReceiver() 572``` 573 5742.使用release释放packer实例。 575 576``` 577imageReceiverApi.release() 578``` 579 580### 30.getComponent<a name="getComponent"></a> 581 582image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何根据图像的组件类型从图像中获取组件缓存。 583 584``` 585getComponent(componentType: ComponentType, callback: AsyncCallback<Component>): void; 586getComponent(componentType: ComponentType): Promise<Component>; 587``` 588 589示例: 590``` 591img.getComponent(4).then(component => { }) 592``` 593 594### 31.release<a name="release5"></a> 595 596image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何释放image实例。 597 598``` 599release(callback: AsyncCallback<void>): void; 600release(): Promise<void>; 601``` 602 603### 32.CreateIncrementalSource<a name="CreateIncrementalSource"></a> 604 605image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何创建增量imagesource。 606 607``` 608CreateIncrementalSource(buf: ArrayBuffer): ImageSource; 609CreateIncrementalSource(buf: ArrayBuffer, options?: SourceOptions): ImageSource; 610``` 611 6121.创建buffer。 613 614``` 615const data = new ArrayBuffer(96) 616``` 617 6182.使用CreateIncrementalSource创建imagesource。 619 620``` 621const imageSourceApi = image.CreateIncrementalSource(data) 622``` 623 624### 33.创建ImageSource实例<a name="createImageSource2"></a> 625 626image提供了操作imagesource的接口,如创建、读取和删除,以下展示了如何通过不同方式创建imagesource。 627 6281.通过文件路径创建imagesource。 629 630``` 631createImageSource(uri: string): ImageSource; 632createImageSource(uri: string, options: SourceOptions): ImageSource; 633``` 634 635示例: 636``` 637const imageSourceApi = image.createImageSource('/sdcard/test.jpg'); 638``` 639 6402.通过fd创建imagesource。 641 642``` 643createImageSource(fd: number): ImageSource; 644createImageSource(fd: number, options: SourceOptions): ImageSource; 645``` 646 647示例: 648``` 649const imageSourceApi = image.createImageSource(fd); 650``` 651 6523.通过buffer创建imagesource。 653 654``` 655createImageSource(buf: ArrayBuffer): ImageSource; 656createImageSource(buf: ArrayBuffer, options: SourceOptions): ImageSource; 657``` 658 659示例: 660``` 661const data = new ArrayBuffer(112); 662const imageSourceApi = image.createImageSource(data); 663``` 664 665### 34.创建PixelMap实例<a name="createPixelMap2"></a> 666 667image提供了操作pixelmap的接口,如创建、读取和删除,以下展示了如何通过属性创建pixelmap。 668 669``` 670createPixelMap(colors: ArrayBuffer, options: InitializationOptions): Promise<PixelMap>; 671createPixelMap(colors: ArrayBuffer, options: InitializationOptions, callback: AsyncCallback<PixelMap>): void; 672``` 673 6741.设置属性。 675 676``` 677const Color = new ArrayBuffer(96) 678let opts = { 679 alphaType: 0, 680 editable: true, 681 pixelFormat: 4, 682 scaleMode: 1, 683 size: { height: 2, width: 3 }, 684} 685``` 686 6872.调用createpixelmap通过属性创建pixelmap实例。 688 689``` 690image.createPixelMap(Color, opts) 691 .then((pixelmap) => { 692 expect(pixelmap !== null).assertTrue() 693 console.info('Succeeded in creating pixelmap.') 694 done() 695 }) 696``` 697 698### 35.创建imagepacker实例<a name="createImagePacker2"></a> 699 700image提供了操作imagepacker的接口,以下展示了如何通过属性创建imagepacker。 701 702``` 703createImagePacker(): ImagePacker; 704``` 705 7061.创建imagesource。 707 708``` 709const imageSourceApi = image.createImageSource('/sdcard/test.png') 710``` 711 7122.创建imagepacker。 713 714``` 715const imagePackerApi = image.createImagePacker() 716``` 717 718### 36.创建imagereceiver实例<a name="createImageReceiver2"></a> 719 720image提供了操作imagereceiver的接口,以下展示了如何通过属性创建imagereceiver。 721 722``` 723createImageReceiver(width: number, height: number, format: number, capacity: number): ImageReceiver; 724``` 725 726## 相关仓<a name="relevant"></a> 727 728[multimedia\_image\_framework](https://gitee.com/openharmony/multimedia_image_framework/blob/master/README_zh.md)