提交 d5196a8b 编写于 作者: Z zengyawen

update docs

Signed-off-by: Nzengyawen <zengyawen1@huawei.com>
上级 64c0ba86
......@@ -16,6 +16,7 @@
- [Data Management](database/Readme-EN.md)
- [USB Service](usb/Readme-EN.md)
- [DFX](dfx/Readme-EN.md)
- [WebGL](webgl/Readme-EN.md)
- [Development References](reference/Readme-EN.md)
- [JavaScript-based Web-like Development Paradigm](reference/arkui-js/Readme-EN.md)
- [TypeScript-based Declarative Development Paradigm](reference/arkui-ts/Readme-EN.md)
......
# WebGL
- [WebGL Overview](webgl-overview.md)
- [WebGL Development](webgl-guidelines.md)
此差异已折叠。
# WebGL Overview
Web Graphic Library (WebGL) is used for rendering interactive 2D and 3D graphics. WebGL used in OpenHarmony is based on OpenGL for Embedded Systems (OpenGL ES). It can be used in the **&lt;canvas&gt;** object of HTML5 without using plug-ins and supports cross-platform. WebGL is programmed by JavaScript code. Its APIs can implement graphics rendering and acceleration by using GPU hardware provided by the user equipment.
## Basic Concepts
### Shader
Shaders are instructions and data that run in a graphics card. In WebGL, shaders are written in the OpenGL Shading Language (GLSL).
There are vertex shaders and fragment shaders. The interaction between vertex shaders and fragment shaders involves rasterization.
- The vertex shader is mainly used to receive the coordinates of a point in a 3D space, process the coordinates into coordinates in a 2D space, and output the coordinates.
- The fragment shader is mainly used to output a color value for each pixel being processed.
- Rasterization is the process of converting the coordinates output by the vertex shader into pixels to be processed and passing the pixels to the fragment shader.
### Buffer
The buffer is a JavaScript object that resides in memory and stores the **attribute** object to be pushed to the shader.
### WebGLProgram
The WebGLProgram is a JavaScript object responsible for associating the shader with the buffer. A **WebGLProgram** object consists of two compiled WebGL shaders: a vertex shader and a fragment shader.
## Working Principles
**Figure 1** WebGL working principles
![en-us_image_0000001238544451](figures/en-us_image_0000001238544451.png)
- An application draws UI components using HTML5 at the foreground.
- Native APIs complete the interaction between JavaScript and C++ code.
- QuickJS and V8 are graphics frameworks that provide the **Surface** object for the WebGL module.
- The WebGL module exposes the GPU drawing APIs of OpenGL ES.
- The Embedded Graphics Library (EGL) implements adaptation to different platforms.
......@@ -16,5 +16,6 @@
- [数据管理](database/Readme-CN.md)
- [USB服务](usb/Readme-CN.md)
- [DFX](dfx/Readme-CN.md)
- [WebGL](webgl/Readme-CN.md)
- [开发参考](reference/Readme-CN.md)
......@@ -5,4 +5,6 @@
* [基于Native的Data Ability创建与访问](data-ability-creating-accessing.md)
* [CommonEvent开发指南](common-event.md)
* [Notification开发指南](notification.md)
* [应用迁移开发指导](ability-continuation.md)
* [Ability助手使用指导](ability-assistant-guidelines.md)
# Ability助手使用指导
Ability assistant(Ability助手,简称为aa)是实现应用、原子化服务及测试用例启动功能,为开发者提供基本的调试及测试应用的工具。通过该工具,开发者可以在hdc shell中,发出命令以执行各种系统操作,比如启动Ability、强制停止进程、打印Ability相关信息等。
## 开发指导
工具已在设备环境预置,开发者可直接通过命令行调用。
### 查询相关
- **help**
用于显示aa相关的帮助信息。
**返回值:**
返回对应的帮助信息。
**使用方法:**
```
aa help
```
### Ability相关
- **start**
用于启动一个ability。
| 参数 | 参数说明 |
| --------- | ---------------------- |
| -h/--help | 帮助信息。 |
| -d | 可选参数,device id |
| -a | 必选参数,ability name |
| -b | 必选参数,bundle name |
| -D | 可选参数,调试模式 |
**返回值:**
当成功启动Ability时,返回“start ability successfully.”;当启动失败时,返回“error: failed to start ability.”。
使用方法:
```
aa start [-d <device-id>] -a <ability-name> -b <bundle-name> [-D]
```
- **stop-service**
用于停止Service Ability。
| 参数 | 参数说明 |
| --------- | ------------------------ |
| -h/--help | 帮助信息。 |
| -d | 可选参数,device id。 |
| -a | 必选参数,ability name。 |
| -b | 必选参数,bundle name。 |
**返回值:**
当成功停止Service Ability时,返回“stop service ability successfully.”;当停止失败时,返回“error: failed to stop service ability.”。
使用方法:
```
aa stop-service [-d <device-id>] -a <ability-name> -b <bundle-name>
```
- **dump**
用于打印Ability的相关信息。
| 参数 | 参数说明 |
| ---------------------- | -------------------------------------- |
| -h/--help | 帮助信息。 |
| -a/--all | 打印所有mission内的Ability。 |
| -s/--stack \<number> | 打印指定mission stack内的Ability。 |
| -m/--mission \<number> | 打印指定mission内的Ability。 |
| -l/--stack-list | 打印每个mission stack内的mission列表。 |
| -u/--ui | 打印system ui Ability。 |
| -e/--serv | 打印Service Ability。 |
| -d/--data | 打印Data Ability。 |
**使用方法:**
```
aa dump -a
```
- **force-stop**
通过bundle name强制停止一个进程。
**返回值:**
当成功强制停止该进程时,返回“force stop process successfully.”;当强制停止失败时,返回“error: failed to force stop process.”。
**使用方法:**
```
aa force-stop <bundle-name>
```
\ No newline at end of file
# IPC与RPC通信
- **[IPC与RPC通信概述](ipc-rpc-overview.md)**
- **[IPC与RPC通信开发指导](ipc-rpc-development-guideline.md)**
- **[远端状态订阅开发实例](subscribe-remote-state.md)**
\ No newline at end of file
......@@ -18,9 +18,11 @@
- 媒体
- [音频管理](js-apis-audio.md)
- [媒体服务](js-apis-media.md)
- [图片处理](js-apis-image.md)
- 安全
- [用户认证](js-apis-useriam-userauth.md)
- [访问控制](js-apis-abilityAccessCtrl.md)
- [通用密钥库系统](js-apis-huks.md)
- 数据管理
- [轻量级存储](js-apis-data-preferences.md)
- [轻量级存储(废弃 since 8)](js-apis-data-storage.md)
......@@ -46,6 +48,7 @@
- [SIM卡管理](js-apis-sim.md)
- [网络搜索](js-apis-radio.md)
- [observer](js-apis-observer.md)
- [蜂窝数据](js-apis-telephony-data.md)
- 网络与连接
- [WLAN](js-apis-wifi.md)
- [Bluetooth](js-apis-bluetooth.md)
......@@ -55,6 +58,7 @@
- [屏幕亮度](js-apis-brightness.md)
- [电量信息](js-apis-battery-info.md)
- [系统电源管理](js-apis-power.md)
- [热管理](js-apis-thermal.md)
- [Runninglock锁](js-apis-runninglock.md)
- [设备信息](js-apis-device-info.md)
- [系统属性](js-apis-system-parameter.md)
......
......@@ -1342,20 +1342,16 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.beginPath()
this.context.ellipse(200, 200, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI, true)
this.context.ellipse(200, 200, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI)
this.context.stroke()
})
Button('back')
.onClick(() => {
router.back()
})
}
.width('100%')
.height('100%')
}
}
```
![zh-cn_image_0000001194192440](figures/zh-cn_image_0000001194192440.png)
......@@ -1462,17 +1458,13 @@ clip(): void
this.context.fillStyle = "rgb(255,0,0)"
this.context.fillRect(0, 0, 150, 150)
})
Button('back')
.onClick(() => {
router.back()
})
}
.width('100%')
.height('100%')
}
}
```
![zh-cn_image_0000001194032462](figures/zh-cn_image_0000001194032462.png)
......
......@@ -387,7 +387,7 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.path2Db.ellipse(200, 200, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI, true)
this.path2Db.ellipse(200, 200, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI)
this.context.stroke(this.path2Db)
})
}
......
......@@ -1424,7 +1424,7 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
.backgroundColor('#ffff00')
.onReady(() =>{
this.offContext.beginPath()
this.offContext.ellipse(200, 200, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI, true)
this.offContext.ellipse(200, 200, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI)
this.offContext.stroke()
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
......
......@@ -3,5 +3,10 @@
- 用户认证
- [用户认证开发概述](userauth-overview.md)
- [用户认证开发指导](userauth-guidelines.md)
- 密钥管理
- [HUKS开发概述](huks-overview.md)
- [HUKS开发指导](huks-guidelines.md)
- Hap包签名工具
- [Hap包签名工具开发指](hapsigntool-guidelines.md)
- [Hap包签名工具开发指](hapsigntool-guidelines.md)
# Hap包签名工具开发指
# Hap包签名工具开发指
......@@ -13,10 +13,10 @@
Hap包签名工具支持本地签名需求的开发,为OpenHarmony应用提供完整性保护和来源管控机制,该签名工具基于PKI公钥证书的机制实现,在进行开发前,开发者应了解以下基本概念:
- 非对称密钥对
非对称密钥算法是数据签名/验签的基础,应用签名工具实现生成标准的非对称密钥对(ECC P384/256、RSA2048/3072/4096,用于证书的签发和验证、Profile文件的签名和验签、以及应用包的签名和验签,提供应用的完整性保护机制。
非对称密钥算法是数据签名/验签的基础,应用签名工具实现生成标准的非对称密钥对(ECC P384/256、RSA2048/3072/4096,用于证书的签发和验证、Profile文件的签名和验签、以及应用包的签名和验签,提供应用的完整性保护机制。
- CSR
CSR(Certificate Signing Request)证书签发请求是生成证书的前提,他包括证书的公钥、证书主题和私钥签名,在申请证书之前,需要先基于密钥对生成CSR,然后提交给CA签发证书。
CSR(Certificate Signing Request)证书签发请求是生成证书的前提,他包括证书的公钥、证书主题和私钥签名,在申请证书之前,需要先基于密钥对生成CSR,然后提交给CA签发证书。
- 证书
OpenHarmony采用RFC5280标准构建X509证书信任体系。用于应用签名的OpenHarmony证书按层级可分为:根CA证书、子CA证书、三级实体证书,其中三级实体证书分为应用签名证书和profile签名证书。应用签名证书表示应用开发者的身份,可保证系统上安装的应用来源可追溯,profile签名证书实现对profile文件的签名进行验签,保证profile文件的完整性。
- HAP包
......@@ -33,13 +33,13 @@ hap包中的描述文件,该描述文件描述了已授权的证书权限和
## 编译构建
1. 该工具基于Gradle 7.1编译构建,请确认环境已安装配置Gradle环境,并且版本高于或等于7.1。
```shell
gradle -v
```
2. 下载代码,命令行打开文件目录至developtools_hapsigner/hapsigntool,执行命令进行编译打包。
```shell
gradle build
```
......@@ -74,7 +74,7 @@ OpenHarmony系统内置密钥库文件,文件名称为OpenHarmony.p12,内含
1.输出命令帮助信息
-help # 输出命令帮助信息(不输入参数默认输出命令帮助信息)
2.输出版本信息
-version # 输出版本信息
......@@ -209,7 +209,7 @@ OpenHarmony系统内置密钥库文件,文件名称为OpenHarmony.p12,内含
├── -outFil # 验证结果文件(包含验证结果和profile内容),json格式,可选项;如果不填,则直接输出到控制台
11.hap应用包签名
sign-app : hap应用包签名
├── -mode # 签名模式,必填项,包括localSign,remoteSign,remoteResign
├── -keyAlias # 密钥别名,必填项
......@@ -247,9 +247,9 @@ OpenHarmony系统内置密钥库文件,文件名称为OpenHarmony.p12,内含
子CA证书所在路径:developtools_hapsigner/autosign/result/subCA.cer;
pfofile签名证书路径:developtools_hapsigner/autosign/result/OpenHarmonyProfileRelease.pem。
**<p id="生成应用签名证书密钥对">1.生成应用签名证书密钥对</p>**
调用密钥对生成接口,生成签名密钥并保存到密钥库。
命令实例:
......@@ -259,7 +259,7 @@ java -jar hap-sign-tool.jar generate-keypair -keyAlias "oh-app1-key-v1" -keyAlg
> ![icon-note.gif](../public_sys-resources/icon-note.gif) **说明:**请记录下**keyAlias、keyStorePwd**和**keyPwd**的值,在后续[生成应用签名证书](#生成应用签名证书)和[对Hap包进行签名](#对Hap包进行签名)操作会使用到。
该命令的参数说明:
generate-keypair : 生成应用签名证书密钥对
├── -keyAlias #用于生成应用签名证书的密钥别名,存于OpenHarmony.p12密钥库文件中,该参数必填
├── -keyAlg #密钥算法,推荐使用ECC,该参数必填
......@@ -267,7 +267,7 @@ java -jar hap-sign-tool.jar generate-keypair -keyAlias "oh-app1-key-v1" -keyAlg
├── -keyStoreFile #密钥库文件,推荐使用提供的OpenHarmony.p12密钥库文件,该参数必填
├── -keyStorePwd #密钥库口令,OpenHarmony.p12口令默认为“123456”,必填项
├── -keyPwd #密钥口令,可选项,该参数不填默认生成的密钥对无口令
**<p id="生成应用签名证书">2.生成应用签名证书</p>**
......@@ -353,6 +353,7 @@ java -jar hap-sign-tool.jar sign-app -keyAlias "oh-app1-key-v1" -signAlg "SHA256
## 常见问题
**1.执行[生成应用签名证书](#生成应用签名证书)命令时,控制台打印结果,无文件输出**
......
# HUKS开发指
## 场景介绍
HUKS(OpenHarmony Universal KeyStore,OpenHarmony通用密钥库系统)向应用提供密钥库能力,包括密钥管理及密钥的密码学操作等功能。HUKS所管理的密钥可以由应用导入或者由应用调用HUKS接口生成。
## 接口说明
| 接口名 | 描述 |
| ------------------------------------------------------------ | ---------------- |
| function generateKey(keyAlias: string, options: HuksOptions, callback: AsyncCallback<HksResult>) : void; | 生成密钥/密钥对 |
| function generateKey(keyAlias: string, options: HuksOptions) : Promise<HuksResult>; | 生成密钥/密钥对 |
| function exportKey(keyAlias: string, options: HuksOptions, callback: AsyncCallback<HuksResult>) : void; | 导出公钥 |
| function exportKey(keyAlias: string, options: HuksOptions) : Promise<HuksResult>; | 导出公钥 |
| function isKeyExist(keyAlias: string, options: HuksOptions, callback: AsyncCallback<boolean>) : void; | 查询密钥是否存在 |
| function isKeyExist(keyAlias: string, options: HuksOptions) : Promise<boolean>; | 查询密钥是否存在 |
| function deleteKey(keyAlias: string, options: HuksOptions, callback: AsyncCallback<HuksResult>) : void; | 删除密钥 |
| function deleteKey(keyAlias: string, options: HuksOptions) : Promise<HuksResult>; | 删除密钥 |
## 开发步骤
1. 引入HUKS模块
```js
import huks from '@ohos.security.huks'
```
2. 使用generateKey接口生成密钥对。
keyAlias为生成的密钥别名,options为生成密钥时使用到的参数,需根据具体需要到的算法设定options中的参数。
generateKey接口会返回密钥的生成是否成功。
```js
var alias = 'testAlias';
var properties = new Array();
properties[0] = {
tag: huks.HuksTag.HUKS_TAG_ALGORITHM,
value: huks.HuksKeyAlg.HUKS_ALG_ECC
};
properties[1] = {
tag: huks.HuksTag.HUKS_TAG_KEY_SIZE,
value: huks.HuksKeySize.HUKS_ECC_KEY_SIZE_224
};
properties[2] = {
tag: huks.HuksTag.HUKS_TAG_PURPOSE,
value: huks.HuksKeyPurpose.HUKS_KEY_PURPOSE_AGREE
};
properties[3] = {
tag: huks.HuksTag.HUKS_TAG_DIGEST,
value: huks.HuksKeyDigest.HUKS_DIGEST_NONE
};
var options = {
properties: properties
}
var resultA = await huks.generateKey(alias, options);
```
3. 使用Init接口进行init操作。
Alias为初始化密钥的别名,options为初始化密钥用的参数集合,需根据具体需要到的算法设定options中的参数。
init接口会返回init操作是否成功。
```js
var alias = 'test001'
var properties = new Array();
properties[0] = {
tag: huks.HuksTag.HUKS_TAG_ALGORITHM,
value: huks.HksKeyAlg.HKS_ALG_DH
};
properties[1] = {
tag: huks.HksTag.HKS_TAG_PURPOSE,
value: huks.HksKeyPurpose.HKS_KEY_PURPOSE_AGREE
};
properties[2] = {
tag: huks.HksTag.HKS_TAG_KEY_SIZE
value: huks.HksKeySize.HKS_DH_KEY_SIZE_4096
};
var options = {
properties: properties
};
huks.init(alias, options, function (err, data){});
```
4. 使用Update接口进行update操作。
handle为更新密钥的session id,options为更新密钥用的参数集合,需根据具体需要到的算法设定options中的参数。
update接口会返回update操作是否成功。
```js
var properties = new Array();
properties[0] = {
tag: huks.HuksTag.HUKS_TAG_ALGORITHM,
value: huks.HksKeyAlg.HKS_ALG_DH
};
properties[1] = {
tag: huks.HksTag.HKS_TAG_PURPOSE,
value: huks.HksKeyPurpose.HKS_KEY_PURPOSE_AGREE
};
properties[2] = {
tag: huks.HksTag.HKS_TAG_KEY_SIZE
value: huks.HksKeySize.HKS_DH_KEY_SIZE_4096
};
var options = {
properties: properties
};
huks.update(handle, options, function (err, data){});
```
5. 使用Finish接口进行finish操作。
handle为 结束密钥的session id,options为结束密钥用的参数集合,需根据具体需要到的算法设定options中的参数。
finish接口会返回finish操作是否成功。
```js
var properties = new Array();
properties[0] = {
tag: huks.HuksTag.HUKS_TAG_ALGORITHM,
value: huks.HksKeyAlg.HKS_ALG_DH
};
properties[1] = {
tag: huks.HksTag.HKS_TAG_PURPOSE,
value: huks.HksKeyPurpose.HKS_KEY_PURPOSE_AGREE
};
properties[2] = {
tag: huks.HksTag.HKS_TAG_KEY_SIZE
value: huks.HksKeySize.HKS_DH_KEY_SIZE_4096
};
var options = {
properties: properties
};
huks.finish(handle, options, function (err, data){});
```
# HUKS开发指
## 场景介绍
HUKS(OpenHarmony Universal KeyStore,OpenHarmony通用密钥库系统)向应用提供密钥库能力,包括密钥管理及密钥的密码学操作等功能。HUKS所管理的密钥可以由应用导入或者由应用调用HUKS接口生成。
## 接口说明
| 接口名 | 描述 |
| ------------------------------------------------------------ | ---------------- |
| function generateKey(keyAlias: string, options: HuksOptions, callback: AsyncCallback<HksResult>) : void; | 生成密钥/密钥对 |
| function generateKey(keyAlias: string, options: HuksOptions) : Promise<HuksResult>; | 生成密钥/密钥对 |
| function exportKey(keyAlias: string, options: HuksOptions, callback: AsyncCallback<HuksResult>) : void; | 导出公钥 |
| function exportKey(keyAlias: string, options: HuksOptions) : Promise<HuksResult>; | 导出公钥 |
| function isKeyExist(keyAlias: string, options: HuksOptions, callback: AsyncCallback<boolean>) : void; | 查询密钥是否存在 |
| function isKeyExist(keyAlias: string, options: HuksOptions) : Promise<boolean>; | 查询密钥是否存在 |
| function deleteKey(keyAlias: string, options: HuksOptions, callback: AsyncCallback<HuksResult>) : void; | 删除密钥 |
| function deleteKey(keyAlias: string, options: HuksOptions) : Promise<HuksResult>; | 删除密钥 |
## 开发步骤
1. 引入HUKS模块
```js
import huks from '@ohos.security.huks'
```
2. 使用generateKey接口生成密钥对。
keyAlias为生成的密钥别名,options为生成密钥时使用到的参数,需根据具体需要到的算法设定options中的参数。
generateKey接口会返回密钥的生成是否成功。
```js
var alias = 'testAlias';
var properties = new Array();
properties[0] = {
tag: huks.HuksTag.HUKS_TAG_ALGORITHM,
value: huks.HuksKeyAlg.HUKS_ALG_ECC
};
properties[1] = {
tag: huks.HuksTag.HUKS_TAG_KEY_SIZE,
value: huks.HuksKeySize.HUKS_ECC_KEY_SIZE_224
};
properties[2] = {
tag: huks.HuksTag.HUKS_TAG_PURPOSE,
value: huks.HuksKeyPurpose.HUKS_KEY_PURPOSE_AGREE
};
properties[3] = {
tag: huks.HuksTag.HUKS_TAG_DIGEST,
value: huks.HuksKeyDigest.HUKS_DIGEST_NONE
};
var options = {
properties: properties
}
var resultA = await huks.generateKey(alias, options);
```
3. 使用Init接口进行init操作。
Alias为初始化密钥的别名,options为初始化密钥用的参数集合,需根据具体需要到的算法设定options中的参数。
init接口会返回init操作是否成功。
```js
var alias = 'test001'
var properties = new Array();
properties[0] = {
tag: huks.HuksTag.HUKS_TAG_ALGORITHM,
value: huks.HksKeyAlg.HKS_ALG_DH
};
properties[1] = {
tag: huks.HksTag.HKS_TAG_PURPOSE,
value: huks.HksKeyPurpose.HKS_KEY_PURPOSE_AGREE
};
properties[2] = {
tag: huks.HksTag.HKS_TAG_KEY_SIZE
value: huks.HksKeySize.HKS_DH_KEY_SIZE_4096
};
var options = {
properties: properties
};
huks.init(alias, options, function (err, data){});
```
4. 使用Update接口进行update操作。
handle为更新密钥的session id,options为更新密钥用的参数集合,需根据具体需要到的算法设定options中的参数。
update接口会返回update操作是否成功。
```js
var properties = new Array();
properties[0] = {
tag: huks.HuksTag.HUKS_TAG_ALGORITHM,
value: huks.HksKeyAlg.HKS_ALG_DH
};
properties[1] = {
tag: huks.HksTag.HKS_TAG_PURPOSE,
value: huks.HksKeyPurpose.HKS_KEY_PURPOSE_AGREE
};
properties[2] = {
tag: huks.HksTag.HKS_TAG_KEY_SIZE
value: huks.HksKeySize.HKS_DH_KEY_SIZE_4096
};
var options = {
properties: properties
};
huks.update(handle, options, function (err, data){});
```
5. 使用Finish接口进行finish操作。
handle为 结束密钥的session id,options为结束密钥用的参数集合,需根据具体需要到的算法设定options中的参数。
finish接口会返回finish操作是否成功。
```js
var properties = new Array();
properties[0] = {
tag: huks.HuksTag.HUKS_TAG_ALGORITHM,
value: huks.HksKeyAlg.HKS_ALG_DH
};
properties[1] = {
tag: huks.HksTag.HKS_TAG_PURPOSE,
value: huks.HksKeyPurpose.HKS_KEY_PURPOSE_AGREE
};
properties[2] = {
tag: huks.HksTag.HKS_TAG_KEY_SIZE
value: huks.HksKeySize.HKS_DH_KEY_SIZE_4096
};
var options = {
properties: properties
};
huks.finish(handle, options, function (err, data){});
```
# WebGL
- [概述](webgl-overview.md)
- [WebGL开发指导](webgl-guidelines.md)
此差异已折叠。
# 概述
WebGL的全称为Web Graphic Library(网页图形库),主要用于交互式渲染2D图形和3D图形。目前OpenHarmony中使用的WebGL是基于OpenGL裁剪的OpenGL ES,可以在HTML5的canvas元素对象中使用,无需使用插件,支持跨平台。WebGL程序是由JavaScript代码组成的,其中使用的API可以利用用户设备提供的GPU硬件完成图形渲染和加速。
## 基本概念
### 着色器
可以理解为运行在显卡中的指令和数据。在WebGL中,着色器是用OpenGL ES着色语言(GLSL)编写的。
完整的着色器包括顶点着色器和片元着色器。顶点着色器和片元着色器的交互则涉及到图片光栅化。
- 顶点着色器:最基本的任务是接收三维空间中点的坐标,将其处理为二维空间中的坐标并输出。
- 片元着色器:最基本的任务是对需要处理的屏幕上的每个像素输出一个颜色值。
- 图片光栅化:将顶点着色器输出的二维空间中的点坐标,转化为需要处理的像素并传递给片元着色器的过程。
### 缓冲区
驻存于内存中的JavaScript对象,存储着即将推送到着色器中的attribute对象。
### 着色器程序
将缓冲区中的数据推送到着色器中还需涉及“着色器程序”,一个负责关联着色器和缓冲区的JavaScript对象。一个WebGLProgram 对象由两个编译过后的 WebGLShader 组成,即顶点着色器和片段着色器(均由 GLSL 语言所写)。
## 运作机制
**图1** WebGL运作机制
![zh-cn_image_0000001238544451](figures/zh-cn_image_0000001238544451.png)
- 应用前端HTML5绘制界面组件。
- Native API完成前端JavaScript与C++代码交互。
- QuickJS与V8为图形框架,为WebGL模块提供绘制对象Surface。
- WebGL模块对外暴露OpenGL ES的GPU绘制接口。
- 中间接口层EGL(Embedded Graphics Library)完成不同平台的适配。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册