Skip to content

D
Docs

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

通知 161
Star 293
Fork 28
D
Docs
提交 521a7f3f 编写于 作者: W wangshuainan
浏览文件
操作

整理dos文档 

Signed-off-by: Nwangshuainan <wangshuainan1@huawei.com>
上级 1604e22b
隐藏空白更改
内联 并排
Showing with 141 addition and 79 deletion
zh-cn/application-dev/reference/apis/js-apis-prompt.md
浏览文件 @ 521a7f3f
...@@ -35,6 +35,8 @@ prompt.showToast({ ...@@ -35,6 +35,8 @@ prompt.showToast({
}); });
``` ```
![zh-cn_image_0001](figures/zh-cn_image_0001.gif)
## ShowToastOptions ## ShowToastOptions
文本提示框的选项。 文本提示框的选项。
...@@ -92,6 +94,8 @@ prompt.showDialog({ ...@@ -92,6 +94,8 @@ prompt.showDialog({
}) })
``` ```
![zh-cn_image_0002](figures/zh-cn_image_0002.gif)
## prompt.showDialog ## prompt.showDialog
showDialog(options: ShowDialogOptions, callback: AsyncCallback&lt;ShowDialogSuccessResponse&gt;):void showDialog(options: ShowDialogOptions, callback: AsyncCallback&lt;ShowDialogSuccessResponse&gt;):void
...@@ -132,6 +136,8 @@ prompt.showDialog({ ...@@ -132,6 +136,8 @@ prompt.showDialog({
}); });
``` ```
![zh-cn_image_0004](figures/zh-cn_image_0004.gif)
## ShowDialogOptions ## ShowDialogOptions
对话框的选项。 对话框的选项。
...@@ -195,6 +201,8 @@ prompt.showActionMenu({ ...@@ -195,6 +201,8 @@ prompt.showActionMenu({
}) })
``` ```
![zh-cn_image_0005](figures/zh-cn_image_0005.gif)
## prompt.showActionMenu ## prompt.showActionMenu
showActionMenu(options: ActionMenuOptions): Promise&lt;ActionMenuSuccessResponse&gt; showActionMenu(options: ActionMenuOptions): Promise&lt;ActionMenuSuccessResponse&gt;
...@@ -238,6 +246,8 @@ prompt.showActionMenu({ ...@@ -238,6 +246,8 @@ prompt.showActionMenu({
console.info('showActionMenu error: ' + err); console.info('showActionMenu error: ' + err);
}) })
``` ```
![zh-cn_image_0006](figures/zh-cn_image_0006.gif)
## ActionMenuOptions ## ActionMenuOptions
操作菜单的选项。 操作菜单的选项。
......
zh-cn/application-dev/reference/arkui-js/js-components-basic-piece.md
浏览文件 @ 521a7f3f
# piece # piece
一种块状的入口，可包含图片和文本。常用于展示收件人，例如：邮件收件人或信息收件人。
> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：** > ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
> 从API version 5开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 > 从API version 5开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
一种块状的入口，可包含图片和文本。常用于展示收件人，例如：邮件收件人或信息收件人。
## 子组件 ## 子组件
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
浏览文件 @ 521a7f3f
...@@ -21,9 +21,9 @@ Image(src: string | PixelMap | Resource) ...@@ -21,9 +21,9 @@ Image(src: string | PixelMap | Resource)
**参数：** **参数：**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ---- | ---------------------------------------- | ---- | ---- | ---------------------------------------- | | ------ | ------------------------------------------------------------ | ---- | ------ | ------------------------------------------------------------ |
| src | string\|&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)\|&nbsp;[Resource](ts-types.md#resource) | 是 | - | 图片的数据源，支持本地图片和网络图片。<br/>当使用相对路径引用图片资源时，例如`Image("common/test.jpg")`，不支持该Image组件被跨包/跨模块调用，建议使用`$r`方式来管理需全局使用的图片资源。<br/>\- 支持的图片格式包括png、jpg、bmp、svg和gif。<br/>\- 支持`Base64`字符串。格式`data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, 其中`[base64 data]`为`Base64`字符串数据。<br/>\- 支持`dataability://`路径前缀的字符串，用于访问通过data&nbsp;ability提供的图片路径。 | | src | string\|&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)\|&nbsp;[Resource](ts-types.md#resource) | 是 | - | 图片的数据源，支持本地图片和网络图片。<br/>当使用相对路径引用图片资源时，例如`Image("common/test.jpg")`，不支持该Image组件被跨包/跨模块调用，建议使用`$r`方式来管理需全局使用的图片资源。<br/>\- 支持的图片格式包括png、jpg、bmp、svg和gif。<br/>\- 支持`Base64`字符串。格式`data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, 其中`[base64 data]`为`Base64`字符串数据。<br/>\- 支持`dataability://`路径前缀的字符串，用于访问通过data&nbsp;ability提供的图片路径。<br/>\- 支持file:///data/storage路径前缀的字符串，用于读取本应用安装目录下files文件夹下的图片资源。需要保证目录包路径下的文件有可读权限。 |
## 属性 ## 属性
...@@ -265,3 +265,53 @@ struct ImageExample3 { ...@@ -265,3 +265,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
浏览文件 @ 521a7f3f
...@@ -55,9 +55,9 @@ Slider(options?:{value?: number, min?: number, max?: number, step?: number, styl ...@@ -55,9 +55,9 @@ Slider(options?:{value?: number, min?: number, max?: number, step?: number, styl
通用事件仅支持：OnAppear，OnDisAppear。 通用事件仅支持：OnAppear，OnDisAppear。
| 名称 | 功能描述 | | 名称 | 功能描述 |
| ---------------------------------------- | ---------------------------------------- | | ------------------------------------------------------------ | ------------------------------------------------------------ |
| 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
浏览文件 @ 521a7f3f
...@@ -773,7 +773,7 @@ clearRect(x: number, y: number, w: number, h: number): void ...@@ -773,7 +773,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
浏览文件 @ 521a7f3f
...@@ -19,24 +19,24 @@ show(value: {&nbsp;title: string&nbsp;|&nbsp;Resource,&nbsp;message: string&nbsp ...@@ -19,24 +19,24 @@ show(value: {&nbsp;title: string&nbsp;|&nbsp;Resource,&nbsp;message: string&nbsp
定义列表弹窗并弹出。 定义列表弹窗并弹出。
**参数：** **参数：**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- | | -------- | -------- | -------- | -------- | -------- |
| title | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 是 | - | 弹窗标题。 | | title | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 是 | - | 弹窗标题。 |
| message | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 是 | - | 弹窗内容。 | | message | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 是 | - | 弹窗内容。 |
| autoCancel | boolean | 否 | true | 点击遮障层时，是否关闭弹窗。 | | autoCancel | boolean | 否 | true | 点击遮障层时，是否关闭弹窗。 |
| confirm | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | - | 确认按钮的文本内容和点击回调。<br/>value：按钮文本内容。<br/>action:&nbsp;按钮选中时的回调。 | | confirm | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | - | 确认按钮的文本内容和点击回调。<br/>value：按钮文本内容。<br/>action:&nbsp;按钮选中时的回调。 |
| cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 | | cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 |
| alignment | [DialogAlignment](ts-methods-custom-dialog-box.md) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 | | alignment | [DialogAlignment](ts-methods-custom-dialog-box.md) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 |
| offset | {<br/>dx:&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>dy:&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>} | 否 | {<br/>dx:&nbsp;0,<br/>dy:&nbsp;0<br/>} | 弹窗相对alignment所在位置的偏移量。 | | offset | {<br/>dx:&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>dy:&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>} | 否 | {<br/>dx:&nbsp;0,<br/>dy:&nbsp;0<br/>} | 弹窗相对alignment所在位置的偏移量。 |
| sheets | Array&lt;SheetInfo&gt; | 是 | - | 设置选项内容，每个选择项支持设置图片、文本和选中的回调。 | | sheets | Array&lt;SheetInfo&gt; | 是 | - | 设置选项内容，每个选择项支持设置图片、文本和选中的回调。 |
## SheetInfo接口说明 ## SheetInfo接口说明
| 参数名 | 参数类型 | 必填 | 参数描述 | | 参数名 | 参数类型 | 必填 | 参数描述 |
| ------ | ------------------------------------------------------------ | ---- | ----------------- | | ------ | ------------------------------------------------------------ | ---- | ----------------- |
| title | string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource) | 是 | 选项的文本内容。 | | title | string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource) | 是 | 选项的文本内容。 |
| icon | string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource) | 否 | 选项的图标，默认无图标显示。 | | icon | string&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md#resource) | 否 | 选项的图标，默认无图标显示。 |
| action | ()=&gt;void | 是 | 选项选中的回调。 | | action | ()=&gt;void | 是 | 选项选中的回调。 |
## 示例 ## 示例
...@@ -57,26 +57,26 @@ struct ActionSheetExapmle { ...@@ -57,26 +57,26 @@ struct ActionSheetExapmle {
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
浏览文件 @ 521a7f3f
...@@ -14,29 +14,29 @@ ...@@ -14,29 +14,29 @@
| show | value:&nbsp;{&nbsp;AlertDialogParamWithConfirm&nbsp;\|&nbsp;AlertDialogParamWithButtons} | - | 定义并显示AlertDialog组件。 | | show | value:&nbsp;{&nbsp;AlertDialogParamWithConfirm&nbsp;\|&nbsp;AlertDialogParamWithButtons} | - | 定义并显示AlertDialog组件。 |
## AlertDialogParamWithConfirm对象说明 ## AlertDialogParamWithConfirm对象说明
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- | | -------- | -------- | -------- | -------- | -------- |
| title | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 否 | - | 弹窗标题。 | | title | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 否 | - | 弹窗标题。 |
| message | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 是 | - | 弹窗内容。 | | message | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 是 | - | 弹窗内容。 |
| autoCancel | boolean | 否 | 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](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/>} | 否 | - | 确认按钮的文本内容、文本色、按钮背景色和点击回调。 |
| cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 | | cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 |
| alignment | [DialogAlignment](ts-methods-custom-dialog-box.md#dialogalignment枚举说明) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 | | alignment | [DialogAlignment](ts-methods-custom-dialog-box.md#dialogalignment枚举说明) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 |
| offset | {<br/>dx:&nbsp;Length&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>dy:&nbsp;Length&nbsp;&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>} | 否 | - | 弹窗相对alignment所在位置的偏移量。 | | offset | {<br/>dx:&nbsp;Length&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>dy:&nbsp;Length&nbsp;&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>} | 否 | - | 弹窗相对alignment所在位置的偏移量。 |
| gridCount | number | 否 | - | 弹窗容器宽度所占用栅格数。 | | gridCount | number | 否 | - | 弹窗容器宽度所占用栅格数。<br/>**说明：**<br/>当gridCount小于等于0时，弹窗宽度是固定的；大于0时，按照设置的数值显示宽度，最大值为4，若值为小数，则向下取整。 |
## AlertDialogParamWithButtons对象说明 ## AlertDialogParamWithButtons对象说明
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- | | -------- | -------- | -------- | -------- | -------- |
| title | string&nbsp;\|&&nbsp;[Resource](ts-types.md#resource) | 否 | - | 弹窗标题。 | | title | string&nbsp;\|&&nbsp;[Resource](ts-types.md#resource) | 否 | - | 弹窗标题。 |
| message | string&nbsp;\|&&nbsp;[Resource](ts-types.md#resource) | 是 | - | 弹窗内容。 | | message | string&nbsp;\|&&nbsp;[Resource](ts-types.md#resource) | 是 | - | 弹窗内容。 |
| autoCancel | boolean | 否 | 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](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](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](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/>} | 否 | - | 按钮的文本内容、文本色、按钮背景色和点击回调。 |
| cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 | | cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 |
| alignment | [DialogAlignment](ts-methods-custom-dialog-box.md#dialogalignment枚举说明) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 | | alignment | [DialogAlignment](ts-methods-custom-dialog-box.md#dialogalignment枚举说明) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 |
| offset | {<br/>dx:&nbsp;Length&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>dy:&nbsp;Length&nbsp;&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>} | 否 | - | 弹窗相对alignment所在位置的偏移量。 | | offset | {<br/>dx:&nbsp;Length&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>dy:&nbsp;Length&nbsp;&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>} | 否 | - | 弹窗相对alignment所在位置的偏移量。 |
| gridCount | number | 否 | - | 弹窗容器宽度所占用栅格数。 | | gridCount | number | 否 | - | 弹窗容器宽度所占用栅格数。 |
## 示例 ## 示例
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md
浏览文件 @ 521a7f3f
...@@ -24,18 +24,18 @@ CustomDialogController(value:{builder: CustomDialog, cancel?: () =&gt; void, aut ...@@ -24,18 +24,18 @@ CustomDialogController(value:{builder: CustomDialog, cancel?: () =&gt; void, aut
| gridCount<sup>8+</sup> | number | 否 | - | 弹窗宽度占栅格宽度的个数。 | | gridCount<sup>8+</sup> | number | 否 | - | 弹窗宽度占栅格宽度的个数。 |
## DialogAlignment枚举说明 ## DialogAlignment枚举说明
| 名称 | 描述 | | 名称 | 描述 |
| -------- | -------- | | -------- | -------- |
| Top | 垂直顶部对齐。 | | Top | 垂直顶部对齐。 |
| Center | 垂直居中对齐。 | | Center | 垂直居中对齐。 |
| Bottom | 垂直底部对齐。 | | Bottom | 垂直底部对齐。 |
| Default | 默认对齐。 | | Default | 默认对齐。<br/>**说明：**<br/>与枚举值Center效果相同。 |
| TopStart<sup>8+</sup> | 左上对齐。 | | TopStart<sup>8+</sup> | 左上对齐。 |
| TopEnd<sup>8+</sup> | 右上对齐。 | | TopEnd<sup>8+</sup> | 右上对齐。 |
| CenterStart<sup>8+</sup> | 左中对齐。 | | CenterStart<sup>8+</sup> | 左中对齐。 |
| CenterEnd<sup>8+</sup> | 右中对齐。 | | CenterEnd<sup>8+</sup> | 右中对齐。 |
| BottomStart<sup>8+</sup> | 左下对齐。 | | BottomStart<sup>8+</sup> | 左下对齐。 |
| BottomEnd<sup>8+</sup> | 右下对齐。 | | BottomEnd<sup>8+</sup> | 右下对齐。 |
## CustomDialogController ## CustomDialogController
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-timepicker-dialog.md
浏览文件 @ 521a7f3f
...@@ -16,13 +16,13 @@ show(options?: TimePickerDialogOptions) ...@@ -16,13 +16,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 | 否 | 滑动选择器，当前选择项改变时触发。 |
## 示例 ## 示例
...@@ -32,7 +32,7 @@ show(options?: TimePickerDialogOptions) ...@@ -32,7 +32,7 @@ show(options?: TimePickerDialogOptions)
@Entry @Entry
@Component @Component
struct TimePickerDialogExample01 { struct TimePickerDialogExample01 {
@State isUseMilitaryTime: boolean = true @State isUseMilitaryTime: boolean = true;
build() { build() {
Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center, Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center,
...@@ -41,13 +41,13 @@ struct TimePickerDialogExample01 { ...@@ -41,13 +41,13 @@ struct TimePickerDialogExample01 {
TimePickerDialog.show({ TimePickerDialog.show({
useMilitaryTime: this.isUseMilitaryTime, useMilitaryTime: this.isUseMilitaryTime,
onAccept: (value: TimePickerResult) => { onAccept: (value: TimePickerResult) => {
console.info("TimePickerDialog:onAccept()" + JSON.stringify(value)) console.info("TimePickerDialog:onAccept()" + JSON.stringify(value));
}, },
onCancel: () => { onCancel: () => {
console.info("TimePickerDialog:onCancel()") console.info("TimePickerDialog:onCancel()");
}, },
onChange: (value: TimePickerResult) => { onChange: (value: TimePickerResult) => {
console.info("TimePickerDialog:onChange()" + JSON.stringify(value)) console.info("TimePickerDialog:onChange()" + JSON.stringify(value));
} }
}) })
}) })
...@@ -61,7 +61,7 @@ struct TimePickerDialogExample01 { ...@@ -61,7 +61,7 @@ struct TimePickerDialogExample01 {
@Entry @Entry
@Component @Component
struct TimePickerDialogExample02 { struct TimePickerDialogExample02 {
@State isUseMilitaryTime: boolean = false @State isUseMilitaryTime: boolean = false;
build() { build() {
Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center, Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center,
...@@ -70,13 +70,13 @@ struct TimePickerDialogExample02 { ...@@ -70,13 +70,13 @@ struct TimePickerDialogExample02 {
TimePickerDialog.show({ TimePickerDialog.show({
useMilitaryTime: this.isUseMilitaryTime, useMilitaryTime: this.isUseMilitaryTime,
onAccept: (value: TimePickerResult) => { onAccept: (value: TimePickerResult) => {
console.info("TimePickerDialog:onAccept()" + JSON.stringify(value)) console.info("TimePickerDialog:onAccept()" + JSON.stringify(value));
}, },
onCancel: () => { onCancel: () => {
console.info("TimePickerDialog:onCancel()") console.info("TimePickerDialog:onCancel()");
}, },
onChange: (value: TimePickerResult) => { onChange: (value: TimePickerResult) => {
console.info("TimePickerDialog:onChange()" + JSON.stringify(value)) console.info("TimePickerDialog:onChange()" + JSON.stringify(value));
} }
}) })
}) })
......
zh-cn/application-dev/ui/ts-component-creation-re-initialization.md
浏览文件 @ 521a7f3f
...@@ -55,10 +55,10 @@ struct ParentComp { ...@@ -55,10 +55,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')
...@@ -92,3 +92,5 @@ struct TimerComponent { ...@@ -92,3 +92,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.
先完成此消息的编辑！
想要评论请 注册 或