Skip to content

D
Docs

OpenHarmony / Docs
1 年多 前同步成功

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

!1158 ts文档刷新 

Merge pull request !1158 from zengyawen/OpenHarmony-3.1-Beta
上级 b1c5093a b8b080e5
展开全部 隐藏空白更改
内联 并排
Showing with 53 addition and 8278 deletion
zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
浏览文件 @ d2a5f2af
......@@ -2827,7 +2827,7 @@ transform方法对应一个变换矩阵，想对一个图形进行变化的时
@Component
struct Transform {
private settings: RenderingContextSettings = new RenderingContextSettings(true,true)
private context: RenderingContext = new RenderingContext(this.settings)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md
浏览文件 @ d2a5f2af
......@@ -79,7 +79,7 @@ Canvas\(context: CanvasRenderingContext2D\)
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true,true)
private context: RenderingContext = new RenderingContext(this.settings)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-actionsheet.md
浏览文件 @ d2a5f2af
......@@ -204,9 +204,9 @@ struct ActionSheetExapmle {
},
sheets: [
{
title: 'Apples',
title: 'apples',
action: () => {
console.error('Apples')
console.error('apples')
}
},
{
......@@ -230,5 +230,5 @@ struct ActionSheetExapmle {
}
```
![](figures/actionsheet.gif)
<img src="figures/actionsheet.gif" style="zoom: 50%;" />
zh-cn/application-dev/reference/js-apis-Context.md 已删除 100644 → 0
浏览文件 @ b1c5093a
# Context模块
## 支持设备
| API | 手机 | 平板 | 智慧屏 | 智能穿戴 | 轻量级智能穿戴 | 智慧视觉设备 |
| ------------------------------------------------------------ | ---- | ---- | ------ | -------- | -------------- | ------------ |
| Context.getOrCreateLocalDir(callback: AsyncCallback\<string>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getOrCreateLocalDir() | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.verifyPermission(permission: string, options: PermissionOptions, callback: AsyncCallback\<number>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.verifyPermission(permission: string, callback: AsyncCallback\<number>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.verifyPermission(permission: string, options?: PermissionOptions) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.requestPermissionsFromUser(permissions: Array\<string>, requestCode: number, resultCallback: AsyncCallback\<PermissionRequestResult>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getApplicationInfo(callback: AsyncCallback\<ApplicationInfo>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getApplicationInfo() | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getBundleName(callback: AsyncCallback\<string>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getBundleName() | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getProcessInfo(callback: AsyncCallback\<ProcessInfo>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getProcessInfo() | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getElementName(callback: AsyncCallback\<ElementName>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getElementName() | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getProcessName(callback: AsyncCallback\<string>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getProcessName() | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getCallingBundle(callback: AsyncCallback\<string>) | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
| Context.getCallingBundle() | 支持 | 支持 | 支持 | 支持 | 不支持 | 不支持 |
## 导入模块
```js
import featureAbility from '@ohos.ability.featureAbility'
import bundle from '@ohos.bundle'
```
Context对象是在featureAbility中创建实例，并通过featureAbility的getContext()接口返回，因此在使用Context时，必须导入@ohos.ability.featureAbility库。示例如下：
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getOrCreateLocalDir()
```
## Context.getOrCreateLocalDir(callback: AsyncCallback<string>)
- 接口说明
获取应用程序的本地根目录。如果是第一次调用，将创建目录(callback形式)
- getOrCreateLocalDir参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| -------- | -------- | ---------------------- | ---- | ------------------------ |
| callback | 只读 | AsyncCallback\<string> | 是 | 返回应用程序的本地根目录 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getOrCreateLocalDir((err, data)=>{
console.info("data=" + data);
})
```
## Context.getOrCreateLocalDir()
- 接口说明
获取应用程序的本地根目录。如果是第一次调用，将创建目录(Promise形式)
- 返回值
| 类型 | 说明 |
| --------------- | -------------------- |
| Promise<string> | 应用程序的本地根目录 |
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getOrCreateLocalDir().then((void) => {
console.info("==========================>getOrCreateLocalDirCallback=======================>");
});
```
## PermissionOptions类型说明
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ---- | -------- | ------ | ---- | ------ |
| pid | 只读 | number | 否 | 进程id |
| uid | 只读 | number | 否 | 用户id |
## Context.verifyPermission(permission: string, options: PermissionOptions, callback: AsyncCallback<number>)
- 接口说明
验证系统中运行的特定pid和uid是否允许指定的权限(callback形式)
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ---------- | -------- | ----------------------------------------------- | ---- | ----------------------------------- |
| permission | 只读 | string | 是 | 指定权限的名称 |
| options | 只读 | [PermissionOptions](#PermissionOptions类型说明) | 是 | 进程id |
| callback | 只读 | AsyncCallback\<number> | 是 | 返回权限验证结果，0有权限，-1无权限 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
import bundle from '@ohos.bundle'
var context = featureAbility.getContext();
var datainfo = await bundle.getBundleInfo('com.context.test',1);
context.verifyPermission("com.example.permission",datainfo.uid)
```
## Context.verifyPermission(permission: string, callback: AsyncCallback<number>)
- 接口说明
验证系统中运行的特定pid和uid是否具有指定的权限(callback形式)
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ---------- | -------- | ---------------------- | ---- | ----------------------------------- |
| permission | 只读 | string | 是 | 指定权限的名称 |
| callback | 只读 | AsyncCallback\<number> | 是 | 返回权限验证结果，0有权限，-1无权限 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.verifyPermission("com.example.permission")
```
## Context.verifyPermission(permission: string, options?: PermissionOptions)
- 接口说明
验证系统中运行的特定pid和uid是否具有指定的权限(Promise形式)
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ---------- | -------- | ----------------------------------------------- | ---- | -------------- |
| permission | 只读 | string | 是 | 指定权限的名称 |
| options | 只读 | [PermissionOptions](#PermissionOptions类型说明) | 否 | 进程id |
- 返回值
| 类型 | 说明 |
| --------------- | ------------------------------------------------------------ |
| Promise<number> | 如果pid和uid具有权限，则使用{@code 0}进行异步回调；否则使用{@code-1}回调。 |
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
var Permission = context.PermissionOptions(1,1);
context.getOrCreateLocalDir('com.context.permission',Permission).then((void) => {
console.info("==========================>verifyPermissionCallback=======================>");
});
```
## PermissionRequestResult类型说明
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ----------- | -------- | -------------- | ---- | ------------------ |
| requestCode | 只读 | number | 是 | 用户传入的请求代码 |
| permissions | 只读 | Array\<string> | 是 | 用户传入的权限 |
| authResults | 只读 | Array\<number> | 是 | 求权限的结果 |
## Context.requestPermissionsFromUser(permissions: Array<string>, requestCode: number, resultCallback: AsyncCallback<[PermissionRequestResult](#PermissionRequestResult类型说明)>)
- 接口说明
从系统请求某些权限(callback形式)
- requestPermissionsFromUser参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| -------------- | -------- | ------------------------------------------------------------ | ---- | --------------------------------------------- |
| permissions | 只读 | Array\<string> | 是 | 指示要请求的权限列表。此参数不能为null |
| requestCode | 只读 | number | 是 | 指示要传递给PermissionRequestResult的请求代码 |
| resultCallback | 只读 | AsyncCallback\<[PermissionRequestResult](#PermissionRequestResult类型说明)> | 是 | 返回授权结果信息 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getOrCreateLocalDir(
["com.example.permission1",
"com.example.permission2",
"com.example.permission3",
"com.example.permission4",
"com.example.permission5"],
1,
)
```
## Context.getApplicationInfo(callback: AsyncCallback<ApplicationInfo>)
- 接口说明
获取有关当前应用程序的信息（callback形式）
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| -------- | -------- | ------------------------------- | ---- | ---------------------- |
| callback | 只读 | AsyncCallback\<ApplicationInfo> | 是 | 返回当前应用程序的信息 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getApplicationInfo()
```
## Context.getApplicationInfo
- 接口说明
获取有关当前应用程序的信息（Promise形式)
- 参数描述
无
- 返回值
| 类型 | 说明 |
| ------------------------ | ------------------ |
| Promise<ApplicationInfo> | 当前应用程序的信息 |
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getApplicationInfo().then((void) => {
console.info("==========================>getApplicationInfoCallback=======================>");
});
```
## Context.getBundleName(callback: AsyncCallback<string>)
- 接口说明
获取当前ability的捆绑包名称（callback形式）
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| -------- | -------- | ---------------------- | ---- | --------------------------- |
| callback | 只读 | AsyncCallback\<string> | 是 | 返回当前ability的捆绑包名称 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getBundleName()
```
## Context.getBundleName
- 接口说明
获取当前ability的捆绑包名称（Promise形式)
- 参数描述
无
- 返回值
| 类型 | 说明 |
| --------------- | ----------------------- |
| Promise<string> | 当前ability的捆绑包名称 |
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getBundleName().then((void) => {
console.info("==========================>getBundleNameCallback=======================>");
});
```
## Context.getProcessInfo(callback: AsyncCallback<ProcessInfo>)
- 接口说明
获取有关当前进程的信息，包括进程ID和名称（callback形式）
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| -------- | -------- | --------------------------- | ---- | ------------------ |
| callback | 只读 | AsyncCallback\<ProcessInfo> | 是 | 返回当前进程的信息 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getProcessInfo()
```
## Context.getProcessInfo
- 接口说明
获取有关当前进程的信息，包括进程id和名称（Promise形式)
- 参数描述
无
- 返回值
| 类型 | 说明 |
| -------------------- | -------------- |
| Promise<ProcessInfo> | 当前进程的信息 |
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getProcessInfo().then((void) => {
console.info("==========================>getProcessInfoCallback=======================>");
});
```
## Context.getElementName(callback: AsyncCallback<ElementName>)
- 接口说明
获取当前ability的ohos.bundle.ElementName对象。此方法仅适用于页面功能(callback形式）
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| -------- | -------- | --------------------------- | ---- | -------------------------------------------- |
| callback | 只读 | AsyncCallback\<ElementName> | 是 | 返回当前ability的ohos.bundle.ElementName对象 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getElementName()
```
## Context.getElementName
- 接口说明
获取当前能力的ohos.bundle.ElementName对象。此方法仅适用于页面功能(Promise形式)
- 参数描述
无
- 返回值
| 类型 | 说明 |
| -------------------- | ---------------------------------------- |
| Promise<ElementName> | 当前ability的ohos.bundle.ElementName对象 |
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getElementName().then((void) => {
console.info("==========================>getElementNameCallback=======================>");
});
```
## **Context.getProcessName(callback: AsyncCallback<string>)**
- 接口说明
获取当前进程的名称(callback形式）
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| -------- | -------- | ---------------------- | ---- | ------------------ |
| callback | 只读 | AsyncCallback\<string> | 是 | 返回当前进程的名称 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getProcessName()
```
## Context.getProcessName
- 接口说明
获取当前进程的名称(Promise形式)
- 参数描述
无
- 返回值
| 类型 | 说明 |
| --------------- | -------------- |
| Promise<string> | 当前进程的名称 |
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getProcessName().then((void) => {
console.info("==========================>getProcessNameCallback=======================>");
});
```
## Context.getCallingBundle(callback: AsyncCallback<string>)
- 接口说明
获取调用当前ability捆绑包名称(callback形式）
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| -------- | -------- | ---------------------- | ---- | ------------------------- |
| callback | 只读 | AsyncCallback\<string> | 是 | 返回当前ability捆绑包名称 |
- 返回值
void
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getCallingBundle()
```
## Context.getCallingBundle
- 接口说明
获取调用当前ability捆绑包名称(Promise形式)
- 参数描述
无
- 返回值
| 类型 | 说明 |
| --------------- | ------------------------- |
| Promise<string> | 调用当前ability捆绑包名称 |
- 示例
```js
import featureAbility from '@ohos.ability.featureAbility'
var context = featureAbility.getContext();
context.getCallingBundle().then((void) => {
console.info("==========================>getCallingBundleCallback=======================>");
});
```
zh-cn/application-dev/reference/js-apis-DataUriUtils.md 已删除 100644 → 0
浏览文件 @ b1c5093a
# DataUriUtils模块
## 导入模块
```js
import dataUriUtils from '@ohos.ability.dataUriUtils';
```
## DataUriUtils.getId
- 接口说明
获取附加到给定uri的路径组件末尾的ID
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ---- | -------- | ------ | ---- | ------------------------- |
| uri | 只读 | string | 是 | 指示要从中获取ID的uri对象 |
- 返回值
附加到路径组件末尾的ID
- 示例
```js
import dataUriUtils from '@ohos.ability.datauriutils'
dataUriUtils.getIdSync("com.example.dataUriUtils/1221")
```
## DataUriUtils.attachId
- 接口说明
将给定ID附加到给定uri的路径组件的末尾
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ---- | -------- | ------ | ---- | ------------------------- |
| uri | 只读 | string | 是 | 指示要从中获取ID的uri对象 |
| id | 只读 | number | 是 | 指示要附加的ID |
- 返回值
附加给定ID的uri对象
- 示例
```js
import dataUriUtils from '@ohos.ability.datauriutils'
var idint = 1122;
dataUriUtils.attachId(
"com.example.dataUriUtils"
idint,
)
```
## DataUriUtils.deleteId
- 接口说明
从给定uri的路径组件的末尾删除ID
- 参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ---- | -------- | ------ | ---- | ------------------------- |
| uri | 只读 | string | 是 | 指示要从中删除ID的uri对象 |
- 返回值
ID已删除的uri对象
- 示例
```js
import dataUriUtils from '@ohos.ability.datauriutils'
dataUriUtils.deleteId("com.example.dataUriUtils/1221")
```
## DataUriUtils.updateId
- 接口说明
更新指定uri中的ID
- updateId参数描述
| 名称 | 读写属性 | 类型 | 必填 | 描述 |
| ---- | -------- | ------ | ---- | ------------------- |
| uri | 只读 | string | 是 | 指示要更新的uri对象 |
| id | 只读 | number | 是 | 指示新ID |
- 返回值
更新的uri对象
- 示例
```js
import dataUriUtils from '@ohos.ability.datauriutils'
var idint = 1122;
dataUriUtils.updateId(
"com.example.dataUriUtils"
idint,
)
```
zh-cn/application-dev/reference/js-apis-emitter.md 已删除 100644 → 0
浏览文件 @ b1c5093a
# Emitter
> 说明：本模块首批接口从API version 7开始支持。
## 导入模块
```javascript
import emitter from '@ohos.emitter'
```
## 权限列表
无
## EventPriority
用于表示事件被投递的优先级。
| 名称 | 值 | 说明 |
| --------- | ---- | ------------------------------------------------- |
| IMMEDIATE | 0 | 表示事件被立即投递 |
| HIGH | 1 | 表示事件先于LOW优先级投递 |
| LOW | 2 | 表示事件优于IDLE优先级投递，事件的默认优先级是LOW |
| IDLE | 3 | 表示在没有其他事件的情况下，才投递该事件 |
## emitter.on
on(event: [InnerEvent](#InnerEvent), callback: Callback\<[EventData](#EventData)\>): void
持续订阅某个事件以及接收事件的回调处理。
**参数：**
| 参数名 | 类型 | 必填 | 说明 |
| -------- | ----------------------------------- | ---- | ------------------------ |
| event | [InnerEvent](#InnerEvent) | 是 | 持续订阅的事件 |
| callback | Callback\<[EventData](#EventData)\> | 是 | 接收订阅事件时的回调处理 |
**示例：**
```javascript
var innerEvent = {
eventId : 1
};
var callback = (eventData) => {
console.info('callback');
};
emitter.on(innerEvent, callback);
```
## emitter.once
once(event: [InnerEvent](#InnerEvent), callback: Callback\<[EventData](#EventData)\>): void
单次订阅某个事件以及接收事件的回调处理，接收到回调处理后自动取消订阅。
**参数：**
| 参数名 | 类型 | 必填 | 说明 |
| -------- | ----------------------------------- | ---- | ------------------------ |
| event | [InnerEvent](#InnerEvent) | 是 | 单次订阅的事件 |
| callback | Callback\<[EventData](#EventData)\> | 是 | 接收订阅事件时的回调处理 |
**示例：**
```javascript
var innerEvent = {
eventId : 1
};
var callback = (eventData) => {
console.info('once callback');
};
emitter.once(innerEvent, callback);
```
## emitter.off
off(eventId: number): void
取消订阅某个事件。
**参数：**
| 参数名 | 类型 | 必填 | 说明 |
| ------- | ------ | ---- | -------------- |
| eventId | number | 是 | 单次订阅的事件 |
**示例：**
```javascript
emitter.off(1);
```
## emitter.emit
emit(event: InnerEvent, data?: EventData): void
发送一个事件到事件队列。
**参数：**
| 参数名 | 类型 | 必填 | 说明 |
| ------ | ------------------------- | ---- | -------------- |
| event | [InnerEvent](#InnerEvent) | 是 | 发送的事件 |
| data | [EventData](#EventData) | 否 | 事件携带的数据 |
**示例：**
```javascript
var eventData = {
data: {
1:"t",
'content':"c",
"id":1,
}};
var innerEvent = {
eventId : 1,
priority: emitter.EventPriority.HIGH
};
emitter.emit(innerEvent, eventData);
```
## InnerEvent
进程内的事件。
### 属性
| 名称 | 参数类型 | 可读 | 可写 | 说明 |
| -------- | ------------------------------- | ---- | ---- | ---------------------------------- |
| eventId | number | 是 | 是 | 事件的ID，由开发者定义用来辨别事件 |
| priority | [EventPriority](#EventPriority) | 是 | 是 | 事件被投递的优先级 |
## EventData
发送事件时传递的数据。
### 属性
| 名称 | 参数类型 | 可读 | 可写 | 说明 |
| ---- | ------------------ | ---- | ---- | -------------- |
| data | [key: string]: any | 是 | 是 | 事件携带的数据 |
\ No newline at end of file
zh-cn/application-dev/ui/arkui-overview.md
浏览文件 @ d2a5f2af
......@@ -7,7 +7,7 @@
## 基本概念
- **组件：**组件是界面搭建与显示的最小单位。开发者通过多种组件的组合，构建出满足自身应用诉求的完整界面。
- **组件**：组件是界面搭建与显示的最小单位。开发者通过多种组件的组合，构建出满足自身应用诉求的完整界面。
- **页面**：page页面是方舟开发框架最小的调度分割单位。开发者可以将应用设计为多个功能页面，每个页面进行单独的文件管理，并通过路由API实现页面的调度管理，以实现应用内功能的解耦。
......@@ -16,15 +16,15 @@
- **多种组件**：方舟开发框架不仅提供了多种基础组件，如文本显示、图片显示、按键交互等，也提供了支持视频播放能力的媒体组件。并且针对不同类型设备进行了组件设计，提供了组件在不同平台上的样式适配能力，此种组件称为“多态组件”。
- **布局计算：**UI界面设计离不开布局的参与。方舟开发框架提供了多种布局方式，不仅保留了经典的弹性布局能力，也提供了列表、宫格、栅格布局和适应多分辨率场景开发的原子布局能力。
- **布局计算**：UI界面设计离不开布局的参与。方舟开发框架提供了多种布局方式，不仅保留了经典的弹性布局能力，也提供了列表、宫格、栅格布局和适应多分辨率场景开发的原子布局能力。
- **动画能力：**方舟开发框架对于UI界面的美化，除了组件内置动画效果外，也提供了属性动画、转场动画和自定义动画能力。
- **动画能力**：方舟开发框架对于UI界面的美化，除了组件内置动画效果外，也提供了属性动画、转场动画和自定义动画能力。
- **UI交互：**方舟开发框架提供了多种交互能力，满足应用在不同平台通过不同输入设备均可正常进行UI交互响应，默认适配了触摸手势、遥控器、鼠标等输入操作，同时也提供事件通知能力。
- **UI交互**：方舟开发框架提供了多种交互能力，满足应用在不同平台通过不同输入设备均可正常进行UI交互响应，默认适配了触摸手势、遥控器、鼠标等输入操作，同时也提供事件通知能力。
- **绘制：**方舟开发框架提供了多种绘制能力，以满足开发者绘制自定义形状的需求，支持图形绘制、颜色填充、文本绘制、图片绘制等。
- **绘制**：方舟开发框架提供了多种绘制能力，以满足开发者绘制自定义形状的需求，支持图形绘制、颜色填充、文本绘制、图片绘制等。
- **平台API通道：**方舟开发框架提供了API扩展机制，平台能力通过此种机制进行封装，提供风格统一的JS接口。
- **平台API通道**：方舟开发框架提供了API扩展机制，平台能力通过此种机制进行封装，提供风格统一的JS接口。
## 选择方案
......
zh-cn/application-dev/ui/ts-component-based-component.md
浏览文件 @ d2a5f2af
# @Component
**@Component**装饰的**struct**表示该结构体具有组件化能力，能够成为一个独立的组件，这种类型的组件也称为自定义组件。
**@Component** 装饰的**struct**表示该结构体具有组件化能力，能够成为一个独立的组件，这种类型的组件也称为自定义组件。
该组件可以组合其他组件，它通过实现**build**方法来描述UI结构，其必须符合**Builder**的接口约束，该接口定义如下：
......@@ -16,13 +16,13 @@ interface Builder {
用户定义的组件具有以下特点：
- **可组合：**允许开发人员组合使用内置组件和其他组件，以及公共属性和方法；
- **可组合**：允许开发人员组合使用内置组件和其他组件，以及公共属性和方法；
- **可重用：**可以被其他组件重用，并作为不同的实例在不同的父组件或容器中使用；
- **可重用**：可以被其他组件重用，并作为不同的实例在不同的父组件或容器中使用；
- **有生命周期：**生命周期的回调方法可以在组件中配置，用于业务逻辑处理；
- **有生命周期**：生命周期的回调方法可以在组件中配置，用于业务逻辑处理；
- **数据驱动更新：**可以由状态数据驱动，实现UI自动更新。
- **数据驱动更新**：可以由状态数据驱动，实现UI自动更新。
组件生命周期主要包括**aboutToAppear**和**aboutToDisappear**回调函数，有关规范，请参见“[组件生命周期回调函数](../ui/ts-custom-component-lifecycle-callbacks.md)”章节。
......
zh-cn/application-dev/ui/ts-component-based-customdialog.md
浏览文件 @ d2a5f2af
......@@ -2,7 +2,7 @@
**@CustomDialog**装饰器用于装饰自定义弹窗。
**@CustomDialog** 装饰器用于装饰自定义弹窗。
```
......
zh-cn/application-dev/ui/ts-component-based-entry.md
浏览文件 @ d2a5f2af
# @Entry
用**@Entry**装饰的自定义组件用作页面的默认入口组件，加载页面时，将首先创建并呈现**@Entry**装饰的自定义组件。
用 **@Entry** 装饰的自定义组件用作页面的默认入口组件，加载页面时，将首先创建并呈现 **@Entry** 装饰的自定义组件。
> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
> 在单个源文件中，最多可以使用**\@Entry**装饰一个自定义组件。
> 在单个源文件中，最多可以使用 **@Entry** 装饰一个自定义组件。
## 示例
**\@Entry**的用法如下：
**@Entry** 的用法如下：
```
// Only MyComponent decorated by @Entry is rendered and displayed. "hello world" is displayed, but "goodbye" is not displayed.
......
zh-cn/application-dev/ui/ts-component-based-extend.md
浏览文件 @ d2a5f2af
......@@ -2,7 +2,7 @@
**@Extend**装饰器将新的属性函数添加到内置组件上，如**Text**、**Column**、**Button**等。通过**@Extend**装饰器可以快速定义并复用组件的自定义样式。
**@Extend** 装饰器将新的属性函数添加到内置组件上，如**Text**、**Column**、**Button**等。通过 **@Extend** 装饰器可以快速定义并复用组件的自定义样式。
```
......
zh-cn/application-dev/ui/ts-component-based-preview.md
浏览文件 @ d2a5f2af
# @Preview
用**@Preview**装饰的自定义组件可以在DevEco的PC预览上进行单组件预览，加载页面时，将创建并呈现**@Preview**装饰的自定义组件。
用 **@Preview** 装饰的自定义组件可以在DevEco的PC预览上进行单组件预览，加载页面时，将创建并呈现 **@Preview** 装饰的自定义组件。
> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
> 在单个源文件中，最多可以使用**@Preview**装饰一个自定义组件。
> 在单个源文件中，最多可以使用 **@Preview** 装饰一个自定义组件。
## 示例
......
zh-cn/application-dev/ui/ts-component-states-link.md
浏览文件 @ d2a5f2af
# @Link
**@Link**装饰的变量可以和父组件的**@State**变量建立双向数据绑定：
**@Link**装饰的变量可以和父组件的 **@State** 变量建立双向数据绑定：
- **支持多种类型：@Link**变量的值与**@State**变量的类型相同，即class、number、string、boolean或这些类型的数组；
- **支持多种类型：@Link**变量的值与 **@State** 变量的类型相同，即class、number、string、boolean或这些类型的数组；
- **私有：**仅在组件内访问；
- **私有：** 仅在组件内访问；
- **单个数据源：**初始化**@Link**变量的父组件的变量必须是**@State**变量；
- **单个数据源：** 初始化 **@Link** 变量的父组件的变量必须是 **@State** 变量；
- **双向通信：**子组件对**@Link**变量的更改将同步修改父组件的**@State**变量；
- **双向通信：** 子组件对 **@Link** 变量的更改将同步修改父组件的 **@State** 变量；
- **创建自定义组件时需要将变量的引用传递给@Link变量：**在创建组件的新实例时，必须使用命名参数初始化所有**@Link**变量。**@Link**变量可以使用**@State**变量或**@Link**变量的引用进行初始化。**@State**变量可以通过'**$**'操作符创建引用。
- **创建自定义组件时需要将变量的引用传递给@Link变量：** 在创建组件的新实例时，必须使用命名参数初始化所有 **@Link** 变量。 **@Link** 变量可以使用 **@State** 变量或 **@Link** 变量的引用进行初始化。 **@State** 变量可以通过' **$** '操作符创建引用。
> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
......@@ -48,7 +48,7 @@ struct PlayButton {
}
```
**@Link**语义是从'**$**'操作符引出，即**$isPlaying**是**this.isPlaying**内部状态的双向数据绑定。当您单击**PlayButton**时，PlayButton 的**Image**组件和**Text**组件将同时进行刷新。
**@Link**语义是从' **$** '操作符引出，即 **$isPlaying** 是**this.isPlaying**内部状态的双向数据绑定。当您单击**PlayButton**时，PlayButton 的**Image**组件和**Text**组件将同时进行刷新。
## 复杂类型示例
......@@ -129,6 +129,6 @@ struct ChildB {
上述示例中，ParentView包含ChildA和ChildB两个子组件，ParentView的状态变量**counter**分别初始化ChildA和ChildB：
- ChildB使用**@Link**建立双向状态绑定。当**ChildB**修改**counterRef**状态变量值时，该更改将同步到**ParentView**和**ChildA**共享；
- ChildB使用 **@Link** 建立双向状态绑定。当**ChildB**修改**counterRef**状态变量值时，该更改将同步到**ParentView**和**ChildA**共享；
- ChildA使用**@Prop**建立从**ParentView**到自身的单向状态绑定。当**ChildA**修改状态时，**ChildA**将重新渲染，但该更改不会传达给**ParentView**和**ChildB。**
zh-cn/application-dev/ui/ts-component-states-prop.md
浏览文件 @ d2a5f2af
# @Prop
**@Prop**具有与**@State**相同的语义，但初始化方式不同。**@Prop**装饰的变量必须使用其父组件提供的**@State**变量进行初始化，允许组件内部修改**@Prop**变量，但上述更改不会通知给父组件，即**@Prop**属于单向数据绑定。
**@Prop** 具有与 **@State** 相同的语义，但初始化方式不同。 **@Prop** 装饰的变量必须使用其父组件提供的 **@State** 变量进行初始化，允许组件内部修改 **@Prop** 变量，但上述更改不会通知给父组件，即 **@Prop** 属于单向数据绑定。
**@Prop** 状态数据具有以下特征：
**@Prop**状态数据具有以下特征：
- **支持简单类型：** 仅支持简单类型：number、string、boolean；
- **支持简单类型：**仅支持简单类型：number、string、boolean；
- **私有：** 仅在组件内访问；
- **私有：**仅在组件内访问；
- **支持多个实例：** 一个组件中可以定义多个标有 **@Prop** 的属性；
- **支持多个实例：**一个组件中可以定义多个标有**@Prop**的属性；
- **创建自定义组件时将值传递给@Prop变量进行初始化：**在创建组件的新实例时，必须初始化所有@Prop变量，不支持在组件内部进行初始化。
- **创建自定义组件时将值传递给 @Prop 变量进行初始化：** 在创建组件的新实例时，必须初始化所有 **@Prop** 变量，不支持在组件内部进行初始化。
## 示例
......@@ -67,7 +66,7 @@ struct CountDownComponent {
}
```
在上述示例中，当按“+1”或“-1”按钮时，父组件状态发生变化，重新执行**build**方法，此时将创建一个新的**CountDownComponent**组件。父组件的**countDownStartValue**状态属性被用于初始化子组件的**@Prop**变量。当按下子组件的“Try again”按钮时，其**@Prop**变量**count**将被更改，这将导致**CountDownComponent**重新渲染。但是，**count**值的更改不会影响父组件的**countDownStartValue**值。
在上述示例中，当按“+1”或“-1”按钮时，父组件状态发生变化，重新执行**build**方法，此时将创建一个新的**CountDownComponent**组件。父组件的**countDownStartValue**状态属性被用于初始化子组件的 **@Prop** 变量。当按下子组件的“Try again”按钮时，其 **@Prop** 变量**count**将被更改，这将导致**CountDownComponent**重新渲染。但是，**count**值的更改不会影响父组件的**countDownStartValue**值。
> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
> 创建新组件实例时，必须初始化其所有**@Prop**变量。
> 创建新组件实例时，必须初始化其所有 **@Prop** 变量。
zh-cn/application-dev/ui/ts-component-states-state.md
浏览文件 @ d2a5f2af
# @State
**@State**装饰的变量是组件内部的状态数据，当这些状态数据被修改时，将会调用所在组件的**build**方法进行UI刷新。
**@State** 装饰的变量是组件内部的状态数据，当这些状态数据被修改时，将会调用所在组件的**build**方法进行UI刷新。
**@State** 状态数据具有以下特征：
**@State**状态数据具有以下特征：
- **支持多种类型：** 允许如下强类型的按值和按引用类型：**class**、**number**、**boolean**、**string**，以及这些类型的数组，即 **Array&lt;class&gt;**、**Array&lt;string&gt;**、**Array&lt;boolean&gt;**、**Array&lt;number&gt;** 。不允许**object**和**any。**
- **支持多种类型：**允许如下强类型的按值和按引用类型：**class**、**number**、**boolean**、**string**，以及这些类型的数组，即**Array&lt;class&gt;**、**Array&lt;string&gt;**、**Array&lt;boolean&gt;**、**Array&lt;number&gt;**。不允许**object**和**any。**
- **支持多实例：** 组件不同实例的内部状态数据独立。
- **支持多实例：**组件不同实例的内部状态数据独立。
- **内部私有：** 标记为 **@State** 的属性不能直接在组件外部修改。它的生命周期取决于它所在的组件。
- **内部私有：**标记为**@State**的属性不能直接在组件外部修改。它的生命周期取决于它所在的组件。
- **需要本地初始化：** 必须为所有 **@State** 变量分配初始值，将变量保持未初始化可能导致框架行为未定义。
- **需要本地初始化：**必须为所有**@State**变量分配初始值，将变量保持未初始化可能导致框架行为未定义。
- **创建自定义组件时支持通过状态变量名设置初始值：**在创建组件实例时，可以通过变量名显式指定**@State**状态属性的初始值**。**
- **创建自定义组件时支持通过状态变量名设置初始值：** 在创建组件实例时，可以通过变量名显式指定 **@State** 状态属性的初始值**。**
## 简单类型的状态属性示例
......@@ -92,7 +91,7 @@ struct MyComponent {
在上述示例中：
- 用户定义的组件**MyComponent**定义了**@State**状态变量**count**和**title**。如果**count**或**title**的值发生变化，则执行**MyComponent**的**build**方法来重新渲染组件；
- 用户定义的组件**MyComponent**定义了 **@State** 状态变量**count**和**title**。如果**count**或**title**的值发生变化，则执行**MyComponent**的**build**方法来重新渲染组件；
- **EntryComponent**中有多个**MyComponent**组件实例，第一个**MyComponent**内部状态的更改不会影响第二个**MyComponent**；
......
zh-cn/application-dev/ui/ts-general-ui-concepts.md
浏览文件 @ d2a5f2af
......@@ -36,14 +36,14 @@ struct Hello {
上述示例代码描述了简单页面的结构，并介绍了以下基本概念：
- **装饰器：**装饰类、结构、方法和变量，并为它们赋予特殊含义。例如，上例中的**\@Entry**、**\@Component**和**\@State**都是装饰器；
- **装饰器**：装饰类、结构、方法和变量，并为它们赋予特殊含义。例如，上例中的 **@Entry**、 **@Component** 和 **@State** 都是装饰器；
- **自定义组件：**可重用的UI单元，可以与其他组件组合，如**\@Component**装饰的**struct Hello**；
- **自定义组件**：可重用的UI单元，可以与其他组件组合，如 **@Component** 装饰的**struct Hello**；
- **UI描述：**声明性描述UI结构，例如**build()**方法中的代码块；
- **UI描述**：声明性描述UI结构，例如 **build()** 方法中的代码块；
- **内置组件：**框架中默认内置的基本组件和布局组件，开发者可以直接调用，如**Column**、**Text**、**Divider**、**Button**等；
- **内置组件**：框架中默认内置的基本组件和布局组件，开发者可以直接调用，如**Column**、**Text**、**Divider**、**Button**等；
- **属性方法：**用于配置组件属性，如**fontSize()**、**width()**、**height()**、**color()**等；
- **属性方法**：用于配置组件属性，如 **fontSize()**、**width()**、**height()**、**color()** 等；
- **事件方法：**用于将组件响应逻辑添加到事件中。逻辑是通过事件方法设置的。例如，按钮后面的**onClick()**。
- **事件方法**：用于将组件响应逻辑添加到事件中。逻辑是通过事件方法设置的。例如，按钮后面的 **onClick()** 。
zh-cn/application-dev/ui/ui-arkui-js.md
浏览文件 @ d2a5f2af
......@@ -6,8 +6,6 @@
- **[框架说明](js-framework.md)**
- **[初步体验JS FA应用](ui-js-fa.md)**
- **[构建用户界面](ui-js-building-ui.md)**
- **[常见组件开发指导](ui-js-common-components.md)**
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或