【每日学点鸿蒙知识】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页面,从而提升用户满意度和留存率。

相关推荐
hpoenixf17 分钟前
一天上线 + 零返工:我如何给复杂前端需求建立“安全感”
前端
小雨青年26 分钟前
鸿蒙 HarmonyOS 6 | PDFKit预览能力升级实战
华为·harmonyos
广州华水科技1 小时前
单北斗GNSS变形监测系统在水利工程安全保障中的应用与优势分析
前端
yqcoder1 小时前
CSS 外边距重叠(Margin Collapsing):现象、原理与完美解决方案
前端·css
花先锋队长2 小时前
鸿蒙6.1加持菜鸟App:地理围栏+实况窗,靠近驿站自动提醒,取件不再遗漏
华为·智能手机·harmonyos
nashane2 小时前
HarmonyOS 6学习:页面跳转弹窗状态保持全解析
学习·华为·harmonyos·harmonyos 5
山楂树の2 小时前
图像标注大坑:img图片 + Canvas 叠加标注,同步放大后标注位置偏移、对不齐?详解修复方案及亚像素处理原理
前端·css·学习·canva可画
本山德彪2 小时前
我做了一个拼豆图纸生成器,把照片秒变图纸
前端
maaath2 小时前
【maaath】Flutter for OpenHarmony 实战:电影榜单应用开发指南
flutter·华为·harmonyos
DTrader2 小时前
用TS无法实盘量化? - 实盘均线策略
前端·api