Android WebView 踩坑日记，字体怎么突然变小了？，分享一些行业经验
带着这个疑问，我再次去浏览代码，发现个性签名里面 Webview 加载的网页，是自己拼接的 html。debug 之后，发现网页代码大概是这样的
<span style="word-wrap:break-word;font-family:system-ui;font-size:16px;color:#888888;">Https://www.baidu.com</span>
可以看到里面字体的单位是 px，跟 Android 的 dp px 有点像，是不是没作屏幕适配？
搜索发现 Web 网页的代码适配单位是 rem，有点类似于 dp。
Web 网页在适配分辨率的时候，通常会设置 viewport 属性
于是我尝试在代码里面加了这样的代码，发现 SignatureWebView 显示个性签名又正常了。
parsedHtml += "<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">";
Web 网页字体的适配规则，这里就不班门弄斧了,有兴趣的可以自行搜索。
我们知道，加载自定义 html，通常需要调用 loadDataWithBaseURL 方法，查看端内调用的地方，发现其他都是正常的。只有这个奇葩 SignatureWebView ，自己拼接的 html 没有加 viewport 属性，进行适配
================================================================
如果 html 是自己拼接的，并且像素是 px，不要设置 WebViewSetting 的
setLoadWithOverviewMode，setUseWideViewPort（默认属性是 false），否则字体可能显示不正常，偏大或者偏小如果 html 是自己拼接的，并且像素是 px，当我们设置 WebViewSetting 的
setLoadWithOverviewMode，setUseWideViewPort 为 true（根据屏幕自适应），那么我们需要设置 html 的viewport规则，否则可能显示不正常html 如果是自己拼接的，需要注意适配规则，像个人签名这种，用 webView 承载自己拼接的 html ，防止踩坑
==============================================================================
出现
《Android 学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》
【docs.qq.com/doc/DSkNLaERkbnFoS0ZF】 完整内容开源分享
这个问题的原因是
默认浏览器中的内容是不受系统字体大小设置控制的，至少我遇到的几台手机都是这样的情况。
某些机型 WebView 字体的大小是受手机系统字体大小控制的
问题解决方案来自这篇文章：blog.csdn.net/FungLeo/art…
这个通常有两种解决方案。
Web js 网页解决方案
一般，我们动态计算好 html 的 font-size 之后，我们就啥都不干了，就走了。
但是，我们现在知道了，我们设置的大小不一定是真实的大小，所以，我们需要在设置完字体大小之后，再去重新获取一下 html 的 font-size，看看实际的这个值，和我们设置的是不是一样。
如果不一样，就要根据比例再设置一次。
function htmlFontSize(){
var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
var width = w > h ? h : w;
width = width > 720 ? 720 : width
var fz = ~~(width*100000/36)/10000
document.getElementsByTagName("html")[0].style.cssText = 'font-size: ' + fz +"px";
var realfz = ~~(+window.getComputedStyle(document.getElementsByTagName("html")[0]).fontSize.replace('px','')*10000)/10000
if (fz !== realfz) {
document.getElementsByTagName("html")[0].style.cssText = 'font-size: ' + fz * (fz / realfz) +"px";
}
}
客户端 WebView 禁止缩放
Android WebView 是可以通过 WebSettings 禁止网页字体缩放的，可以通过 setTextZoom 方法解决
webview.getSettings().setTextZoom(100)
可以禁止缩放，按照百分百显示。
================================================================
这篇文章主要是记录 bug 的一个解决过程，技术含量不高，但是有一定的参考价值。尤其是 bug 的解决思路。
线上突然出现问题，一直找不出问题，尝试一下二分法，逐步缩小范围。
有时候，我们找到解决方案，却不一定知道原因是什么，这时候，可以多问一下自己，背后的原因是什么？在排查的过程中，我们会逐渐培养自己的一套问题解决思路，听起来很虚，但是确实存在的。
知道原因之后，我们可以继续再进一步排查一下，项目中其他模块是不是也存在这样的问题。
以后要怎么规避之类问题？写个 wiki 或者博客记录一下
这几篇文章从 0 到 1，讲解 DAG 有向无环图是怎么实现的，以及在 Android 启动优化的应用。
推荐理由：启动优化动不动就聊拓扑结构，这篇文章从数据结构到算法到设计都给大家说清楚了，开源项目也有非常强的借鉴意义。
Android 启动优化（二） - 拓扑排序的原理以及解题思路
Android 启动优化（三）- AnchorTask 开源了
写在最后
由于本文罗列的知识点是根据我自身总结出来的，并且由于本人水平有限，无法全部提及，欢迎大神们能补充~
将来我会对上面的知识点一个一个深入学习，也希望有童鞋跟我一起学习，一起进阶。
提升架构认知不是一蹴而就的，它离不开刻意学习和思考。
**这里，笔者分享一份从架构哲学的层面来剖析的视频及资料分享给大家，**梳理了多年的架构经验，筹备近 1 个月最新录制的，相信这份视频能给你带来不一样的启发、收获。
最近还在整理并复习一些 Android 基础知识点，有问题希望大家够指出，谢谢。
希望读到这的您能转发分享和关注一下我，以后还会更新技术干货，谢谢您的支持！
转发+点赞+关注，第一时间获取最新知识点
Android 架构师之路很漫长，一起共勉吧！
还未添加个人签名 2021.03.19 加入
还未添加个人简介
评论