提交 9f8b7196 编写于 作者: H HelloCrease

update docs

Signed-off-by: NHelloCrease <lian15@huawei.com>
上级 13d4de5c
......@@ -382,6 +382,7 @@
- [console (控制台)](js-apis-logs.md)
- [Timer (定时器)](js-apis-timer.md)
- [syscap (系统能力)](js-apis-syscap.md)
- [@system.app (应用上下文)](js-apis-system-app.md)
- application
- [AccessibilityExtensionContext (辅助功能扩展上下文)](js-apis-inner-application-accessibilityExtensionContext.md)
......@@ -433,7 +434,7 @@
- [@ohos.account.appAccount (应用帐号管理)](js-apis-appAccount.md)
- [@ohos.account.distributedAccount (分布式帐号管理)](js-apis-distributed-account.md)
- [@ohos.account.osAccount (系统帐号管理)](js-apis-osAccount.md)
- 定制管理
- [@ohos.configPolicy (配置策略)](js-apis-configPolicy.md)
......@@ -504,7 +505,6 @@
- [@ohos.systemParameter (系统属性)](js-apis-system-parameter.md)
- [@ohos.systemTime (系统时间、时区)](js-apis-system-time.md)
- [@ohos.usb (USB管理)](js-apis-usb-deprecated.md)
- [@system.app (应用上下文)](js-apis-system-app.md)
- [@system.battery (电量信息)](js-apis-system-battery.md)
- [@system.bluetooth (蓝牙)](js-apis-system-bluetooth.md)
- [@system.brightness (屏幕亮度)](js-apis-system-brightness.md)
......
......@@ -254,20 +254,20 @@ struct WebComponent {
.onClick(() => {
// 使用本侧端口发送消息给HTML5
try {
console.log("In eTS side send true start");
console.log("In ArkTS side send true start");
if (this.nativePort) {
this.message.setString("helloFromEts");
this.nativePort.postMessageEventExt(this.message);
}
}
catch (error) {
console.log("In eTS side send message catch error:" + error.code + ", msg:" + error.message);
console.log("In ArkTS side send message catch error:" + error.code + ", msg:" + error.message);
}
})
Web({ src: $rawfile('index.html'), controller: this.controller })
.onPageEnd((e)=>{
console.log("In eTS side message onPageEnd init mesaage channel");
console.log("In ArkTS side message onPageEnd init mesaage channel");
// 1. 创建消息端口
this.ports = this.controller.createWebMessagePorts(true);
// 2. 发送端口1到HTML5
......@@ -276,10 +276,10 @@ struct WebComponent {
this.nativePort = this.ports[0];
// 4. 设置回调函数
this.nativePort.onMessageEventExt((result) => {
console.log("In eTS side got message");
console.log("In ArkTS side got message");
try {
var type = result.getType();
console.log("In eTS side getType:" + type);
console.log("In ArkTS side getType:" + type);
switch (type) {
case web_webview.WebMessageType.STRING: {
this.msg1 = "result type:" + typeof (result.getString());
......
......@@ -49,24 +49,24 @@ List(value?:{space?: number&nbsp;|&nbsp;string, initialIndex?: number, scroller?
除支持[通用属性](ts-universal-attributes-size.md)外,还支持以下属性:
| 名称 | 参数类型 | 描述 |
| ----------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| listDirection | [Axis](ts-appendix-enums.md#axis) | 设置List组件排列方向。<br/>默认值:Axis.Vertical<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| divider | {<br/>strokeWidth:&nbsp;[Length](ts-types.md#length),<br/>color?:[ResourceColor](ts-types.md#resourcecolor),<br/>startMargin?:&nbsp;Length,<br/>endMargin?:&nbsp;Length<br/>}&nbsp;\|&nbsp;null | 设置ListItem分割线样式,默认无分割线。<br/>- strokeWidth:&nbsp;分割线的线宽。<br/>- color:&nbsp;分割线的颜色。<br/>- startMargin:&nbsp;分割线与列表侧边起始端的距离。<br/>- endMargin:&nbsp;分割线与列表侧边结束端的距离。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>endMargin +startMargin 不能超过列宽度。 <br/>startMargin和endMargin不支持设置百分比。<br/>List的分割线画在主轴方向两个子组件之间,第一个子组件上方和最后一个子组件下方不会绘制分割线。<br/>多列模式下,ListItem与ListItem之间的分割线起始边距从每一列的交叉轴方向起始边开始计算,其他情况从List交叉轴方向起始边开始计算。 |
| scrollBar | [BarState](ts-appendix-enums.md#barstate) | 设置滚动条状态。<br/>默认值:BarState.Off<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:** <br/>API version 9及以下版本默认值为BarState.Off,API version 10的默认值为BarState.Auto。 |
| cachedCount | number | 设置列表中ListItem/ListItemGroup的预加载数量,只在[LazyForEach](../../quick-start/arkts-rendering-control-lazyforeach.md)中生效,其中ListItemGroup将作为一个整体进行计算,ListItemGroup中的所有ListItem会一次性全部加载出来。具体使用可参考[减少应用白块说明](../../ui/arkts-performance-improvement-recommendation.md#减少应用滑动白块)<br/>默认值:1<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:** <br/>单列模式下,会在List显示的ListItem前后各缓存cachedCount个ListItem。<br/>多列模式下, 会在List显示的ListItem前后各缓存cachedCount*列数个ListItem。 |
| editMode<sup>(deprecated)</sup> | boolean | 声明当前List组件是否处于可编辑模式。<br/>从API version9开始废弃。可参考[示例3](#示例3)实现删除选中的list项。<br/>默认值:false |
| edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | 设置组件的滑动效果,支持弹簧效果和阴影效果。<br/>默认值:EdgeEffect.Spring<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| chainAnimation | boolean | 设置当前List是否启用链式联动动效,开启后列表滑动以及顶部和底部拖拽时会有链式联动的效果。链式联动效果:List内的list-item间隔一定距离,在基本的滑动交互行为下,主动对象驱动从动对象进行联动,驱动效果遵循弹簧物理动效。<br/>默认值:false<br/>-&nbsp;false:不启用链式联动。<br/>-&nbsp;true:启用链式联动。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>链式动效生效后,List的分割线不显示。<br>链式动效生效需要满足以下前提条件:<br> -&nbsp; List边缘效果为Spring类型<br> -&nbsp; List没有启用多列模式 |
| chainAnimationOptions<sup>10+</sup> | [ChainAnimationOptions](#chainanimationoptions10对象说明) | 设置链式联动动效参数。<br>**系统API:** 此接口为系统接口。 |
| multiSelectable<sup>8+</sup> | boolean | 是否开启鼠标框选。<br/>默认值:false<br/>-&nbsp;false:关闭框选。<br/>-&nbsp;true:开启框选。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| lanes<sup>9+</sup> | number \| [LengthConstrain](ts-types.md#lengthconstrain),<br/>gutter<sup>10+</sup>?:[Dimension](ts-types.md#dimension) | 以列模式为例(listDirection为Axis.Vertical):<br/>lanes用于决定List组件在交叉轴方向按几列布局。<br/>默认值:1<br/>规则如下:<br/>-&nbsp;lanes为指定的数量时,根据指定的数量与List组件的交叉轴尺寸除以列数作为列的宽度。<br/>-&nbsp;lanes设置了{minLength,maxLength}时,根据List组件的宽度自适应决定lanes数量(即列数),保证缩放过程中lane的宽度符合{minLength,maxLength}的限制。其中,minLength条件会被优先满足,即优先保证符合ListItem的交叉轴尺寸符合最小限制。<br/>-&nbsp;lanes设置了{minLength,maxLength},如果父组件交叉轴方向尺寸约束为无穷大时,固定按一列排列,列宽度按显示区域内最大的ListItem计算<br/>-&nbsp;ListItemGroup在多列模式下也是独占一行,ListItemGroup中的ListItem按照List组件的lanes属性设置值来布局。<br/>-&nbsp;lanes设置了{minLength,maxLength}时,计算列数会按照ListItemGroup的交叉轴尺寸计算。当ListItemGroup交叉轴尺寸与List交叉轴尺寸不一致时ListItemGroup中的列数与List中的列数可能不一样。<br/>gutter为列间距,当列数大于1时生效。<br />默认值为 0<br/>该接口支持在ArkTS卡片中使用。 |
| alignListItem<sup>9+</sup> | [ListItemAlign](#listitemalign9枚举说明) | List交叉轴方向宽度大于ListItem交叉轴宽度 * lanes时,ListItem在List交叉轴方向的布局方式,默认为首部对齐。<br/>默认值:ListItemAlign.Start<br/>该接口支持在ArkTS卡片中使用。 |
| sticky<sup>9+</sup> | [StickyStyle](#stickystyle9枚举说明) | 配合[ListItemGroup](ts-container-listitemgroup.md)组件使用,设置ListItemGroup中header和footer是否要吸顶或吸底。<br/>默认值:StickyStyle.None<br/>该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>sticky属性可以设置为 StickyStyle.Header \| StickyStyle.Footer 以同时支持header吸顶和footer吸底。 |
| scrollSnapAlign<sup>10+</sup> | [ScrollSnapAlign](#scrollsnapalign10枚举说明) | 设置列表项滚动结束对齐效果。<br/>默认值:ScrollSnapAlign.NONE<br/>**说明:**<br/>只支持ListItem等高情况下,设置列表项滚动结束对齐效果。 |
| enableScrollInteraction<sup>10+</sup> | boolean | 设置是否支持滚动手势,当设置为false时,无法通过手指或者鼠标滚动,但不影响控制器的滚动接口。<br/>默认值:true |
| nestedScroll<sup>10+</sup> | [NestedScrollOptions](ts-container-scroll.md#nestedscrolloptions10对象说明) | 嵌套滚动选项。设置向前向后两个方向上的嵌套滚动模式,实现与父组件的滚动联动。 |
| friction<sup>10+</sup> | number \| [Resource](ts-types.md#resource) | 设置摩擦系数,手动划动滚动区域时生效,只对惯性滚动过程有影响,对惯性滚动过程中的链式效果有间接影响。<br/>默认值:非可穿戴设备为0.6,可穿戴设备为0.9<br/>**说明:** <br/>设置为小于等于0的值时,按默认值处理 |
| 名称 | 参数类型 | 描述 |
| ------------------------------------- | ---------------------------------------- | ---------------------------------------- |
| listDirection | [Axis](ts-appendix-enums.md#axis) | 设置List组件排列方向。<br/>默认值:Axis.Vertical<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| divider | {<br/>strokeWidth:&nbsp;[Length](ts-types.md#length),<br/>color?:[ResourceColor](ts-types.md#resourcecolor),<br/>startMargin?:&nbsp;Length,<br/>endMargin?:&nbsp;Length<br/>}&nbsp;\|&nbsp;null | 设置ListItem分割线样式,默认无分割线。<br/>- strokeWidth:&nbsp;分割线的线宽。<br/>- color:&nbsp;分割线的颜色。<br/>- startMargin:&nbsp;分割线与列表侧边起始端的距离。<br/>- endMargin:&nbsp;分割线与列表侧边结束端的距离。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>endMargin +startMargin 不能超过列宽度。 <br/>startMargin和endMargin不支持设置百分比。<br/>List的分割线画在主轴方向两个子组件之间,第一个子组件上方和最后一个子组件下方不会绘制分割线。<br/>多列模式下,ListItem与ListItem之间的分割线起始边距从每一列的交叉轴方向起始边开始计算,其他情况从List交叉轴方向起始边开始计算。 |
| scrollBar | [BarState](ts-appendix-enums.md#barstate) | 设置滚动条状态。<br/>默认值:BarState.Off<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:** <br/>API version 9及以下版本默认值为BarState.Off,API version 10的默认值为BarState.Auto。 |
| cachedCount | number | 设置列表中ListItem/ListItemGroup的预加载数量,只在[LazyForEach](../../quick-start/arkts-rendering-control-lazyforeach.md)中生效,其中ListItemGroup将作为一个整体进行计算,ListItemGroup中的所有ListItem会一次性全部加载出来。具体使用可参考[减少应用白块说明](../../ui/arkts-performance-improvement-recommendation.md#减少应用滑动白块)<br/>默认值:1<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:** <br/>单列模式下,会在List显示的ListItem前后各缓存cachedCount个ListItem。<br/>多列模式下, 会在List显示的ListItem前后各缓存cachedCount*列数个ListItem。 |
| editMode<sup>(deprecated)</sup> | boolean | 声明当前List组件是否处于可编辑模式。<br/>从API version9开始废弃。可参考[示例3](#示例3)实现删除选中的list项。<br/>默认值:false |
| edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | 设置组件的滑动效果,支持弹簧效果和阴影效果。<br/>默认值:EdgeEffect.Spring<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| chainAnimation | boolean | 设置当前List是否启用链式联动动效,开启后列表滑动以及顶部和底部拖拽时会有链式联动的效果。链式联动效果:List内的list-item间隔一定距离,在基本的滑动交互行为下,主动对象驱动从动对象进行联动,驱动效果遵循弹簧物理动效。<br/>默认值:false<br/>-&nbsp;false:不启用链式联动。<br/>-&nbsp;true:启用链式联动。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>链式动效生效后,List的分割线不显示。<br>链式动效生效需要满足以下前提条件:<br> -&nbsp; List边缘效果为Spring类型<br> -&nbsp; List没有启用多列模式 |
| chainAnimationOptions<sup>10+</sup> | [ChainAnimationOptions](#chainanimationoptions10对象说明) | 设置链式联动动效参数。<br>**系统API:** 此接口为系统接口。 |
| multiSelectable<sup>8+</sup> | boolean | 是否开启鼠标框选。<br/>默认值:false<br/>-&nbsp;false:关闭框选。<br/>-&nbsp;true:开启框选。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| lanes<sup>9+</sup> | number \| [LengthConstrain](ts-types.md#lengthconstrain),<br/>gutter<sup>10+</sup>?:[Dimension](ts-types.md#dimension) | 以列模式为例(listDirection为Axis.Vertical):<br/>lanes用于决定List组件在交叉轴方向按几列布局。<br/>默认值:1<br/>规则如下:<br/>-&nbsp;lanes为指定的数量时,根据指定的数量与List组件的交叉轴尺寸除以列数作为列的宽度。<br/>-&nbsp;lanes设置了{minLength,maxLength}时,根据List组件的宽度自适应决定lanes数量(即列数),保证缩放过程中lane的宽度符合{minLength,maxLength}的限制。其中,minLength条件会被优先满足,即优先保证符合ListItem的交叉轴尺寸符合最小限制。<br/>-&nbsp;lanes设置了{minLength,maxLength},如果父组件交叉轴方向尺寸约束为无穷大时,固定按一列排列,列宽度按显示区域内最大的ListItem计算<br/>-&nbsp;ListItemGroup在多列模式下也是独占一行,ListItemGroup中的ListItem按照List组件的lanes属性设置值来布局。<br/>-&nbsp;lanes设置了{minLength,maxLength}时,计算列数会按照ListItemGroup的交叉轴尺寸计算。当ListItemGroup交叉轴尺寸与List交叉轴尺寸不一致时ListItemGroup中的列数与List中的列数可能不一样。<br/>gutter为列间距,当列数大于1时生效。<br />默认值为 0<br/>该接口支持在ArkTS卡片中使用。 |
| alignListItem<sup>9+</sup> | [ListItemAlign](#listitemalign9枚举说明) | List交叉轴方向宽度大于ListItem交叉轴宽度 * lanes时,ListItem在List交叉轴方向的布局方式,默认为首部对齐。<br/>默认值:ListItemAlign.Start<br/>该接口支持在ArkTS卡片中使用。 |
| sticky<sup>9+</sup> | [StickyStyle](#stickystyle9枚举说明) | 配合[ListItemGroup](ts-container-listitemgroup.md)组件使用,设置ListItemGroup中header和footer是否要吸顶或吸底。<br/>默认值:StickyStyle.None<br/>该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>sticky属性可以设置为 StickyStyle.Header \| StickyStyle.Footer 以同时支持header吸顶和footer吸底。 |
| scrollSnapAlign<sup>10+</sup> | [ScrollSnapAlign](#scrollsnapalign10枚举说明) | 设置列表项滚动结束对齐效果。<br/>默认值:ScrollSnapAlign.NONE<br/>**说明:**<br/>只支持ListItem等高情况下,设置列表项滚动结束对齐效果。 |
| enableScrollInteraction<sup>10+</sup> | boolean | 设置是否支持滚动手势,当设置为false时,无法通过手指或者鼠标滚动,但不影响控制器的滚动接口。<br/>默认值:true |
| nestedScroll<sup>10+</sup> | [NestedScrollOptions](ts-container-scroll.md#nestedscrolloptions10对象说明) | 嵌套滚动选项。设置向前向后两个方向上的嵌套滚动模式,实现与父组件的滚动联动。 |
| friction<sup>10+</sup> | number \| [Resource](ts-types.md#resource) | 设置摩擦系数,手动划动滚动区域时生效,只对惯性滚动过程有影响,对惯性滚动过程中的链式效果有间接影响。<br/>默认值:非可穿戴设备为0.6,可穿戴设备为0.9<br/>**说明:** <br/>设置为小于等于0的值时,按默认值处理 |
## ListItemAlign<sup>9+</sup>枚举说明
......@@ -127,9 +127,9 @@ List(value?:{space?: number&nbsp;|&nbsp;string, initialIndex?: number, scroller?
只支持item等高场景限位,不等高场景可能存在不准确的情况。
| 名称 | 描述 |
| ------ | ------------------------------------------------------------ |
| NONE | 默认无项目滚动对齐效果。滚动结束列表项何时将无限制地停止。 |
| 名称 | 描述 |
| ------ | ---------------------------------------- |
| NONE | 默认无项目滚动对齐效果。滚动结束列表项何时将无限制地停止。 |
| START | 视图中的第一项将在列表的开头对齐。<br/>**说明:**<br/>当列表位移至末端,需要将末端的item完整显示,可能出现开头不对齐的情况。 |
| CENTER | 视图中的中间项将在列表中心对齐。<br/>**说明:**<br/>顶端和末尾的item都可以在列表中心对齐,列表显示可能露出空白,第一个或最后一个item会对齐到中间位置。 |
| END | 视图中的最后一项将在列表末尾对齐。<br/>**说明:**<br/>当列表位移至顶端,需要将顶端的item完整显示,可能出现末尾不对齐的情况。 |
......@@ -156,23 +156,23 @@ List(value?:{space?: number&nbsp;|&nbsp;string, initialIndex?: number, scroller?
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ------------------------------ |
| 名称 | 描述 |
| ------ | ---------------------------------------- |
| Idle | 空闲状态。使用控制器提供的方法控制滚动时触发,拖动滚动条滚动时触发。<br/>**说明:** <br/> 从API version 10开始,调整为滚动状态回归空闲时触发,控制器提供的无动画方法控制滚动时触发。 |
| Scroll | 滚动状态。使用手指拖动List滚动时触发。<br/>**说明:** <br/> 从API version 10开始,拖动滚动条滚动和滚动鼠标滚轮时也会触发。 |
| Scroll | 滚动状态。使用手指拖动List滚动时触发。<br/>**说明:** <br/> 从API version 10开始,拖动滚动条滚动和滚动鼠标滚轮时也会触发。 |
| Fling | 惯性滚动状态。快速划动松手后进行惯性滚动和划动到边缘回弹时触发。<br/>**说明:** <br/> 从API version 10开始,由动画控制的滚动都触发。包括快速划动松手后的惯性滚动,划动到边缘回弹的滚动,快速拖动内置滚动条松手后的惯性滚动,使用滚动控制器提供的带动画的方法控制的滚动。 |
ScrollState枚举变更如下。
| 场景 | API version 9及以下 |API version 10开始 |
| ------ | ------------------------------ |------------------------------ |
| 手指拖动滑动 | Scroll | Scroll |
| 惯性滚动 | Fling | Fling |
| 过界回弹 | Fling | Fling |
| 鼠标滚轮滚动 | Idle | Scroll |
| 拖动滚动条 | Idle | Scroll |
| 滚动控制器滚动(带动画) | Idle | Fling |
| 滚动控制器滚动(不带动画) | Idle | Idle |
| 场景 | API version 9及以下 | API version 10开始 |
| ------------- | ---------------- | ---------------- |
| 手指拖动滑动 | Scroll | Scroll |
| 惯性滚动 | Fling | Fling |
| 过界回弹 | Fling | Fling |
| 鼠标滚轮滚动 | Idle | Scroll |
| 拖动滚动条 | Idle | Scroll |
| 滚动控制器滚动(带动画) | Idle | Fling |
| 滚动控制器滚动(不带动画) | Idle | Idle |
> **说明:**
>
......@@ -286,7 +286,7 @@ struct ListLanesExample {
}
```
![list](figures/list1.gif)
![list](figures/list-alignListItem.gif)
### 示例3
......
......@@ -10,23 +10,23 @@
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| -------------------------------- | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ |
| blur | number | - | 为当前组件添加内容模糊效果,入参为模糊半径,模糊半径越大越模糊,为0时不模糊。<br/>取值范围:[0, +∞)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backdropBlur | number | - | 为当前组件添加背景模糊效果,入参为模糊半径,模糊半径越大越模糊,为0时不模糊。<br/>取值范围:[0, +∞)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| 名称 | 参数类型 | 默认值 | 描述 |
| -------------------------------- | ---------------------------------------- | ------ | ---------------------------------------- |
| blur | number | - | 为当前组件添加内容模糊效果,入参为模糊半径,模糊半径越大越模糊,为0时不模糊。<br/>取值范围:[0, +∞)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backdropBlur | number | - | 为当前组件添加背景模糊效果,入参为模糊半径,模糊半径越大越模糊,为0时不模糊。<br/>取值范围:[0, +∞)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| shadow | [ShadowOptions](#shadowoptions对象说明) \| [ShadowStyle](#shadowstyle10枚举说明)<sup>10+</sup> | - | 为当前组件添加阴影效果。<br/>入参类型为ShadowOptions时,可以指定模糊半径、阴影的颜色、X轴和Y轴的偏移量。<br/>入参类型为ShadowStyle时,可指定不同阴影样式。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用,ArkTS卡片上不支持参数为 [ShadowStyle](#shadowstyle10枚举说明)类型。 |
| grayscale | number | 0.0 | 为当前组件添加灰度效果。值定义为灰度转换的比例,入参1.0则完全转为灰度图像,入参则0.0图像无变化,入参在0.0和1.0之间时,效果呈线性变化。(百分比)<br/>取值范围:[0, 1]<br/>**说明:** <br/>设置小于0的值时,按值为0处理,设置大于1的值时,按值为1处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| brightness | number | 1.0 | 为当前组件添加高光效果,入参为高光比例,值为1时没有效果,小于1时亮度变暗,0为全黑,大于1时亮度增加,数值越大亮度越大。<br/>取值范围:[0, +∞)<br/>**说明:** <br/>设置小于0的值时,按值为0处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| saturate | number | 1.0 | 为当前组件添加饱和度效果,饱和度为颜色中的含色成分和消色成分(灰)的比例,入参为1时,显示原图像,大于1时含色成分越大,饱和度越大,小于1时消色成分越大,饱和度越小。(百分比)<br/>取值范围:[0, +∞)<br/>**说明:** <br/>设置小于0的值时,按值为0处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| contrast | number | 1.0 | 为当前组件添加对比度效果,入参为对比度的值。值为1时,显示原图,大于1时,值越大对比度越高,图像越清晰醒目,小于1时,值越小对比度越低,当对比度为0时,图像变为全灰。(百分比)<br/>取值范围:[0, +∞)<br/>**说明:** <br/>设置小于0的值时,按值为0处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| invert | number | 0 | 反转输入的图像。入参为图像反转的比例,值为1时完全反转,值为0则图像无变化。(百分比)<br/>取值范围:[0, 1]<br/>**说明:** <br/>设置小于0的值时,按值为0处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| sepia | number | 0 | 将图像转换为深褐色。入参为图像反转的比例,值为1则完全是深褐色的,值为0图像无变化。&nbsp;(百分比)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| hueRotate | number&nbsp;\|&nbsp;string | '0deg' | 色相旋转效果,输入参数为旋转角度。<br/>取值范围:(-∞, +∞)<br/>**说明:** <br/>色调旋转360度会显示原始颜色。先将色调旋转180 度,然后再旋转-180度会显示原始颜色。数据类型为number时,值为90和'90deg'效果一致。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| grayscale | number | 0.0 | 为当前组件添加灰度效果。值定义为灰度转换的比例,入参1.0则完全转为灰度图像,入参则0.0图像无变化,入参在0.0和1.0之间时,效果呈线性变化。(百分比)<br/>取值范围:[0, 1]<br/>**说明:** <br/>设置小于0的值时,按值为0处理,设置大于1的值时,按值为1处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| brightness | number | 1.0 | 为当前组件添加高光效果,入参为高光比例,值为1时没有效果,小于1时亮度变暗,0为全黑,大于1时亮度增加,数值越大亮度越大。<br/>取值范围:[0, +∞)<br/>**说明:** <br/>设置小于0的值时,按值为0处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| saturate | number | 1.0 | 为当前组件添加饱和度效果,饱和度为颜色中的含色成分和消色成分(灰)的比例,入参为1时,显示原图像,大于1时含色成分越大,饱和度越大,小于1时消色成分越大,饱和度越小。(百分比)<br/>取值范围:[0, +∞)<br/>**说明:** <br/>设置小于0的值时,按值为0处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| contrast | number | 1.0 | 为当前组件添加对比度效果,入参为对比度的值。值为1时,显示原图,大于1时,值越大对比度越高,图像越清晰醒目,小于1时,值越小对比度越低,当对比度为0时,图像变为全灰。(百分比)<br/>取值范围:[0, +∞)<br/>**说明:** <br/>设置小于0的值时,按值为0处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| invert | number | 0 | 反转输入的图像。入参为图像反转的比例,值为1时完全反转,值为0则图像无变化。(百分比)<br/>取值范围:[0, 1]<br/>**说明:** <br/>设置小于0的值时,按值为0处理。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| sepia | number | 0 | 将图像转换为深褐色。入参为图像反转的比例,值为1则完全是深褐色的,值为0图像无变化。&nbsp;(百分比)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| hueRotate | number&nbsp;\|&nbsp;string | '0deg' | 色相旋转效果,输入参数为旋转角度。<br/>取值范围:(-∞, +∞)<br/>**说明:** <br/>色调旋转360度会显示原始颜色。先将色调旋转180 度,然后再旋转-180度会显示原始颜色。数据类型为number时,值为90和'90deg'效果一致。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| colorBlend&nbsp;<sup>8+</sup> | [Color](ts-appendix-enums.md#color)&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 为当前组件添加颜色叠加效果,入参为叠加的颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| sphericalEffect<sup>10+</sup> | number | - | 设置组件的图像球面化程度。<br/>取值范围:[0,1]。<br/>**说明:**<br/>1. 如果value等于0则图像保持原样,如果value等于1则图像为完全球面化效果。在0和1之间,数值越大,则球面化程度越高。<br/>`value < 0 `或者` value > 1`为异常情况,`value < 0`按0处理,`value > 1`按1处理。<br/> 2. 如果组件的图像使用异步加载,则不支持球面效果。例如Image组件默认使用异步加载,如果要使用球面效果,就要设置`syncLoad``true`,但是这种做法不推荐。`backgroundImage`也是使用异步加载,所以如果设置了`backgroundImage`,不支持球面效果。<br/>3. 如果组件设置了阴影,不支持球面效果。<br>此接口为系统接口。 |
| lightUpEffect<sup>10+</sup> | number | - | 设置组件图像亮起程度。<br/>取值范围:[0,1]。<br/>如果value等于0则图像为全黑,如果value等于1则图像为全亮效果。0到1之间数值越大,表示图像亮度越高。`value < 0` 或者 `value > 1`为异常情况,`value < 0`按0处理,`value > 1`按1处理。 <br>此接口为系统接口。|
| pixelStretchEffect<sup>10+</sup> | [PixelStretchEffectOptions](ts-types.md#pixelstretcheffectoptions10) | - | 设置组件的图像边缘像素扩展距离。<br/>参数`options`包括上下左右四个方向的边缘像素扩展距离。<br/>**说明:**<br/>1. 如果距离为正值,表示向外扩展,放大原来图像大小。上下左右四个方向分别用边缘像素填充,填充的距离即为设置的边缘扩展的距离。<br/>2. 如果距离为负值,表示内缩,但是最终图像大小不变。<br/>内缩方式:<br/>图像根据`options`的设置缩小,缩小大小为四个方向边缘扩展距离的绝对值。<br/>图像用边缘像素扩展到原来大小。<br/>3. 对`options`的输入约束:<br/>上下左右四个方向的扩展统一为非正值或者非负值。即四个边同时向外扩或者内缩,方向一致。<br/>所有方向的输入均为百分比或者具体值,不支持百分比和具体值混用。<br/>所有异常情况下,显示为{0,0,0,0}效果,即跟原图保持一致。<br>此接口为系统接口。 |
| linearGradientBlur<sup>10+</sup> | <br/>value: number,<br/>{<br/>fractionStops:Array<FractionStop>,<br/>direction:[GradientDirection](ts-appendix-enums.md#gradientdirection)<br/>} <br/> | - | 为当前组件添加内容线性渐变模糊效果,<br/>-value为模糊半径,模糊半径越大越模糊,为0时不模糊。取值范围:[0, 60]<br/>线性梯度模糊包含两个部分fractionStops和direction<br/>-fractionStops数组中保存的每一个二元数组(取值0-1,小于0则为0,大于0则为1)表示[模糊程度, 模糊位置];模糊位置需严格递增,开发者传入的数据不符合规范会记录日志,渐变模糊数组中二元数组个数必须大于等于2,否则渐变模糊不生效 <br/> -direction为渐变模糊方向,默认值为[GradientDirection](ts-appendix-enums.md#gradientdirection).Bottom <br/>从API version 10开始,该接口支持在ArkTS卡片中使用。 |
| sphericalEffect<sup>10+</sup> | number | - | 设置组件的图像球面化程度。<br/>取值范围:[0,1]。<br/>**说明:**<br/>1. 如果value等于0则图像保持原样,如果value等于1则图像为完全球面化效果。在0和1之间,数值越大,则球面化程度越高。<br/>`value < 0 `或者` value > 1`为异常情况,`value < 0`按0处理,`value > 1`按1处理。<br/> 2. 如果组件的图像使用异步加载,则不支持球面效果。例如Image组件默认使用异步加载,如果要使用球面效果,就要设置`syncLoad``true`,但是这种做法不推荐。`backgroundImage`也是使用异步加载,所以如果设置了`backgroundImage`,不支持球面效果。<br/>3. 如果组件设置了阴影,不支持球面效果。<br>**系统接口:**此接口为系统接口。 |
| lightUpEffect<sup>10+</sup> | number | - | 设置组件图像亮起程度。<br/>取值范围:[0,1]。<br/>如果value等于0则图像为全黑,如果value等于1则图像为全亮效果。0到1之间数值越大,表示图像亮度越高。`value < 0` 或者 `value > 1`为异常情况,`value < 0`按0处理,`value > 1`按1处理。 <br>**系统接口:**此接口为系统接口。 |
| pixelStretchEffect<sup>10+</sup> | [PixelStretchEffectOptions](ts-types.md#pixelstretcheffectoptions10) | - | 设置组件的图像边缘像素扩展距离。<br/>参数`options`包括上下左右四个方向的边缘像素扩展距离。<br/>**说明:**<br/>1. 如果距离为正值,表示向外扩展,放大原来图像大小。上下左右四个方向分别用边缘像素填充,填充的距离即为设置的边缘扩展的距离。<br/>2. 如果距离为负值,表示内缩,但是最终图像大小不变。<br/>内缩方式:<br/>图像根据`options`的设置缩小,缩小大小为四个方向边缘扩展距离的绝对值。<br/>图像用边缘像素扩展到原来大小。<br/>3. 对`options`的输入约束:<br/>上下左右四个方向的扩展统一为非正值或者非负值。即四个边同时向外扩或者内缩,方向一致。<br/>所有方向的输入均为百分比或者具体值,不支持百分比和具体值混用。<br/>所有异常情况下,显示为{0,0,0,0}效果,即跟原图保持一致。<br>**系统接口:**此接口为系统接口。 |
| linearGradientBlur<sup>10+</sup> | <br/>value: number,<br/>{<br/>fractionStops:Array<FractionStop>,<br/>direction:[GradientDirection](ts-appendix-enums.md#gradientdirection)<br/>} <br/> | - | 为当前组件添加内容线性渐变模糊效果,<br/>-value为模糊半径,模糊半径越大越模糊,为0时不模糊。取值范围:[0, 60]<br/>线性梯度模糊包含两个部分fractionStops和direction<br/>-fractionStops数组中保存的每一个二元数组(取值0-1,小于0则为0,大于0则为1)表示[模糊程度, 模糊位置];模糊位置需严格递增,开发者传入的数据不符合规范会记录日志,渐变模糊数组中二元数组个数必须大于等于2,否则渐变模糊不生效 <br/> -direction为渐变模糊方向,默认值为[GradientDirection](ts-appendix-enums.md#gradientdirection).Bottom <br/>从API version 10开始,该接口支持在ArkTS卡片中使用。 |
## ShadowOptions对象说明
......@@ -34,23 +34,23 @@
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | --------------- |
| radius | number \| [Resource](ts-types.md#resource) | 是 | 阴影模糊半径。<br/>取值范围:[0, +∞)<br/>**说明:** <br/>设置小于0的值时,按值为0处理。 |
| color | [Color](ts-appendix-enums.md#color) \| string \| [Resource](ts-types.md#resource) | 否 | 阴影的颜色。<br/>默认为黑色。 |
| offsetX | number \| [Resource](ts-types.md#resource) | 否 | 阴影的X轴偏移量。<br/>默认为0。 |
| offsetY | number \| [Resource](ts-types.md#resource) | 否 | 阴影的Y轴偏移量。<br/>默认为0。 |
| 名称 | 类型 | 必填 | 说明 |
| ------- | ---------------------------------------- | ---- | ---------------------------------------- |
| radius | number \| [Resource](ts-types.md#resource) | 是 | 阴影模糊半径。<br/>取值范围:[0, +∞)<br/>**说明:** <br/>设置小于0的值时,按值为0处理。 |
| color | [Color](ts-appendix-enums.md#color) \| string \| [Resource](ts-types.md#resource) | 否 | 阴影的颜色。<br/>默认为黑色。 |
| offsetX | number \| [Resource](ts-types.md#resource) | 否 | 阴影的X轴偏移量。<br/>默认为0。 |
| offsetY | number \| [Resource](ts-types.md#resource) | 否 | 阴影的Y轴偏移量。<br/>默认为0。 |
## ShadowStyle<sup>10+</sup>枚举说明
| 名称 | 描述 |
| ------ | -------------------------------------- |
| OUTER_DEFAULT_XS | 超小阴影。 |
| OUTER_DEFAULT_SM | 小阴影。 |
| OUTER_DEFAULT_MD | 中阴影。 |
| OUTER_DEFAULT_LG | 大阴影。 |
| OUTER_FLOATING_SM | 浮动小阴影。 |
| OUTER_FLOATING_MD | 浮动中阴影。 |
| 名称 | 描述 |
| ----------------- | ------ |
| OUTER_DEFAULT_XS | 超小阴影。 |
| OUTER_DEFAULT_SM | 小阴影。 |
| OUTER_DEFAULT_MD | 中阴影。 |
| OUTER_DEFAULT_LG | 大阴影。 |
| OUTER_FLOATING_SM | 浮动小阴影。 |
| OUTER_FLOATING_MD | 浮动中阴影。 |
## 示例
......
......@@ -653,8 +653,6 @@ Badge({
3. 监听手指抬起事件,若此时移动达到最大值,则触发数据加载并显示刷新视图,加载完成后将此视图隐藏。
下拉刷新与上拉加载的具体实现可参考Codelab:[新闻数据加载](https://gitee.com/openharmony/codelabs/tree/master/NetworkManagement/NewsDataArkTS)。若开发者希望快速实现此功能,也可使用三方组件[PullToRefresh](https://gitee.com/openharmony-sig/PullToRefresh)
## 编辑列表
......@@ -846,4 +844,6 @@ List() {
- [List组件的使用之商品列表(ArkTS)(API9)](https://gitee.com/openharmony/codelabs/tree/master/ETSUI/List)
- [List组件的使用之设置项(ArkTS)(API9)](https://gitee.com/openharmony/codelabs/tree/master/ETSUI/List_HDC)
\ No newline at end of file
- [List组件的使用之设置项(ArkTS)(API9)](https://gitee.com/openharmony/codelabs/tree/master/ETSUI/List_HDC)
- [PullToRefresh](https://gitee.com/openharmony-sig/PullToRefresh)
\ No newline at end of file
......@@ -65,7 +65,7 @@ text是文本组件,用于呈现一段文本信息。具体用法请参考[tex
- 添加划线
设置text-decoration和text-decoration-colo属性为文本添加划线和划线颜色,text-decoration枚举值请参考 text自有样式。
设置text-decoration和text-decoration-color属性为文本添加划线和划线颜色,text-decoration枚举值请参考 text自有样式。
```html
<!-- xxx.hml -->
......
......@@ -1134,6 +1134,7 @@
- [console (控制台)](reference/apis/js-apis-logs.md)
- [Timer (定时器)](reference/apis/js-apis-timer.md)
- [syscap (系统能力)](reference/apis/js-apis-syscap.md)
- [@system.app (应用上下文)](reference/apis/js-apis-system-app.md)
- application
- [AccessibilityExtensionContext (辅助功能扩展上下文)](reference/apis/js-apis-inner-application-accessibilityExtensionContext.md)
- 设备管理
......@@ -1246,7 +1247,6 @@
- [@ohos.systemParameter (系统属性)](reference/apis/js-apis-system-parameter.md)
- [@ohos.systemTime (系统时间、时区)](reference/apis/js-apis-system-time.md)
- [@ohos.usb (USB管理)](reference/apis/js-apis-usb-deprecated.md)
- [@system.app (应用上下文)](reference/apis/js-apis-system-app.md)
- [@system.battery (电量信息)](reference/apis/js-apis-system-battery.md)
- [@system.bluetooth (蓝牙)](reference/apis/js-apis-system-bluetooth.md)
- [@system.brightness (屏幕亮度)](reference/apis/js-apis-system-brightness.md)
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册