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

!21153 添加hyperlink组件

Merge pull request !21153 from 田雨/master
......@@ -123,6 +123,7 @@
- [GridRow](ts-container-gridrow.md)
- [Grid](ts-container-grid.md)
- [GridItem](ts-container-griditem.md)
- [Hyperlink](ts-container-hyperlink.md)
- [List](ts-container-list.md)
- [ListItem](ts-container-listitem.md)
- [ListItemGroup](ts-container-listitemgroup.md)
......
......@@ -272,36 +272,51 @@
- [ScrollBar](ts-basic-components-scrollbar.md)
滚动条组件,用于配合可滚动组件使用,如List、Grid、Scroll等。
- [Badge](ts-container-badge.md)
可以附加在单个组件上用于信息标记的容器组件。
- [AlphabetIndexer](ts-container-alphabet-indexer.md)
可以与容器组件联动用于按逻辑结构快速定位容器显示区域的索引条组件。
- [Panel](ts-container-panel.md)
可滑动面板,提供一种轻量的内容展示窗口,方便在不同尺寸中切换。
- [Refresh](ts-container-refresh.md)
可以进行页面下拉操作并显示刷新动效的容器组件。
- [AbilityComponent](ts-container-ability-component.md)
独立显示Ability的容器组件。
- [RemoteWindow](ts-basic-components-remotewindow.md)
远程控制窗口组件,可以通过此组件控制应用窗口,提供启动退出过程中控件动画和应用窗口联动动画的能力。
- [FormComponent](ts-basic-components-formcomponent.md)
提供卡片组件,实现卡片的显示功能。
- [FormLink](ts-container-formlink.md)
提供静态卡片事件交互功能。
- [Hyperlink](ts-container-hyperlink.md)
超链接组件,组件宽高范围内点击实现跳转。
- [Menu](ts-basic-components-menu.md)
以垂直列表形式显示的菜单。
- [MenuItem](ts-basic-components-menuitem.md)
用来展示菜单Menu中具体的item菜单项。
- [MenuItemGroup](ts-basic-components-menuitemgroup.md)
用来展示菜单MenuItem的分组。
# Hyperlink
超链接组件,组件宽高范围内点击实现跳转。
> **说明:**
>
> - 该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
> - 该组件仅支持与系统浏览器配合使用。
## 需要权限
使用网络时,需要申请权限ohos.permission.INTERNET。具体申请方式请参考[权限申请声明](../../security/accesstoken-guidelines.md)
## 子组件
可以包含子组件。
## 接口
Hyperlink(address: string | Resource, content?: string | Resource)
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- |
| address | string \| [Resource](ts-types.md#resource) | 是 | Hyperlink组件跳转的网页。 |
| content | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 否 | Hyperlink组件中超链接显示文本。<br/>**说明:** <br/>组件内有子组件时,不显示超链接文本。 |
## 属性
仅支持以下属性:
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置超链接文本的颜色。 |
## 示例
```ts
@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)
}
}
```
![hyperlink](figures/hyperlink.PNG)
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册