HarmonyOS Web组件嵌套在Scroll布局中或List布局中,如何实现Web组件高度根据内容自适应
Web组件嵌套在Scroll布局中或List布局中,如何实现Web组件(加载html代码)高度根据内容自适应,只有父组件滚动,Web自身不滚动。
页面布局如下:
Column(){
this.TopBar()//标题栏
this.Content()//内容区域,包含资讯标题、发布时间、资讯内容(Web)layoutWeight=1
this.BottomBar()//底部菜单操作按钮区域
}
其中内容区域布局:
@Builder
Content(){
Scroll(this.scrollerForScroll){
Column(){
Text('资讯标题')
.fontColor(Color.Black)
.fontSize('22fp')
.fontWeight(600)
.width('100%')
Text(`人民日报 2024-04-30`)
.fontColor(Color.Black)
.fontSize('14fp')
.fontWeight(400)
.width('100%')
.margin({top:'10vp'})
Web({ src:'www',controller:this.webController }) //高度需要根据内容自适应
.nestedScroll({
scrollForward:NestedScrollMode.SELF_FIRST,
scrollBackward:NestedScrollMode.SELF_FIRST
})
.layoutWeight(1)
.javaScriptAccess(true)
.domStorageAccess(true)
.fileAccess(true)
.defaultFontSize(this.webviewFontSize)
}
}
.width('100%')
.layoutWeight(1)
}
HarmonyOS
赞
收藏 0
回答 1
待解决
相关问题
List水平布局如何根据内容自适应高度
709浏览 • 1回复 待解决
HarmonyOS Scroll嵌套Web,Web内容高度自适应,整体页面一起滚动
70浏览 • 1回复 待解决
Web组件如何实现嵌套滑动,如何实现web控件的自适应高度
2530浏览 • 1回复 待解决
Web组件如何实现高度自适应?
1055浏览 • 1回复 待解决
HarmonyOS RelativeContainer、List组件怎么实现自适应内容高度
853浏览 • 2回复 待解决
HarmonyOS web的高度自适应内容的高度
76浏览 • 1回复 待解决
HarmonyOS web组件自适应高度问题
1023浏览 • 1回复 待解决
HarmonyOS Web组件怎么和其它组件一起上下滑动?并且Web组件根据加载的url内容自适应高度?
300浏览 • 1回复 待解决
HarmonyOS 网格布局是否可以自适应高度?根据数据的数量 自适应高度
42浏览 • 1回复 待解决
HarmonyOS Grid高度根据内容自适应
55浏览 • 1回复 待解决
Scroll嵌套web,如何实现可以流畅的滑动,Web内容高度会变化
312浏览 • 1回复 待解决
HarmonyOS Web高度自适应问题
764浏览 • 1回复 待解决
HarmonyOS Grid 组件如何根据子元素自适应高度?
62浏览 • 1回复 待解决
HarmonyOS List嵌套Grid,Grid怎么自适应高度
713浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何在布局中实现自适应拉伸?
108浏览 • 1回复 待解决
鸿蒙系统中的自适应布局设计如何实现?
217浏览 • 0回复 待解决
自适应缩放布局如何实现
488浏览 • 1回复 待解决
HarmonyOS webview嵌套在布局中间,高度和滚动问题
573浏览 • 1回复 待解决
RelativeContainer 里面嵌套子组件 text ,如何基于 text 的内容自适应高度?
385浏览 • 1回复 待解决
HarmonyOS Tabs组件,TabContent的高度无法自适应内容组件高度
421浏览 • 1回复 待解决
Grid组件如何实现高度自适应
3261浏览 • 1回复 待解决
#鸿蒙通关秘籍#利用Scroll组件如何实现内容的自适应延伸?
134浏览 • 1回复 待解决
HarmonyOS Web组件高度设置问题,Web组件内容被遮挡
553浏览 • 1回复 待解决
HarmonyOS 如何实现listItem高度随内容自适应
441浏览 • 1回复 待解决
HarmonyOS Web组件和List的嵌套使用问题
262浏览 • 1回复 待解决
在web和scroll上同时加上 .nestedScroll({scrollForward: NestedScrollMode.PARENT_FIRST,scrollBackward: NestedScrollMode.SELF_FIRST })
核心代码如下: