未验证 提交 e0c07bb6 编写于 作者: O openharmony_ci 提交者: Gitee

!20773 增加通用属性background规格说明

Merge pull request !20773 from zhangDH/background
......@@ -24,7 +24,7 @@ LoadingProgress()
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置加载进度条前景色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置加载进度条前景色。<br/>默认值:'#99666666'。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| enableLoading<sup>10+</sup> | boolean | 设置LoadingProgress动画显示或者不显示。<br/>默认值:true。<br/>**说明:**<br/> LoadingProgress动画不显示时,该组件依旧占位。<br/>通用属性Visibility.Hidden隐藏的是包括border、padding等整个组件范围,而enableLoading=false只隐藏LoadingProgress本身动画内容,不包括border等。|
## 示例
......
......@@ -10,6 +10,7 @@
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| background<sup>10+</sup> | builder: [CustomBuilder](ts-types.md#custombuilder8),<br>options?: {align?:[Alignment](ts-appendix-enums.md#alignment)} | builder:自定义背景。<br/>align:设置自定义背景与组件的对齐方式。<br/>同时设置了background,backgroundColor,backgroundImage时,叠加显示,background在最上层。 |
| backgroundColor | [ResourceColor](ts-types.md#resourcecolor) | 设置组件的背景色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundImage | src:&nbsp;[ResourceStr](ts-types.md#resourcestr),<br/>repeat?:&nbsp;[ImageRepeat](ts-appendix-enums.md#imagerepeat) | src:图片地址,支持网络图片资源地址和本地图片资源地址和Base64,不支持svg类型的图片。<br/>repeat:设置背景图片的重复样式,默认不重复。当设置的背景图片为透明底色图片,且同时设置了backgroundColor时,二者叠加显示,背景颜色在最底部。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundImageSize | {<br/>width?:&nbsp;[Length](ts-types.md#length),<br/>height?:&nbsp;[Length](ts-types.md#length)<br/>}&nbsp;\|&nbsp;[ImageSize](ts-appendix-enums.md#imagesize) | 设置背景图像的高度和宽度。当输入为{width:&nbsp;Length,&nbsp;height:&nbsp;Length}对象时,如果只设置一个属性,则第二个属性保持图片原始宽高比进行调整。默认保持原图的比例不变。<br/>width和height取值范围: [0, +∞)<br/>默认值:ImageSize.Auto<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:** <br/>设置为小于0的值时,按值为0显示。当设置了height未设置width时,width根据图片原始宽高比进行调整。 |
......@@ -122,3 +123,35 @@ struct BackgroundBlurStyleDemo {
```
![zh-cn_image_background_blur_style](figures/zh-cn_image_background_blur_style.png)
### 示例3
```ts
// xxx.ets
@Entry
@Component
struct BackgroundExample {
@Builder renderBackground() {
Column() {
Progress({value : 50})
}
}
build() {
Column() {
Text("content")
.width(100)
.height(40)
.fontColor("#FFF")
.position({x:50, y:80})
.textAlign(TextAlign.Center)
.backgroundColor(Color.Green)
}
.width(200).height(200)
.background(this.renderBackground)
.backgroundColor(Color.Gray)
}
}
```
![zh-cn_image_background](figures/zh-cn_image_background.png)
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册