【每日学点鸿蒙知识】RichText展示问题、slider组件内置间距、WebView性能优化、AVSession错误

1、HarmonyOS RichText 展示问题?
复制代码
build() {
  Column() {
    Row({space:10}) {
      Column() {
        RichText(  this.item.title ?? "" )
          .width("100%")
          .height(80)

        Text(this.item.desc ?? "")
          .fontSize(12)
          .fontColor(0x9e9e9e)

      }
      .margin({left: 10})
      .layoutWeight(1)
      .alignItems(HorizontalAlign.Start)
      .justifyContent(FlexAlign.SpaceAround)
      .height('100%')

      Blank()

      Image(this.item.banner ?? "")
        .width(this.picWidth)
        .objectFit(ImageFit.Fill)
        .height( this.picWidth * 0.75 )
        .borderRadius(4)
    }
    .padding({left:20,right:20})
    .height( 20 + this.picWidth * 0.75 )
    .width("100%")

  }
}

RichText 传入内容, 显示的文字太小,RichText 组件还会滑动,如何能正常展示

RichText字体大小可以通过style设置 例如<p style="font-size: 35px;text-align: center;font-weight: bold; color: rgb(24,78,228)">字体大小35px,行高45px<p>移动设备的视口默认值大小为980px,默认值可以确保大部分网页在移动设备下可以正常浏览。如果RichText组件宽度低于这个值,content内部的HTML则可能会产生一个可以滑动的页面被RichText组件包裹。如果想替换默认值,可以在content中添加以下标签。

参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-richtext-V5#ZH-CN_TOPIC_0000001884757834

2、HarmonyOS 如何取消slider组件内置的左右间距?

Slider无默认padding。

当Slider为水平滑动条时,Slider默认高度为40vp,宽度为父容器的宽度,滑动条居中显示,左右间距为分别为10vp,若设置padding,padding不会覆盖左右间距。

当Slider为竖直滑动条时,Slider默认宽度为40vp,高度为父容器的高度,滑动条居中显示,上下间距为分别为6vp,若设置padding,padding不会覆盖上下间距。

不能取消slider组件内置的左右间距 滑块在两端的时候需要在组件内,所以必须留有间距

3、HarmonyOS 大量webview加载远程H5页面方案设计建议?

WebView中,双向交互可以使用JSBridge技术也可以使用端口通信技术,可参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/arkweb-api-V5

相关案列可参考:https://developer.huawei.com/consumer/cn/codelabsPortal/carddetails/tutorials_NEXT-SelectContact

4、HarmonyOS AVSession 创建成功后,通过 setAVMetadata 设置元数据,抛 401 错误码?

401报错为输入参数类型错误,请检查输入的参数类型是否传递有误 目前参数都是加了类型强校验的,如果没有值的话不要去设置对应的字段

5、HarmonyOS Webview页面加载前会有空白等待的阶段 怎么解决?

使用预加载,在预测到将要加载的页面之前调用,提前下载页面所需的资源,包括主资源子资源,但不会执行网页JavaScript代码或呈现网页,以加快加载速度。

详细参考预加载官方文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-webview-V5#prefetchpage10

或者参考如下web场景性能优化:https://developer.huawei.com/consumer/cn/doc/best-practices-V5/bpta-web-develop-optimization-V5

常见的优化方式。

  • Web页面加载优化:Web页面加载速度对于用户体验至关重要,提高页面加载的速度可以直接提升应用的流畅性。
  • JSBridge:通过JSBridge通信,可以解决ArkTS环境的冗余切换,避免造成UI阻塞。
  • 同层渲染:通过将页面元素分层渲染,可以减少页面重绘和重排的次数,提高页面渲染效率。

ArkWeb(方舟Web)为开发者提供了优化页面显示速度的方法。通过采取这些优化方式,开发者可以改善应用程序的性能和用户体验,使用户能够更快速、更流畅地浏览Web页面,从而提升用户满意度和留存率。

相关推荐
鸿蒙布道师几秒前
鸿蒙NEXT开发对象工具类(TS)
android·ios·华为·harmonyos·arkts·鸿蒙系统·huawei
zhang1062092 分钟前
HarmonyOS 基础组件和基础布局的介绍
harmonyos·基础组件·基础布局
桃子酱紫君3 分钟前
华为配置篇-BGP实验
开发语言·华为·php
庸俗今天不摸鱼14 分钟前
【万字总结】前端全方位性能优化指南(十)——自适应优化系统、遗传算法调参、Service Worker智能降级方案
前端·性能优化·webassembly
马剑威(威哥爱编程)15 分钟前
在HarmonyOS NEXT 开发中,如何指定一个号码,拉起系统拨号页面
华为·harmonyos·arkts
黄毛火烧雪下21 分钟前
React Context API 用于在组件树中共享全局状态
前端·javascript·react.js
Apifox32 分钟前
如何在 Apifox 中通过 CLI 运行包含云端数据库连接配置的测试场景
前端·后端·程序员
一张假钞35 分钟前
Firefox默认在新标签页打开收藏栏链接
前端·firefox
高达可以过山车不行35 分钟前
Firefox账号同步书签不一致(火狐浏览器书签同步不一致)
前端·firefox
m0_5937581036 分钟前
firefox 136.0.4版本离线安装MarkDown插件
前端·firefox