1# Native Window 2 3### 介绍 4 5本示例中主要介绍开发者在利用[Native XComponent](https://docs.openharmony.cn/pages/v4.1/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-xcomponent.md)来获取[NativeWindow](https://docs.openharmony.cn/pages/v4.0/zh-cn/application-dev/reference/native-apis/_native_window.md)实例，通过数据填充改变矩形框颜色。并提供从[NativeImage](https://docs.openharmony.cn/pages/v4.1/zh-cn/application-dev/reference/apis-arkgraphics2d/_o_h___native_image.md)中获取NativeWindow进行buffer轮转的案例，通过NativeWindow生产buffer来触发NativeImage的可用帧回调。 6 7### 效果预览 8 9| 主页 | 改变矩形框颜色 | 生产buffer | 获取可用帧回调次数 | 10|----------------------------------------------|---------------------------------------------------|---------------------------------------------------|-----------------------------------------------------------| 11|  |  |  |  | 12| attachbuffer | detachbuffer | fit模式(手机） | 拉伸模式（手机） | 13|  |  |  |  | 14 15 16使用说明 17 181. 安装编译生成的hap包，并打开应用； 192. 点击页面底部“Chaneg Color”按钮，矩形框填充区域将改变颜色，黄蓝切换； 203. 点击页面底部“produce buffer”按钮，NativeWindow将生产数据并发送给NativeImage，页面展示了生产buffer的次数； 214. 点击页面底部“update available buffer count”按钮，将展示NativeImage收到的可用帧回调次数。 225. 点击页面底部“update bufferqueuesize, attachedbuffer, cachebuffer"按钮，将更新三项数值，分别是NativeWindow的buffer队列容量，attach到NativeWindow的buffer数量，缓存区buffer数量。 236. 点击页面底部”attachbuffer“, 在cachebuffer大于0时将buffer添加到nativewindow中，attachedbuffer数值加1，cachebuffer数值减1；cachebuffer为0时不做处理。(需要点第五步按钮更新数值) 247. 点击页面底部”detachbuffer", 在attachedbuffer大于0时将buffer添加到缓存区cachebuffer中，attachedbuffer数值减1，cachebuffer数值加1； attachedbuffer为0时不做处理。(需要点第五步按钮更新数值) 258. 点击页面顶部"Change ScalingMode"按钮，在支持fit模式的设备可以切换色块居中显示或平铺显示，开发板不支持fit模式。 26 27### 工程目录 28 29``` 30├──entry/src/main 31│ ├──cpp // C++代码区 32│ │ ├──CMakeLists.txt // CMake配置文件 33│ │ ├──logger_common.h // 日志封装定义文件 34│ │ ├──NativeImageAdaptor.cpp // NativeImage功能适配模块 35│ │ ├──NativeRender.cpp // NativeWindow和XComponentContext联合显示模块 36│ ├──ets // ets代码区 37│ │ ├──entryability 38│ │ │ ├──EntryAbility.ts // 程序入口类 39| | ├──interface 40│ │ │ └──NativeWindowContext.ts // NativeWindowContext 41│ │ └──pages // 页面文件 42│ │ └──Index.ets // 主界面 43| ├──resources // 资源文件目录 44``` 45 46### 具体实现 47 481.通过在IDE中创建Native c++ 工程，在c++代码中定义对外接口为DrawColor，在js侧调用该接口可改变窗口颜色； 492.从NativeImage中创建NativeWindow，在c++代码中定义对外接口为ProduceBuffer，js调用该接口后，NativeWindow会生产buffer并将该buffer flush给NativeImage，之后NativeImage将收到可用帧的回调; 503.js侧调用GetAvailableCount接口，可以获取回调触发次数，并展示在界面上，正常情况下FlushBuffer的次数和可用帧回调触发次数一致; 514.在c++代码中定义对外接口AttachBuffer，js侧调用该接口后，当缓存区cachebuffer数量大于0时，会添加1个cachebuffer到NativeWindow中，cachebuffer数量为0时不操作； 525.js侧调用DetachBuffer接口，当NativeWindow的attachedbuffer数量大于0时，会将NativeWindow中的buffer移除，放置到缓存区中，当attachedbuffer为0时不操作； 536.js侧调用GetBufferQueueSize、GetAttachBufferCount、GetCacheBufferCount接口时，将获取当前NativeWindow的bufferqueue容量、已经attach到nativewindow的buffer数量，缓存区buffer数量 547.js侧调用ChangeScalingMode接口，c++代码中会切换DrawColor的scalingmode，切换显示模式 55 56源码参考：[cpp目录](entry/src/main/cpp)下的文件。 57 58涉及到的相关接口： 59 60 61| 接口名 | 描述 | 62| -------- | -------- | 63| OH_NativeWindow_CreateNativeWindow (void *pSurface) | 创建OHNativeWindow实例，每次调用都会产生一个新的OHNativeWindow实例 | 64| OH_NativeWindow_DestroyNativeWindow (OHNativeWindow *window) | 将OHNativeWindow对象的引用计数减1，当引用计数为0的时候，该OHNativeWindow对象会被析构掉 | 65| OH_NativeWindow_CreateNativeWindowBufferFromNativeBuffer (OH_NativeBuffer *nativeBuffer) | 创建OHNativeWindowBuffer实例，每次调用都会产生一个新的OHNativeWindowBuffer实例 | 66| OH_NativeWindow_DestroyNativeWindowBuffer (OHNativeWindowBuffer *buffer) | 将OHNativeWindowBuffer对象的引用计数减1，当引用计数为0的时候，该OHNativeWindowBuffer对象会被析构掉 | 67| OH_NativeWindow_NativeWindowRequestBuffer (OHNativeWindow *window, OHNativeWindowBuffer **buffer, int *fenceFd) | 通过OHNativeWindow对象申请一块OHNativeWindowBuffer，用以内容生产 | 68| OH_NativeWindow_NativeWindowFlushBuffer (OHNativeWindow *window, OHNativeWindowBuffer *buffer, int fenceFd, Region region) | 通过OHNativeWindow将生产好内容的OHNativeWindowBuffer放回到Buffer队列中，用以内容消费 | 69| OH_NativeWindow_GetLastFlushedBuffer (OHNativeWindow *window, OHNativeWindowBuffer **buffer) | 从OHNativeWindow获取上次送回到buffer队列中的OHNativeWindowBuffer | 70| OH_NativeWindow_NativeWindowHandleOpt (OHNativeWindow *window, int code,...) | 设置/获取OHNativeWindow的属性，包括设置/获取宽高、内容格式等 | 71| OH_NativeWindow_GetBufferHandleFromNative (OHNativeWindowBuffer *buffer) | 通过OHNativeWindowBuffer获取该buffer的BufferHandle指针 | 72| OH_NativeBuffer_SetColorSpace (OH_NativeBuffer *buffer, OH_NativeBuffer_ColorSpace colorSpace) | 为OH_NativeBuffer设置颜色空间属性 | 73| OH_NativeImage_SetOnFrameAvailableListener (OH_NativeImage *image, OH_OnFrameAvailableListener listener) | 设置帧可用回调 | 74| OH_NativeImage_UnsetOnFrameAvailableListener (OH_NativeImage *image) | 取消设置帧可用回调 | 75| OH_NativeImage_AcquireNativeWindow (OH_NativeImage *image) | 获取与OH_NativeImage相关联的OHNativeWindow指针。 该OHNativeWindow后续不再需要时需要调用OH_NativeWindow_DestroyNativeWindow释放 | 76| OH_NativeWindow_GetSurfaceId (OHNativeWindow *window, uint64_t *surfaceId) | 获取surfaceId | 77| OH_NativeWindow_CreateNativeWindowFromSurfaceId (uint64_t surfaceId, OHNativeWindow **window) | 通过surfaceId获取对应的OHNativeWindow | 78| OH_NativeBuffer_MapPlanes (OH_NativeBuffer *buffer, void **virAddr, OH_NativeBuffer_Planes *outPlanes) | 将OH_NativeBuffer对应的多通道ION内存映射到进程空间 | 79| OH_NativeBuffer_FromNativeWindowBuffer (OHNativeWindowBuffer *nativeWindowBuffer, OH_NativeBuffer **buffer) | 将OHNativeWindowBuffer实例转换为OH_NativeBuffer实例 | 80| OH_NativeWindow_NativeWindowAttachBuffer(OHNativeWindow *window, OHNativeWindowBuffer *buffer) | 将缓存区OHNativeWindowBuffer添加到OHNativeWindow中 | 81| OH_NativeWindow_NativeWindowDetachBuffer(OHNativeWindow *window, OHNativeWindowBuffer *buffer) | 将OHNativeWindow中的buffer移除，放置到缓存区中 | 82| OH_NativeWindow_WriteToParcel(OHNativeWindow* window, OHIPCParcel* parcel)| 向OHIPCParcel对象中写入一个OHNativeWindow对象| 83| OH_NativeWindow_ReadFromParcel(OHIPCParcel *parcel, OHNativeWindow **window)| 从OHIPCParcel对象中读取一个OHNativeWindow对象| 84| OH_NativeWindow_NativeWindowSetScalingModeV2(OHNativeWindow *window, OHScalingModeV2 scalingMode)| 为OHNativeWindow设置显示模式| 85 86详细的接口说明请参考[NativeWindow](https://docs.openharmony.cn/pages/v4.1/zh-cn/application-dev/reference/apis-arkgraphics2d/_o_h___native_image.md)，[NativeImage](https://docs.openharmony.cn/pages/v4.1/zh-cn/application-dev/reference/apis-arkgraphics2d/_o_h___native_image.md)，[NativeBuffer](https://docs.openharmony.cn/pages/v4.0/zh-cn/application-dev/reference/native-apis/_o_h___native_buffer.md)。 87 88### 相关权限 89 90不涉及。 91 92### 依赖 93 94XComponent NativeWindow NativeImage EGL。 95 96### 约束与限制 97 981. 本示例仅支持标准系统上运行； 992. 本示例为Stage模型，已适配API version 12版本SDK，SDK版本号5.0.0.19及以上版本,镜像版本号支持5.0.0.19及以上版本; 1003. 本示例需要使用DevEco Studio 4.0 Beta2 版本号(4.1.3.400)及以上版本才可编译运行。 101### 下载 102 103如需单独下载本工程，执行如下命令： 104 105``` 106git init 107git config core.sparsecheckout true 108echo code/BasicFeature/Native/NdkNativeWindow/ > .git/info/sparse-checkout 109git remote add origin https://gitee.com/openharmony/applications_app_samples.git 110git pull origin master 111``` 112
