• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# 显隐控制
2
3控制组件是否可见。
4
5>  **说明：**
6>
7> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
8
9## 属性
10
11| 名称         | 参数类型                        | 描述                                         |
12| ---------- | ---------------------------- | ------------------------------------------ |
13| visibility | [Visibility](ts-appendix-enums.md#visibility) | 控制当前组件显示或隐藏。注意，即使组件处于隐藏状态，在页面刷新时仍存在重新创建过程，因此当对性能有严格要求时建议使用[条件渲染](../../quick-start/arkts-rendering-control-ifelse.md)代替。<br>默认值：Visibility.Visible<br/>从API version 9开始，该接口支持在ArkTS卡片中使用。 |
14
15
16## 示例
17
18```ts
19// xxx.ets
20@Entry
21@Component
22struct VisibilityExample {
23  build() {
24    Column() {
25      Column() {
26        // 隐藏不参与占位
27        Text('None').fontSize(9).width('90%').fontColor(0xCCCCCC)
28        Row().visibility(Visibility.None).width('90%').height(80).backgroundColor(0xAFEEEE)
29
30        // 隐藏参与占位
31        Text('Hidden').fontSize(9).width('90%').fontColor(0xCCCCCC)
32        Row().visibility(Visibility.Hidden).width('90%').height(80).backgroundColor(0xAFEEEE)
33
34        // 正常显示，组件默认的显示模式
35        Text('Visible').fontSize(9).width('90%').fontColor(0xCCCCCC)
36        Row().visibility(Visibility.Visible).width('90%').height(80).backgroundColor(0xAFEEEE)
37      }.width('90%').border({ width: 1 })
38    }.width('100%').margin({ top: 5 })
39  }
40}
41```
42
43![visibility.png](figures/visibility.png)
44