Skip to content

D
Docs

OpenHarmony / Docs
大约 2 年 前同步成功

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

!10282 挑单--整改文档 

Merge pull request !10282 from wangshuainan1/OpenHarmony-3.2-Beta3
上级 b8f1dcd9 72467027
隐藏空白更改
内联 并排
Showing with 130 addition and 49 deletion
zh-cn/application-dev/reference/apis/js-apis-prompt.md
浏览文件 @ fe525ad0
...@@ -92,6 +92,8 @@ prompt.showDialog({ ...@@ -92,6 +92,8 @@ prompt.showDialog({
}) })
``` ```
![zh-cn_image_0002](figures/zh-cn_image_0002.gif)
## prompt.showDialog ## prompt.showDialog
showDialog(options: ShowDialogOptions, callback: AsyncCallback<ShowDialogSuccessResponse>):void showDialog(options: ShowDialogOptions, callback: AsyncCallback<ShowDialogSuccessResponse>):void
...@@ -132,6 +134,8 @@ prompt.showDialog({ ...@@ -132,6 +134,8 @@ prompt.showDialog({
}); });
``` ```
![zh-cn_image_0004](figures/zh-cn_image_0004.gif)
## ShowDialogOptions ## ShowDialogOptions
对话框的选项。 对话框的选项。
...@@ -195,6 +199,8 @@ prompt.showActionMenu({ ...@@ -195,6 +199,8 @@ prompt.showActionMenu({
}) })
``` ```
![zh-cn_image_0005](figures/zh-cn_image_0005.gif)
## prompt.showActionMenu ## prompt.showActionMenu
showActionMenu(options: ActionMenuOptions): Promise<ActionMenuSuccessResponse> showActionMenu(options: ActionMenuOptions): Promise<ActionMenuSuccessResponse>
......
zh-cn/application-dev/reference/arkui-js/js-components-basic-piece.md
浏览文件 @ fe525ad0
# piece # piece
一种块状的入口，可包含图片和文本。常用于展示收件人，例如：邮件收件人或信息收件人。
> **说明：** > **说明：**
> 从API version 5开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 > 从API version 5开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
一种块状的入口，可包含图片和文本。常用于展示收件人，例如：邮件收件人或信息收件人。
## 子组件 ## 子组件
...@@ -15,11 +15,11 @@ ...@@ -15,11 +15,11 @@
除支持[通用属性](../arkui-js/js-components-common-attributes.md)外，还支持如下属性： 除支持[通用属性](../arkui-js/js-components-common-attributes.md)外，还支持如下属性：
| 名称 | 类型 | 默认值 | 必填 | 描述 | | 名称 | 类型 | 必填 | 描述 |
| -------- | ------- | ----- | ---- | ---------------------------------------- | | -------- | ------- | ---- | ------------------------------------------------------------ |
| content | string | - | 是 | 操作块文本内容。 | | content | string | 是 | 操作块文本内容。 |
| closable | boolean | false | 否 | 设置当前操作块是否显示删除图标，当显示删除图标时，点击删除图标会触发close事件。 | | closable | boolean | 否 | 设置当前操作块是否显示删除图标，当显示删除图标时，点击删除图标会触发close事件。<br/>默认值：false |
| icon | string | - | 否 | 操作块删除图标的url，支持本地路径。 | | icon | string | 否 | 操作块删除图标的url，支持本地路径。 |
## 样式 ## 样式
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
浏览文件 @ fe525ad0
...@@ -348,3 +348,53 @@ struct ImageExample3 { ...@@ -348,3 +348,53 @@ struct ImageExample3 {
``` ```
![zh-cn_image_0000001205972610](figures/zh-cn_image_0000001205972610.gif) ![zh-cn_image_0000001205972610](figures/zh-cn_image_0000001205972610.gif)
### 渲染沙箱路径图片
```
import fileio from '@ohos.fileio';
import image from '@ohos.multimedia.image';
const EMPTY_PATH = 'file://';
@Entry
@Component
struct LoadImageExample {
@State fileContent: string = '';
@State path: string = EMPTY_PATH;
@State accountInfoHeadPic: any = '';
build() {
Column() {
Button('读取沙箱图片')
.margin({ bottom: 10 })
.onClick(() => {
try {
this.path = EMPTY_PATH;
let context = getContext(this);
let path = context.getApplicationContext().filesDir + '/icon.png';
console.log(`读取沙箱图片=========>${path}`);
let fd = fileio.openSync(path, 0o100, 0o666);
console.log(`create file========>${fd}`);
let srcPath = context.bundleCodeDir + '/entry/resource/base/media/icon.png';
fileio.copyFileSync(srcPath, path);
console.log(`error:=============>${e.message}`);
}
})
Button('读取资源图片')
.margin({ bottom: 10 })
.onClick(() => {
this.path = EMPTY_PATH;
this.path += getContext(this.bundleCodeDir + '/entry/resource/base/media/icon.png');
})
Text(`图片路径:${this.path}`)
.fontSize(20)
.margin({ bottom: 10 })
Image(this.path)
.width(100)
.height(100)
}
.width('100%').height('100%')
}
}
```
\ No newline at end of file
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-slider.md
浏览文件 @ fe525ad0
...@@ -56,7 +56,7 @@ Slider(options?: {value?: number, min?: number, max?: number, step?: number, sty ...@@ -56,7 +56,7 @@ Slider(options?: {value?: number, min?: number, max?: number, step?: number, sty
| 名称 | 功能描述 | | 名称 | 功能描述 |
| -------- | -------- | | -------- | -------- |
| onChange(callback:&nbsp;(value:&nbsp;number,&nbsp;mode:&nbsp;SliderChangeMode)&nbsp;=&gt;&nbsp;void) | Slider滑动时触发事件回调。<br/>value：当前进度值。<br/>mode：拖动状态。 | | onChange(callback:&nbsp;(value:&nbsp;number,&nbsp;mode:&nbsp;SliderChangeMode)&nbsp;=&gt;&nbsp;void) | Slider滑动时触发事件回调。<br/>value：当前进度值。若返回值有小数，可使用Math.toFixed()将数据处理为想要的精度。<br/>mode：拖动状态。 |
## SliderChangeMode枚举说明 ## SliderChangeMode枚举说明
......
zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
浏览文件 @ fe525ad0
...@@ -771,7 +771,7 @@ clearRect(x: number, y: number, w: number, h: number): void ...@@ -771,7 +771,7 @@ clearRect(x: number, y: number, w: number, h: number): void
Canvas(this.context) Canvas(this.context)
.width('100%') .width('100%')
.height('100%') .height('100%')
.backgroundColor('#ffff00') .backgroundColor('#ffffff')
.onReady(() =>{ .onReady(() =>{
this.context.fillStyle = 'rgb(0,0,255)' this.context.fillStyle = 'rgb(0,0,255)'
this.context.fillRect(0,0,500,500) this.context.fillRect(0,0,500,500)
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-action-sheet.md
浏览文件 @ fe525ad0
...@@ -58,26 +58,26 @@ struct ActionSheetExample { ...@@ -58,26 +58,26 @@ struct ActionSheetExample {
confirm: { confirm: {
value: 'Confirm button', value: 'Confirm button',
action: () => { action: () => {
console.log('Get Alert Dialog handled') console.log('Get Alert Dialog handled');
} }
}, },
sheets: [ sheets: [
{ {
title: 'apples', title: 'apples',
action: () => { action: () => {
console.error('apples') console.log('apples');
} }
}, },
{ {
title: 'bananas', title: 'bananas',
action: () => { action: () => {
console.error('bananas') console.log('bananas');
} }
}, },
{ {
title: 'pears', title: 'pears',
action: () => { action: () => {
console.error('pears') console.log('pears');
} }
} }
] ]
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-alert-dialog-box.md
浏览文件 @ fe525ad0
...@@ -13,30 +13,30 @@ ...@@ -13,30 +13,30 @@
| ---- | --------------- | -------- | | ---- | --------------- | -------- |
| show | AlertDialogParamWithConfirm&nbsp;\|&nbsp;AlertDialogParamWithButtons | 定义并显示AlertDialog组件。 | | show | AlertDialogParamWithConfirm&nbsp;\|&nbsp;AlertDialogParamWithButtons | 定义并显示AlertDialog组件。 |
## AlertDialogParamWithConfirm对象说明 - paramObject1参数
| 参数名 | 参数类型 | 必填 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ---------- | ---------------- | ---------- | ------------------------------- | | -------- | -------- | -------- | -------- | -------- |
| title | [ResourceStr](ts-types.md#resourcestr) | 否 | 弹窗标题。 | | title | string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型) | 否 | - | 弹窗标题。 |
| message | [ResourceStr](ts-types.md#resourcestr) | 是 | 弹窗内容。 | | message | string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型) | 是 | - | 弹窗内容。 |
| autoCancel | boolean | 否 | 点击遮障层时，是否关闭弹窗。<br>默认值：true | | autoCancel | boolean | 否 | true | 点击遮障层时，是否关闭弹窗。 |
| confirm | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>fontColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>backgroundColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | 确认按钮的文本内容、文本色、按钮背景色和点击回调。 | | confirm | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>fontColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>backgroundColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | - | 确认按钮的文本内容、文本色、按钮背景色和点击回调。 |
| cancel | ()&nbsp;=&gt;&nbsp;void | 否 | 点击遮障层关闭dialog时的回调。 | | cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 |
| alignment | [DialogAlignment](#dialogalignment枚举说明) | 否 | 弹窗在竖直方向上的对齐方式。<br>默认值：DialogAlignment.Default | | alignment | [DialogAlignment](ts-methods-custom-dialog-box.md) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 |
| offset | [Offset](ts-types.md#offset) | 否 | 弹窗相对alignment所在位置的偏移量。 | | offset | {<br/>dx:&nbsp;Length&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>dy:&nbsp;Length&nbsp;&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型)<br/>} | 否 | - | 弹窗相对alignment所在位置的偏移量。 |
| gridCount | number | 否 | 弹窗容器宽度所占用栅格数。 | | gridCount | number | 否 | - | 弹窗容器宽度所占用栅格数。<br/>**说明：**<br/>当gridCount小于等于0时，弹窗宽度是固定的；大于0时，按照设置的数值显示宽度，最大值为4，若值为小数，则向下取整。 |
## AlertDialogParamWithButtons对象说明 - paramObject2参数
| 参数名 | 参数类型 | 必填 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| --------------- | ---------------------- | ------------ | --------------------- | | -------- | -------- | -------- | -------- | -------- |
| title | [ResourceStr](ts-types.md#resourcestr) | 否 | 弹窗标题。 | | title | string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型) | 否 | - | 弹窗标题。 |
| message | [ResourceStr](ts-types.md#resourcestr) | 是 | 弹窗内容。 | | message | string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型) | 是 | - | 弹窗内容。 |
| autoCancel | boolean | 否 | 点击遮障层时，是否关闭弹窗。<br>默认值：true | | autoCancel | boolean | 否 | true | 点击遮障层时，是否关闭弹窗。 |
| primaryButton | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>fontColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>backgroundColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void;<br/>} | 否 | 按钮的文本内容、文本色、按钮背景色和点击回调。 | | primaryButton | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>fontColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>backgroundColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void;<br/>} | 否 | - | 按钮的文本内容、文本色、按钮背景色和点击回调。 |
| secondaryButton | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>fontColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>backgroundColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void;<br/>} | 否 | 按钮的文本内容、文本色、按钮背景色和点击回调。 | | secondaryButton | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>fontColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>backgroundColor?:&nbsp;Color&nbsp;\|&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void;<br/>} | 否 | - | 按钮的文本内容、文本色、按钮背景色和点击回调。 |
| cancel | ()&nbsp;=&gt;&nbsp;void | 否 | 点击遮障层关闭dialog时的回调。 | | cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 |
| alignment | [DialogAlignment](#dialogalignment枚举说明) | 否 | 弹窗在竖直方向上的对齐方式。<br>默认值：DialogAlignment.Default | | alignment | [DialogAlignment](ts-methods-custom-dialog-box.md) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 |
| offset | [Offset](ts-types.md#offset) | 否 | 弹窗相对alignment所在位置的偏移量。 | | offset | {<br/>dx:&nbsp;Length&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>dy:&nbsp;Length&nbsp;&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型)<br/>} | 否 | - | 弹窗相对alignment所在位置的偏移量。 |
| gridCount | number | 否 | 弹窗容器宽度所占用栅格数。 | | gridCount | number | 否 | - | 弹窗容器宽度所占用栅格数。<br/>**说明：**<br/>当gridCount小于等于0时，弹窗宽度是固定的；大于0时，按照设置的数值显示宽度，最大值为4，若值为小数，则向下取整。 |
## DialogAlignment枚举说明 ## DialogAlignment枚举说明
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md
浏览文件 @ fe525ad0
...@@ -11,10 +11,33 @@ ...@@ -11,10 +11,33 @@
## 接口 ## 接口
CustomDialogController(value:{builder: CustomDialog, cancel?: () =&gt; void, autoCancel?: boolean, alignment?: DialogAlignment, offset?: Offset, customStyle?: boolean, gridCount?: number}) CustomDialogController(value:{builder: CustomDialog, cancel?: () =&gt; void, autoCancel?: boolean, alignment?: DialogAlignment, offset?: Offset, customStyle?: boolean})
**参数:** - 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ---------------------- | ---------------------------------------- | ---- | ----------------------- | ---------------------- |
| builder | [CustomDialog](../../ui/ts-component-based-customdialog.md) | 是 | - | 自定义弹窗内容构造器。 |
| cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层退出时的回调。 |
| autoCancel | boolean | 否 | true | 是否允许点击遮障层退出。 |
| alignment | DialogAlignment | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 |
| offset | {<br/>dx:&nbsp;Length&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型),<br/>dy:&nbsp;Length&nbsp;&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource类型)<br/>} | 否 | - | 弹窗相对alignment所在位置的偏移量。 |
| customStyle | boolean | 否 | false | 弹窗容器样式是否自定义。 |
| gridCount<sup>8+</sup> | number | 否 | - | 弹窗宽度占栅格宽度的个数。 |
- DialogAlignment枚举说明
| 名称 | 描述 |
| ------------------------ | ------------------------------------------------------ |
| Top | 垂直顶部对齐。 |
| Center | 垂直居中对齐。 |
| Bottom | 垂直底部对齐。 |
| Default | 默认对齐。<br/>**说明：**<br/>与枚举值Center效果相同。 |
| TopStart<sup>8+</sup> | 左上对齐。 |
| TopEnd<sup>8+</sup> | 右上对齐。 |
| CenterStart<sup>8+</sup> | 左中对齐。 |
| CenterEnd<sup>8+</sup> | 右中对齐。 |
| BottomStart<sup>8+</sup> | 左下对齐。 |
| BottomEnd<sup>8+</sup> | 右下对齐。 |
| 参数名 | 参数类型 | 必填 | 参数描述 | | 参数名 | 参数类型 | 必填 | 参数描述 |
| ---------------------- | ---------------------------------------- | ------------------------- | ---------------------- | | ---------------------- | ---------------------------------------- | ------------------------- | ---------------------- |
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-timepicker-dialog.md
浏览文件 @ fe525ad0
...@@ -12,13 +12,13 @@ show(options?: TimePickerDialogOptions) ...@@ -12,13 +12,13 @@ show(options?: TimePickerDialogOptions)
定义时间滑动选择器弹窗并弹出。 定义时间滑动选择器弹窗并弹出。
- options参数 - options参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- | | -------- | -------- | -------- | -------- |
| selected | Date | 否 | 当前系统时间 | 设置选中项的时间。 | | selected | Date | 否 | 设置选中项的时间。<br/>默认值：当前系统时间 |
| useMilitaryTime | boolean | 否 | false | 展示时间是否为24小时制。 | | useMilitaryTime | boolean | 否 | 展示时间是否为24小时制。<br/>默认值：false |
| onAccept | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult对象说明)) => void | 否 | - | 点击弹窗中确定按钮时触发。 | | onAccept | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult对象说明)) => void | 否 | 点击弹窗中确定按钮时触发。 |
| onCancel | () => void | 否 | - | 点击弹窗中取消按钮时触发。 | | onCancel | () => void | 否 | 点击弹窗中取消按钮时触发。 |
| onChange | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult对象说明)) => void | 否 | - | 滑动选择器，当前选择项改变时触发。 | | onChange | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult对象说明)) => void | 否 | 滑动选择器，当前选择项改变时触发。 |
## 示例 ## 示例
......
zh-cn/application-dev/ui/ts-component-creation-re-initialization.md
浏览文件 @ fe525ad0
...@@ -56,10 +56,10 @@ struct ParentComp { ...@@ -56,10 +56,10 @@ struct ParentComp {
Column() { Column() {
Text(this.isCountDown ? 'Count Down' : 'Stopwatch') Text(this.isCountDown ? 'Count Down' : 'Stopwatch')
if (this.isCountDown) { if (this.isCountDown) {
Image('countdown.png') Image($r("app.media.countdown")).width(200).height(200)
TimerComponent({counter: 10, changePerSec: -1, showInColor: Color.Red}) TimerComponent({counter: 10, changePerSec: -1, showInColor: Color.Red})
} else { } else {
Image('stopwatch.png') Image($r("app.media.stopwatch")).width(200).height(200)
TimerComponent({counter: 0, changePerSec: +1, showInColor: Color.Black }) TimerComponent({counter: 0, changePerSec: +1, showInColor: Color.Black })
} }
Button(this.isCountDown ? 'Switch to Stopwatch' : 'Switch to Count Down') Button(this.isCountDown ? 'Switch to Stopwatch' : 'Switch to Count Down')
...@@ -93,3 +93,5 @@ struct TimerComponent { ...@@ -93,3 +93,5 @@ struct TimerComponent {
} }
} }
``` ```
![](figures/zh-cn_image_0000001118642023.gif)
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或