Android开发填坑之setUseWideViewPort

最新推荐文章于 2024-03-23 22:37:01 发布

喜欢踢足球的老罗

最新推荐文章于 2024-03-23 22:37:01 发布

阅读量1.4w

点赞数 3

CC 4.0 BY-SA版权

分类专栏： ANDROID

本文链接：https://blog.youkuaiyun.com/SCHOLAR_II/article/details/80614486

ANDROID 专栏收录该内容

37 篇文章

订阅专栏

本文探讨了项目中浏览器组件加载B站个人主页时出现的排版错乱现象，并通过对比不同浏览器发现该问题源于Webview配置不当。具体表现为未正确设置setUseWideViewPort参数导致<meta>标签的viewport属性失效。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

现象

项目中的“浏览器组件”（对Webview的封装，用于浏览网页）在加载bilibili个人主页(https://m.bilibili.com/space/26233856)时排版错乱。
效果如下图所示：
这里写图片描述
正常的效果如下图所示：（使用chrome UA换成Android的UA）

分析

使用对比法看看其它浏览器（Anroid chrome,手机自带浏览顺，UC浏览器）的效果，都正常
初步结论就是我们自己的问题了（打开的方式不对！！）
接着 排除法，先看看是不是UA的问题，把chrome的UA换成我们应用的UA，效果也正常。
那只能去看使用Webview的配置了
通过review代码找到了webview settings的配置代码

private void initBrowserFeature(){
       WebSettings webSettings = getSettings();
       webSettings.setLoadWithOverviewMode(true);
       webSettings.setUseWideViewPort(false);//这里需要设置为true，才能让Webivew支持<meta>标签的viewport属性
       ......

看看Android api 文档的说明 >> setUseWideViewPort
这里写图片描述