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水平布局如何根据内容自适应高度
673浏览 • 1回复 待解决
Web组件如何实现嵌套滑动,如何实现web控件的自适应高度
2488浏览 • 1回复 待解决
Web组件如何实现高度自适应?
1028浏览 • 1回复 待解决
HarmonyOS RelativeContainer、List组件怎么实现自适应内容高度
728浏览 • 2回复 待解决
HarmonyOS web组件自适应高度问题
979浏览 • 1回复 待解决
HarmonyOS Web组件怎么和其它组件一起上下滑动?并且Web组件根据加载的url内容自适应高度?
253浏览 • 1回复 待解决
Scroll嵌套web,如何实现可以流畅的滑动,Web内容高度会变化
295浏览 • 1回复 待解决
HarmonyOS Web高度自适应问题
690浏览 • 1回复 待解决
HarmonyOS List嵌套Grid,Grid怎么自适应高度
675浏览 • 1回复 待解决
HarmonyOS webview嵌套在布局中间,高度和滚动问题
530浏览 • 1回复 待解决
HarmonyOS Tabs组件,TabContent的高度无法自适应内容组件高度
383浏览 • 1回复 待解决
RelativeContainer 里面嵌套子组件 text ,如何基于 text 的内容自适应高度?
342浏览 • 1回复 待解决
Grid组件如何实现高度自适应
3211浏览 • 1回复 待解决
HarmonyOS Web组件高度设置问题,Web组件内容被遮挡
442浏览 • 1回复 待解决
鸿蒙系统中的自适应布局设计如何实现?
152浏览 • 0回复 待解决
#鸿蒙通关秘籍#如何在布局中实现自适应拉伸?
48浏览 • 1回复 待解决
#鸿蒙通关秘籍#利用Scroll组件如何实现内容的自适应延伸?
37浏览 • 1回复 待解决
自适应缩放布局如何实现
453浏览 • 1回复 待解决
HarmonyOS 如何实现listItem高度随内容自适应
392浏览 • 1回复 待解决
HarmonyOS web嵌套到scroll里面之后获取的高度不对
507浏览 • 1回复 待解决
HarmonyOS Web组件和List的嵌套使用问题
226浏览 • 1回复 待解决
List、Scroll、Swipper 、web等嵌套使用滑动冲突问题
970浏览 • 1回复 待解决
HarmonyOS 自适应父组件高度问题
1027浏览 • 1回复 待解决
HarmonyOS Scroll内嵌Web组件时,如果不指定Web高度,web组件就会非常的高,不使用Scroll时则能正常展示
116浏览 • 1回复 待解决
设置list自适应内容撑起高度,会发现list超出父视图的问题
457浏览 • 1回复 待解决
在web和scroll上同时加上 .nestedScroll({scrollForward: NestedScrollMode.PARENT_FIRST,scrollBackward: NestedScrollMode.SELF_FIRST })
核心代码如下: