• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# 透明度设置
2
3设置组件的透明度。
4
5>  **说明:**
6>
7>  从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
8
9
10## 属性
11
12
13| 名称      | 参数类型                                     | 描述                                       |
14| ------- | ---------------------------------------- | ---------------------------------------- |
15| opacity | number&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 元素的不透明度,取值范围为0到1,1表示不透明,0表示完全透明, 达到隐藏组件效果,但是在布局中占位。<br>**说明:**<br/>子组件可以继承父组件的此属性。默认值:1<br>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
16
17
18## 示例
19
20```ts
21// xxx.ets
22@Entry
23@Component
24struct OpacityExample {
25  build() {
26    Column({ space: 5 }) {
27      Text('opacity(1)').fontSize(9).width('90%').fontColor(0xCCCCCC)
28      Text().width('90%').height(50).opacity(1).backgroundColor(0xAFEEEE)
29      Text('opacity(0.7)').fontSize(9).width('90%').fontColor(0xCCCCCC)
30      Text().width('90%').height(50).opacity(0.7).backgroundColor(0xAFEEEE)
31      Text('opacity(0.4)').fontSize(9).width('90%').fontColor(0xCCCCCC)
32      Text().width('90%').height(50).opacity(0.4).backgroundColor(0xAFEEEE)
33      Text('opacity(0.1)').fontSize(9).width('90%').fontColor(0xCCCCCC)
34      Text().width('90%').height(50).opacity(0.1).backgroundColor(0xAFEEEE)
35      Text('opacity(0)').fontSize(9).width('90%').fontColor(0xCCCCCC)
36      Text().width('90%').height(50).opacity(0).backgroundColor(0xAFEEEE)
37    }
38    .width('100%')
39    .padding({ top: 5 })
40  }
41}
42```
43
44![opacity.png](figures/opacity.png)
45