Skip to content

D
Docs

OpenHarmony / Docs
1 年多 前同步成功

通知 159
Star 292
Fork 28
D
Docs
未验证 提交 dd361cbb 编写于 作者: O openharmony_ci 提交者： Gitee
浏览文件
操作

!19829 modify image native doc 

Merge pull request !19829 from renhw001/master
上级 717dd3e3 3cb57119
隐藏空白更改
内联 并排
Showing with 63 addition and 162 deletion
zh-cn/application-dev/media/image-transformation-native.md
浏览文件 @ dd361cbb
# 图像变换(Native) # 图像变换(Native)
开发者可以通过本指导了解如何使用Native Image进行图片处理，包括图片的裁剪、旋转、缩放、翻转、偏移、设置透明度等。 开发者可以通过本指导了解如何使用Native Image的接口。
## 开发步骤 ## 开发步骤
...@@ -22,9 +22,9 @@ ...@@ -22,9 +22,9 @@
static napi_value Init(napi_env env, napi_value exports) static napi_value Init(napi_env env, napi_value exports)
{ {
napi_property_descriptor desc[] = { napi_property_descriptor desc[] = {
{ "createPixelMap", nullptr, CreatePixelMap, nullptr, nullptr, nullptr, napi_default, nullptr }, { "testGetImageInfo", nullptr, TestGetImageInfo, nullptr, nullptr, nullptr, napi_default, nullptr },
{ "createAlphaPixelMap", nullptr, CreateAlphaPixelMap, nullptr, nullptr, nullptr, napi_default, nullptr }, { "testAccessPixels", nullptr, TestAccessPixels, nullptr, nullptr, nullptr, napi_default, nullptr },
{ "transform", nullptr, Transform, nullptr, nullptr, nullptr, napi_default, nullptr } { "testUnAccessPixels", nullptr, TestUnAccessPixels, nullptr, nullptr, nullptr, napi_default, nullptr },
}; };
napi_define_properties(env, exports, sizeof(desc) / sizeof(desc[0]), desc); napi_define_properties(env, exports, sizeof(desc) / sizeof(desc[0]), desc);
...@@ -40,159 +40,56 @@ ...@@ -40,159 +40,56 @@
在hello.cpp文件中获取JS的资源对象，并转为Native的资源对象，即可调用Native接口，调用方式示例代码如下： 在hello.cpp文件中获取JS的资源对象，并转为Native的资源对象，即可调用Native接口，调用方式示例代码如下：
1. 根据像素数组创建PixelMap对象。 1. 获取**PixelMap**的信息，并记录信息到**OhosPixelMapInfo**结构中。
```c++
```c++ static napi_value TestGetImageInfo(napi_env env, napi_callback_info info)
//创建PixelMap对象
napi_value CreatePixelMap(napi_env env, napi_callback_info info)
{ {
napi_value udfVar = nullptr; napi_value result = nullptr;
napi_value thisVar = nullptr; napi_get_undefined(env, &result);
napi_value argValue[2] = {0};
size_t argCount = 2;
void* buffer = nullptr; napi_value thisVar = nullptr;
size_t bufferSize = 0; napi_value argValue[1] = {0};
struct OhosPixelMapCreateOps createOps; size_t argCount = 1;
napi_value pixelmap = nullptr;
napi_get_undefined(env, &udfVar);
napi_get_cb_info(env, info, &argCount, argValue, &thisVar, nullptr); napi_get_cb_info(env, info, &argCount, argValue, &thisVar, nullptr);
if (napi_get_arraybuffer_info(env, argValue[0], &buffer, &bufferSize) != napi_ok ||
buffer == nullptr || bufferSize == 0) { OHOS::Media::OhosPixelMapInfo pixelMapInfo;
return udfVar; OHOS::Media::OH_GetImageInfo(env, argValue[0], &pixelMapInfo);
} return result;
createOps.width = 4;
createOps.height = 6;
createOps.pixelFormat = 4;
createOps.alphaType = 0;
int32_t res = OH_PixelMap_CreatePixelMap(env, createOps, (uint8_t *)buffer, bufferSize, &pixelmap);
if (res != OHOS_IMAGE_RESULT_SUCCESS || pixelmap == nullptr) {
return udfVar;
}
return pixelmap;
} }
```
//创建仅含有alpha通道的PixelMap对象 2. 获取**PixelMap**对象数据的内存地址，并锁定该内存。
napi_value CreateAlphaPixelMap(napi_env env, napi_callback_info info) ```c++
static napi_value TestAccessPixels(napi_env env, napi_callback_info info)
{ {
napi_value udfVar = nullptr; napi_value result = nullptr;
napi_get_undefined(env, &result);
napi_value thisVar = nullptr; napi_value thisVar = nullptr;
napi_value argValue[1] = {0}; napi_value argValue[1] = {0};
size_t argCount = 1; size_t argCount = 1;
napi_value alphaPixelmap = nullptr; napi_get_cb_info(env, info, &argCount, argValue, &thisVar, nullptr);
napi_get_undefined(env, &udfVar);
if (napi_get_cb_info(env, info, &argCount, argValue, &thisVar, nullptr) != napi_ok || void* addrPtr = nullptr;
argCount < 1 || argValue[0] == nullptr) { OHOS::Media::OH_AccessPixels(env, argValue[0], &addrPtr);
return udfVar; return result;
}
int32_t res = OH_PixelMap_CreateAlphaPixelMap(env, argValue[0], &alphaPixelmap);
if (res != OHOS_IMAGE_RESULT_SUCCESS || alphaPixelmap == nullptr) {
return udfVar;
}
return alphaPixelmap;
} }
``` ```
3. 释放**PixelMap**对象数据的内存锁。
2. 图像变换。具体操作参考示例代码注释。
```c++ ```c++
napi_value Transform(napi_env env, napi_callback_info info) static napi_value TestUnAccessPixels(napi_env env, napi_callback_info info)
{ {
napi_value thisVar = nullptr;
napi_value argValue[1] = {0};
size_t argCount = 1;
if (napi_get_cb_info(env, info, &argCount, argValue, &thisVar, nullptr) != napi_ok ||
argCount < 1 || argValue[0] == nullptr) {
return nullptr;
}
napi_value result = nullptr; napi_value result = nullptr;
napi_get_undefined(env, &result); napi_get_undefined(env, &result);
NativePixelMap* native = OH_PixelMap_InitNativePixelMap(env, argValue[0]); napi_value thisVar = nullptr;
if (native == nullptr) { napi_value argValue[1] = {0};
return result; size_t argCount = 1;
}
//获取图片信息。 napi_get_cb_info(env, info, &argCount, argValue, &thisVar, nullptr);
struct OhosPixelMapInfo pixelmapInfo;
OH_PixelMap_GetImageInfo(native, &pixelmapInfo);
//获取PixelMap对象每行字节数。
int32_t rowBytes;
OH_PixelMap_GetBytesNumberPerRow(native, &rowBytes);
//获取PixelMap对象是否可编辑的状态。
int32_t editable = 0;
OH_PixelMap_GetIsEditable(native, &editable);
//获取PixelMap对象是否支持Alpha通道。
int32_t supportAlpha = 0;
OH_PixelMap_IsSupportAlpha(native, &supportAlpha);
//设置PixelMap对象的Alpha通道。
int32_t alphaAble = 0;
OH_PixelMap_SetAlphaAble(native, alphaAble);
//获取PixelMap对象像素密度。
int32_t densityG;
OH_PixelMap_GetDensity(native, &densityG);
//设置PixelMap对象像素密度。
int32_t densityS = 100;
OH_PixelMap_SetDensity(native, densityS);
//设置PixelMap对象的透明度。
float opacity = 0.5;
OH_PixelMap_SetOpacity(native, opacity);
//设置缩放比例。
//scaleX：宽为原来的0.5。
//scaleY：高为原来的0.5。
float scaleX = 0.5;
float scaleY = 0.5;
OH_PixelMap_Scale(native, scaleX, scaleY);
//设置偏移。
//translateX：向下偏移50。
//translateY：向右偏移50。
float translateX = 50;
float translateY = 50;
OH_PixelMap_Translate(native, translateX, translateY);
//设置顺时针旋转90度。
float angle = 90;
OH_PixelMap_Rotate(native, angle);
//设置翻转
//flipX：水平翻转。0为不翻转，1为翻转。
//flipY：垂直翻转。0为不翻转，1为翻转。
int32_t flipX = 0;
int32_t flipY = 1;
OH_PixelMap_Flip(native, flipX, flipY);
//设置裁剪区域。
// cropX：裁剪起始点横坐标0
// cropY：裁剪起始点纵坐标0
// cropH：裁剪高度10，方向为从上往下（裁剪后的图片高度为10）
// cropW：裁剪宽度10，方向为从左到右（裁剪后的图片宽度为10
int32_t cropX = 1;
int32_t cropY = 1;
int32_t cropW = 10;
int32_t cropH = 10;
OH_PixelMap_Crop(native, cropX, cropY, cropW, cropH);
uint8_t* pixelAddr = nullptr;
//获取PixelMap对象数据的内存地址，并锁定该内存。
OH_PixelMap_AccessPixels(native, &pixelAddr);
//释放PixelMap对象数据的内存锁。
OH_PixelMap_UnAccessPixels(native);
OHOS::Media::OH_UnAccessPixels(env, argValue[0]);
return result; return result;
} }
``` ```
...@@ -205,37 +102,41 @@ ...@@ -205,37 +102,41 @@
```js ```js
import testNapi from 'libentry.so' import testNapi from 'libentry.so'
import image from '@ohos.multimedia.image' import image from '@ohos.multimedia.image';
@Entry @Entry
@Component @Component
struct Index { struct Index {
@State _pixelMap: image.PixelMap = undefined; @State message: string = 'IMAGE'
build() { @State _PixelMap: image.PixelMap = undefined
Row() {
Column() { build() {
Button("PixelMap") Row() {
.width(100) Column() {
.height(100) Button(this.message)
.onClick(() => { .fontSize(50)
const color = new ArrayBuffer(96); .fontWeight(FontWeight.Bold)
var bufferArr = new Uint8Array(color); .onClick(() => {
for (var i = 0; i < bufferArr.length; i++) { const color = new ArrayBuffer(96);
bufferArr[i] = 0x80; let opts = { alphaType: 0, editable: true, pixelFormat: 4, scaleMode: 1, size: { height: 4, width: 6 } }
} image.createPixelMap(color, opts)
.then( pixelmap => {
this._pixelMap = testNapi.createPixelMap(color); this._PixelMap = pixelmap;
testNapi.transform(this._pixelMap);
}) })
Image(this._pixelMap) testNapi.testGetImageInfo(this._PixelMap);
.width(500) console.info("Test GetImageInfo success");
.height(500)
.objectFit(ImageFit.Cover) testNapi.testAccessPixels(this._PixelMap);
} console.info("Test AccessPixels success");
.width('100%')
} testNapi.testUnAccessPixels(this._PixelMap);
.height('100%') console.info("Test UnAccessPixels success");
})
} }
.width('100%')
}
.height('100%')
}
} }
``` ```
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或