1e41f4b71Sopenharmony_ci# Introduction to Image Kit 2e41f4b71Sopenharmony_ci 3e41f4b71Sopenharmony_ciImage development is the process of parsing, processing, and constructing image pixel data to achieve the required image effect. Image development mainly involves image decoding, processing, and encoding. 4e41f4b71Sopenharmony_ci 5e41f4b71Sopenharmony_ciBefore image development, be familiar with the following basic concepts: 6e41f4b71Sopenharmony_ci 7e41f4b71Sopenharmony_ci- Image decoding 8e41f4b71Sopenharmony_ci 9e41f4b71Sopenharmony_ci The operation of decoding an archived image in a supported format into a pixel map for image display or processing. Currently, the following image formats are supported: JPEG, PNG, GIF, WebP, BMP, SVG, ICO, and DNG. 10e41f4b71Sopenharmony_ci 11e41f4b71Sopenharmony_ci- Pixel map 12e41f4b71Sopenharmony_ci 13e41f4b71Sopenharmony_ci A bitmap that is not compressed after being decoded. It is used for image display or processing. 14e41f4b71Sopenharmony_ci 15e41f4b71Sopenharmony_ci- Image processing 16e41f4b71Sopenharmony_ci 17e41f4b71Sopenharmony_ci A series of operations on the pixel map, such as rotation, scaling, opacity setting, image information obtaining, and pixel data reading and writing. 18e41f4b71Sopenharmony_ci 19e41f4b71Sopenharmony_ci- Image encoding 20e41f4b71Sopenharmony_ci 21e41f4b71Sopenharmony_ci The operation of encoding a pixel map into an archived image in different formats (only in JPEG, WebP, and PNG currently) for subsequent processing, such as storage and transmission. 22e41f4b71Sopenharmony_ci 23e41f4b71Sopenharmony_ciThe figure below illustrates the image development process. 24e41f4b71Sopenharmony_ci 25e41f4b71Sopenharmony_ci**Figure 1** Image development process 26e41f4b71Sopenharmony_ci 27e41f4b71Sopenharmony_ci 28e41f4b71Sopenharmony_ci 29e41f4b71Sopenharmony_ci1. Image retrieval: Obtain a raw image through the application sandbox. 30e41f4b71Sopenharmony_ci 31e41f4b71Sopenharmony_ci2. Instance creation: Create an **ImageSource** instance, which is the source class of decoded images and is used to obtain or modify image information. 32e41f4b71Sopenharmony_ci 33e41f4b71Sopenharmony_ci3. [Image decoding](image-decoding.md): Decode the image source to generate a pixel map. 34e41f4b71Sopenharmony_ci 35e41f4b71Sopenharmony_ci4. [Image processing](image-transformation.md): Process the pixel map by modifying the image attributes to implement image rotation, scaling, and cropping, and then use the [Image component](../../ui/arkts-graphics-display.md) to display the image. 36e41f4b71Sopenharmony_ci 37e41f4b71Sopenharmony_ci5. [Image encoding](image-encoding.md): Use the **ImagePacker** class to compress and encode the pixel map or image source to generate a new image. 38e41f4b71Sopenharmony_ci 39e41f4b71Sopenharmony_ciIn addition to the preceding basic image development capabilities, OpenHarmony provides the [image tool](image-tool.md) to ease your development. 40e41f4b71Sopenharmony_ci 41e41f4b71Sopenharmony_ci## Highlights 42e41f4b71Sopenharmony_ci 43e41f4b71Sopenharmony_ciImage Kit supports multiple image formats and uses efficient algorithms and optimization policies to speed up image processing. 44e41f4b71Sopenharmony_ci 45e41f4b71Sopenharmony_ci## Constraints 46e41f4b71Sopenharmony_ci 47e41f4b71Sopenharmony_ciDuring image processing, applications may need to request the read and write permissions from users on images. 48e41f4b71Sopenharmony_ci 49e41f4b71Sopenharmony_ci## Related Kits 50e41f4b71Sopenharmony_ci 51e41f4b71Sopenharmony_ciThe image framework provides the image encoding and decoding capabilities for the **\<image>** component and the Gallery application. The decoding result can be sent to the [**\<image>** component](../../ui/arkts-graphics-display.md) for display. 52