往期鸿蒙5.0全套实战文章必看:(文中附带鸿蒙5.0全栈学习资料)
Hyperlink
超链接组件,组件宽高范围内点击实现跳转。
说明
- 该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
- 该组件仅支持与系统浏览器配合使用。
需要权限
跳转的目标应用使用网络时,需要申请权限ohos.permission.INTERNET。
子组件
可以包含Image子组件。
接口
Hyperlink(address: string | Resource, content?: string | Resource)
元服务API: 从API version 11开始,该接口支持在元服务中使用。
系统能力: SystemCapability.ArkUI.ArkUI.Full
参数:
参数名 | 类型 | 必填 | 说明 |
---|---|---|---|
address | string | Resource | 是 | Hyperlink组件跳转的网页。 |
content | string | Resource | 否 | Hyperlink组件中超链接显示文本。 说明: 组件内有子组件时,不显示超链接文本。 |
属性
除支持通用属性外,还支持以下属性:
color
color(value: Color | number | string | Resource)
设置超链接文本的颜色。
元服务API: 从API version 11开始,该接口支持在元服务中使用。
系统能力: SystemCapability.ArkUI.ArkUI.Full
参数:
参数名 | 类型 | 必填 | 说明 |
---|---|---|---|
value | Color | number | string | Resource | 是 | 超链接文本的颜色。 默认值:'#ff007dff' warable设备上默认值为:'ff1f71ff' |
示例
该示例展示了超链接图片和文本跳转的效果。
@Entry
@Component
struct HyperlinkExample {
build() {
Column() {
Column() {
Hyperlink('https://example.com/') {
Image($r('app.media.bg'))
.width(200)
.height(100)
}
}
Column() {
Hyperlink('https://example.com/', 'Go to the developer website') {
}
.color(Color.Blue)
}
}.width('100%').height('100%').justifyContent(FlexAlign.Center)
}
}