diff --git a/zh-cn/application-dev/reference/apis/js-apis-prompt.md b/zh-cn/application-dev/reference/apis/js-apis-prompt.md index a0fbe254c019fadee070f0eec5657ef79bd595b3..aeb56ea6f380e2daf696e872cb01514d167ead8c 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-prompt.md +++ b/zh-cn/application-dev/reference/apis/js-apis-prompt.md @@ -21,28 +21,31 @@ showToast(options: ShowToastOptions): void **系统能力:** SystemCapability.ArkUI.ArkUI.Full **参数:** + | 参数名 | 类型 | 必填 | 说明 | | ------- | ------------------------------------- | ---- | ------- | | options | [ShowToastOptions](#showtoastoptions) | 是 | 文本弹窗选项。 | **示例:** - ```js + +```js prompt.showToast({ message: 'Message Info', duration: 2000, }); - ``` +``` + ## ShowToastOptions 文本提示框的选项。 -**系统能力:** 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。 +**系统能力:** SystemCapability.ArkUI.ArkUI.Full。 -| 名称 | 类型 | 必填 | 说明 | -| -------- | ---------------------------------------- | ------ | ---------------------------------------- | -| message | string\| [Resource](../../ui/ts-types.md#resource类型)9+ | 是 | 显示的文本信息。 | -| duration | number | 否 | 默认值1500ms,取值区间:1500ms-10000ms。若小于1500ms则取默认值,若大于10000ms则取上限值10000ms。 | -| bottom | string\| number | 否 | 设置弹窗边框距离屏幕底部的位置。 | +| 名称 | 类型 | 必填 | 说明 | +| -------- | ---------------------------------------- | ---- | ---------------------------------------- | +| message | string\| [Resource](../../ui/ts-types.md#resource类型)9+ | 是 | 显示的文本信息。 | +| duration | number | 否 | 默认值1500ms,取值区间:1500ms-10000ms。若小于1500ms则取默认值,若大于10000ms则取上限值10000ms。 | +| bottom | string\| number | 否 | 设置弹窗边框距离屏幕底部的位置。 | ## prompt.showDialog @@ -50,9 +53,10 @@ showDialog(options: ShowDialogOptions): Promise<ShowDialogSuccessResponse> 创建并显示对话框,对话框响应后同步返回结果。 -**系统能力:** SystemCapability.ArkUI.ArkUI.Full +**系统能力:** SystemCapability.ArkUI.ArkUI.Full **参数:** + | 参数名 | 类型 | 必填 | 说明 | | ------- | --------------------------------------- | ---- | ------ | | options | [ShowDialogOptions](#showdialogoptions) | 是 | 对话框选项。 | @@ -65,7 +69,7 @@ showDialog(options: ShowDialogOptions): Promise<ShowDialogSuccessResponse> **示例:** - ```js +```js prompt.showDialog({ title: 'Title Info', message: 'Message Info', @@ -86,7 +90,7 @@ prompt.showDialog({ .catch(err => { console.info('showDialog error: ' + err); }) - ``` +``` ## prompt.showDialog @@ -94,17 +98,18 @@ showDialog(options: ShowDialogOptions, callback: AsyncCallback<ShowDialogSucc 创建并显示对话框,对话框响应结果异步返回。 -**系统能力:** SystemCapability.ArkUI.ArkUI.Full - +**系统能力:** SystemCapability.ArkUI.ArkUI.Full **参数:** + | 参数名 | 类型 | 必填 | 说明 | | -------- | ---------------------------------------- | ---- | ------------ | | options | [ShowDialogOptions](#showdialogoptions) | 是 | 页面显示对话框信息描述。 | | callback | AsyncCallback<[ShowDialogSuccessResponse](#showdialogsuccessresponse)> | 是 | 对话框响应结果回调。 | **示例:** - ```js + +```js prompt.showDialog({ title: 'showDialog Title Info', message: 'Message Info', @@ -125,13 +130,13 @@ prompt.showDialog({ } console.info('showDialog success callback, click button: ' + data.index); }); - ``` +``` ## ShowDialogOptions 对话框的选项。 -**系统能力:** 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。 +**系统能力:** SystemCapability.ArkUI.ArkUI.Full | 名称 | 类型 | 必填 | 说明 | | ------- | ---------------------------------------- | ---- | ---------------------------------------- | @@ -143,7 +148,7 @@ prompt.showDialog({ 对话框的响应结果。 -**系统能力:** 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。 +**系统能力:** SystemCapability.ArkUI.ArkUI.Full | 名称 | 类型 | 说明 | | ----- | ------ | ------------------- | @@ -159,6 +164,7 @@ showActionMenu(options: ActionMenuOptions, callback: AsyncCallback<ActionMenu **系统能力:** 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。 **参数:** + | 参数名 | 类型 | 必填 | 说明 | | -------- | ---------------------------------------- | ---- | --------- | | options | [ActionMenuOptions](#actionmenuoptions) | 是 | 操作菜单选项。 | @@ -166,7 +172,8 @@ showActionMenu(options: ActionMenuOptions, callback: AsyncCallback<ActionMenu **示例:** - ```js + +```js prompt.showActionMenu({ title: 'Title Info', buttons: [ @@ -186,7 +193,7 @@ prompt.showActionMenu({ } console.info('showActionMenu success callback, click button: ' + data.index); }) - ``` +``` ## prompt.showActionMenu @@ -197,17 +204,20 @@ showActionMenu(options: ActionMenuOptions): Promise<ActionMenuSuccessResponse **系统能力:** SystemCapability.ArkUI.ArkUI.Full **参数:** + | 参数名 | 类型 | 必填 | 说明 | | ------- | --------------------------------------- | ---- | ------- | | options | [ActionMenuOptions](#actionmenuoptions) | 是 | 操作菜单选项。 | **返回值:** + | 类型 | 说明 | | ---------------------------------------- | ------- | | Promise<[ActionMenuSuccessResponse](#actionmenusuccessresponse)> | 菜单响应结果。 | **示例:** - ```js + +```js prompt.showActionMenu({ title: 'showActionMenu Title Info', buttons: [ @@ -227,7 +237,7 @@ prompt.showActionMenu({ .catch(err => { console.info('showActionMenu error: ' + err); }) - ``` +``` ## ActionMenuOptions 操作菜单的选项。 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md index b5edeedb5dc259f890202404e5b6c83abb27e133..41877c746edcc01b89ee5eceece30c1bc4e7d2b3 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md @@ -3,7 +3,7 @@ 滚动选择时间的组件。 > **说明:** -> 该组件从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 +> 该组件从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 ## 权限列表 @@ -20,31 +20,31 @@ TimePicker(options?: TimePickerOptions) -默认以00:00至23:59的时间区间创建滑动选择器。 +默认以00:00至23:59的时间区间创建滑动选择器。 - options参数 - | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | - | -------- | -------- | -------- | -------- | -------- | - | selected | Date | 否 | 当前系统时间 | 设置选中项的时间。 | + | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | + | -------- | ---- | ---- | ------ | --------- | + | selected | Date | 否 | 当前系统时间 | 设置选中项的时间。 | ## 属性 -| 名称 | 参数类型 | 默认值 | 描述 | -| -------- | -------- | -------- | -------- | +| 名称 | 参数类型 | 默认值 | 描述 | +| --------------- | ------- | ----- | --------------------- | | useMilitaryTime | boolean | false | 展示时间是否为24小时制,不支持动态修改。 | ## 事件 -| 名称 | 功能描述 | -| -------- | -------- | +| 名称 | 功能描述 | +| ---------------------------------------- | ----------- | | onChange(callback: (value: TimePickerResult ) => void) | 选择时间时触发该事件。 | ### TimePickerResult对象说明 -| 名称 | 参数类型 | 描述 | -| -------- | -------- | -------- | -| hour | number | 选中时间的时。 | +| 名称 | 参数类型 | 描述 | +| ------ | ------ | ------- | +| hour | number | 选中时间的时。 | | minute | number | 选中时间的分。 | diff --git a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-config-file.md b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-config-file.md deleted file mode 100644 index 82867f64408b16b9a82a1d43a786ace97e4f12fa..0000000000000000000000000000000000000000 --- a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-config-file.md +++ /dev/null @@ -1,91 +0,0 @@ -# 配置文件 - - -js标签中包含了实例名称、窗口样式和卡片页面信息。 - - -| 标签 | 类型 | 默认值 | 必填 | 描述 | -| ------ | ------ | ------- | ---- | --------------------------- | -| name | String | default | 是 | 标识JS实例的名字。 | -| pages | Array | - | 是 | 路由信息,详见“[pages](#pages)”。 | -| window | Object | - | 否 | 窗口信息,详见“[window](#window)”。 | - -> **说明:** -> name、pages、window等标签配置需在[配置文件]()中的“js”标签中完成设置。 - - -## pages - -定义卡片页面信息,由卡片页面路径和卡片页面名组成,卡片仅包含一个页面。比如: - - -``` -{ - ... - "src": "./js/widget/pages/index/index" //卡片仅包含一个页面 - ... -} -``` - - -> **说明:** -> - pages列表中仅包含一个页面。 -> -> - 页面文件名不能使用组件名称,比如:text.hml、button.hml等。 - - -## window - -window用于定义与显示窗口相关的配置。对于卡片尺寸适配问题,有2种配置方法,建议使用autoDesignWidth: - -- 指定卡片designWidth 150px(2×2),所有与大小相关的样式(例如width、font-size)均以designWidth和实际卡片宽度的比例进行缩放,例如在designWidth为150时,如果设置width为100px时,在卡片实际宽度为300物理像素时,width实际渲染像素为200物理像素。 - -- 设置autoDesignWidth为true,此时designWidth字段将会被忽略,渲染组件和布局时按屏幕密度进行缩放。屏幕逻辑宽度由设备宽度和屏幕密度自动计算得出,在不同设备上可能不同,请使用相对布局来适配多种设备。例如:在466\*466分辨率,320dpi的设备上,屏幕密度为2(以160dpi为基准),1px等于渲染出的2物理像素。 - > **说明:** - > - 组件样式中<length>类型的默认值,按屏幕密度进行计算和绘制,如:在屏幕密度为2(以160dpi为基准)的设备上,默认<length>为1px时,设备上实际渲染出2物理像素。 - > - > - autoDesignWidth、designWidth的设置不影响默认值计算方式和绘制结果。 - -| 属性 | 类型 | 必填 | 默认值 | 描述 | -| --------------- | ------- | ---- | ----- | ---------------------------------------- | -| designWidth | number | 否 | 150px | 页面显示设计时的参考值,实际显示效果基于设备宽度与参考值之间的比例进行缩放。 | -| autoDesignWidth | boolean | 否 | false | 页面设计基准宽度是否自动计算,当设为true时,designWidth将会被忽略,设计基准宽度由设备宽度与屏幕密度计算得出。 | - - 示例如下: - { - ... - "window": { - "autoDesignWidth": true - } - ... - } - - -## 示例 - - -```json -{ - "forms": [ - { - "name": "widget", - "description": "This is a service widget.", - "src": "./js/widget/pages/index/index", - "window": { - "designWidth": 720, - "autoDesignWidth": true - }, - "colorMode": "auto", - "isDefault": true, - "updateEnabled": true, - "scheduledUpdateTime": "10:30", - "updateDuration": 1, - "defaultDimension": "2*2", - "supportDimensions": [ - "1*2","2*2","2*4","4*4" - ], - "formConfigAbility": "ability://xxxxx" - } - ] -} -``` diff --git a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md index 6e7b373bfe3a5d1450c0b86dbc278ad60840336e..9025d3ad8df2f64ca271fd3dd690c14ca575860d 100644 --- a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md +++ b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md @@ -49,9 +49,15 @@ JS服务卡片(entry/src/main/js/Widget)的典型开发目录结构如下: > **说明:** > 当代码文件A需要引用代码文件B时: -> +> > - 如果代码文件A和文件B位于同一目录,则代码文件B引用资源文件时可使用相对路径,也可使用绝对路径。 -> +> > - 如果代码文件A和文件B位于不同目录,则代码文件B引用资源文件时必须使用绝对路径。因为Webpack打包时,代码文件B的目录会发生变化。 -> +> > - 在json文件中定义的数据为资源文件路径时,需使用绝对路径。 + +## 配置文件 + +FA卡片需要在应用配置文件config.json中进行配置。详细的配置内容请参考[FA卡片配置文件说明](../../ability/fa-formability.md#配置卡片配置文件)。 + +Stage卡片需要在应用配置文件module.json5中的extensionAbilities标签下,配置ExtensionAbility相关信息。详细的配置内容请参考[Stage卡片配置文件说明](../../ability/stage-formextension.md#配置卡片配置文件)。 \ No newline at end of file diff --git a/zh-cn/application-dev/ui/ui-ts-building-data-model.md b/zh-cn/application-dev/ui/ui-ts-building-data-model.md index 42eec7a17592f85aa1e10a746c80997f845b96fb..fe8843dd0050a63c369cfb2b4bb92c518b28e9a7 100644 --- a/zh-cn/application-dev/ui/ui-ts-building-data-model.md +++ b/zh-cn/application-dev/ui/ui-ts-building-data-model.md @@ -50,7 +50,15 @@ 3. 存入食物图片资源。在resources >base> media目录下存入食物图片资源,图片名称为食物名称。 -4. 创建食物资源数据。在model文件夹下创建FoodDataModels.ets,在该页面中声明食物成分数组FoodComposition。 +4. 创建食物资源数据。在model文件夹下创建FoodDataModels.ets,在该页面中声明食物成分数组FoodComposition。以下示例创建了两个食物数据。 + + ``` + const FoodComposition: any[] = [ + { 'name': 'Tomato', 'image': $r('app.media.Tomato'), 'category': Category.Vegetable, 'calories': 17, 'protein': 0.9, 'fat': 0.2, 'carbohydrates': 3.9, 'vitaminC': 17.8 }, + { 'name': 'Walnut', 'image': $r('app.media.Walnut'), 'category': Category.Nut, 'calories': 654 , 'protein': 15, 'fat': 65, 'carbohydrates': 14, 'vitaminC': 1.3 } + ] + ``` + 实际开发中,开发者可以自定义更多的数据资源,当食物资源很多时,建议使用数据懒加载LazyForEach。 5. 创建initializeOnStartUp方法来初始化FoodData的数组。在FoodDataModels.ets中使用了定义在FoodData.ets的FoodData和Category,所以要将FoodData.ets的FoodData类export,在FoodDataModels.ets内import FoodData和Category。