1# 悬浮态效果 2 3> **说明:** 4> 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 5 6 7## 权限列表 8 9无 10 11 12## 属性 13 14| 名称 | 参数类型 | 默认值 | 描述 | 15| -------- | -------- | -------- | -------- | 16| hoverEffect | [HoverEffect](ts-appendix-enums.md#hovereffect8) | HoverEffect.Auto | 设置当前组件悬停态下的悬浮效果。 | 17 18 19## 示例 20 21```ts 22// xxx.ets 23@Entry 24@Component 25struct HoverExample { 26 @State isHoverVal: boolean = false 27 28 build() { 29 Column({ space: 5 }) { 30 Column({ space: 5 }) { 31 Text('Scale').fontSize(20).fontColor(Color.Gray).width('90%').position({ x: 0, y: 80 }) 32 Column() 33 .width('80%').height(200).backgroundColor(Color.Gray) 34 .position({ x: 40, y: 120 }) 35 .hoverEffect(HoverEffect.Scale) 36 .onHover((isHover: boolean) => { 37 console.info('Scale isHover: ' + isHover) 38 this.isHoverVal = isHover 39 }) 40 41 Text('Board').fontSize(20).fontColor(Color.Gray).width('90%').position({ x: 0, y: 380 }) 42 Column() 43 .width('80%').height(200).backgroundColor(Color.Gray) 44 .hoverEffect(HoverEffect.Highlight) 45 .position({ x: 40, y: 420 }) 46 .onHover((isHover: boolean) => { 47 console.info('Highlight isHover: ' +isHover ) 48 this.isHoverVal = isHover 49 }) 50 } 51 .hoverEffect(HoverEffect.None) 52 .width('100%').height('100%').border({ width: 1 }) 53 .onHover((isHover: boolean) => { 54 console.info('HoverEffect.None') 55 this.isHoverVal = isHover 56 }) 57 } 58 } 59} 60``` 61