【鸿蒙实战开发】HarmonyOS NEXT 使用预渲染实现Web页面瞬开效果实践

介绍

为了便于大家在使用本案例集时能够更详细的了解各个案例,本案例基于Web预渲染实现了案例介绍功能,即在大部分案例右上角的问号icon。

效果图预览

0030086000753188655.20240719183029.63450310411188028315940675224087.gif

使用说明

  1. 因为直接加载的线上README,因此本功能需联网使用
  2. 点击icon,即会弹出对应案例的README
  3. 返回或下拉bindSheet上方的dragBar可隐藏帮助页

案例适配说明

为确保案例正确显示其README,请确保entry模块的依赖中@ohos/xxx中的xxx与案例目录名相同

实现思路

  1. 使用Stack承载Navigation,从而使得icon能够在应用的各个案例(NavDestination承载)上显示。

    Stack() {
      Navigation(this.pageStack) {
      //...
      }
      // 帮助功能:在每个案例的右下角添加“帮助”功能
      HelperView()
    }
    
    
  2. 使用BindSheet+WebView加载仓上各模块README。

    build() {
      Image($r("app.media.help"))
        .bindSheet($$this.isShowReadMe, this.buildReadMeSheet(), {
          //...
      })
    
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值