HarmonyOS 如何在文本里添加超链接支持点击跳转

HarmonyOS
2天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
aquaa

超链接跳转的能力Text目前没有相关的规划, 当前是通过给组件中添加onclick的方式打开web的方式来实现场景,隐私政策和用户服务协议等这类可点击的文本,可以使用Span组件实现,配合onClick点击事件可以实现精确点击。参考文本显示文档(Text/Span):https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-common-components-text-display-V5

参考示例:

//Index.ets
import { router } from '@kit.ArkUI';

@Entry
@Component
struct Index {
  build() {
    Column() {
      Text() {
        Span('一套代码工程,一次开发上架,多端按需部署,为用户呈现多设备统一且卓越的使用体验。\n'
          + ' HarmonyOS NEXT 多设备设计指南与重点特性规范,为您提供面向垂类场景、全端侧的针对性设计建议.\n'
          + ' 并有简单易用的控件助力您打造高端精致的 HarmonyOS NEXT 应用新体验,与您共同构建一个和谐的数字世界。')
        Span('《基金隐私政策》')
          .fontColor(Color.Blue).fontSize(16)
          .onClick(() => {
            //跳转到web页面,或打开弹窗之类的操作
            router.pushUrl({
              url: 'pages/webPage'
            })
          })
        Span('了解详细信息。\n'
          + ' 如您同意,请点击“同意”开始接受我们的服务。')
      }
      .opacity(0.7)
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
  }
}
//WebPage.ets
import { webview } from '@kit.ArkWeb';

@Entry
@Component
struct WebPage {
  webController: webview.WebviewController = new webview.WebviewController();

  build() {
    Column() {
      Web({ src: 'http://xxx', controller: this.webController })
        .width('100%')
        .height('100%')
    }
    .width('100%')
    .height('100%')
  }
}
分享
微博
QQ
微信
回复
2天前
相关问题
鸿蒙-富文本如何添加图片
7412浏览 • 1回复 待解决
HarmonyOS文本点击事件
730浏览 • 1回复 待解决
如何实现图片点击跳转?
5689浏览 • 1回复 待解决
HarmonyOS点击文本实现问题
107浏览 • 1回复 待解决
文本添加上划线如何实现?
554浏览 • 1回复 待解决
HarmonyOS 方法点击跳转问题
297浏览 • 1回复 待解决
HarmonyOS 如何支持表情和富文本
853浏览 • 2回复 待解决