android webview 字体系统字体大小,Android 系统字体大小动态改变，导致webview中显示不兼容的问题解决...

唠叨几句：

在移动端再开发的过程中，很容易使用到webview,它也是用来混合开发的中间桥梁，因此解决webview使用过程中出现的问题是非常有必要的；

问题现象与发现：

现象：

日前，在是使用webview加载html过程中出现了一个这样的问题：

页面显示变形；

url中有设置图片，图片展示不全呈截断式；

发现：

其他所有手机都正常，只有一部手机显示不正常(上级的手机,哎)；

后来发现该手机比同款同型号手机显示字体略大，才发现该手机系统字体大小被重置；

经过半天测试，出现此问题的必要条件有三：

html页面采用了rem单位，并且是采用js动态计算html的font-size

html页面被加在了APP中的webview中

手机被重设了字体大小

解决方案：

一.移动端解决方案

一行代码：

webView.getSettings().setTextZoom(100);

方案一虽然看起来比较简单，但是如果我们项目已经上线了，就需要重新发版App，就需要更新等一系列操作；再者如果html其他移动端也有使用，这....接下来会发生的事情就靠大家慢慢猜想了！

二、前段兼容，

话不多说直接上代码：

var docEl = document.documentElement,

resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',

recalc = function () {

var clientWidth = docEl.clientWidth || 375;

clientWidth > 750 ? clientWidth = 750 : clientWidth = clientWidth;

if (clientWidth){

const fz = docEl.style.fontSize = 20 * (clientWidth / 375);

docEl.style.fontSize = 20 * (clientWidth / 375) + 'px';

window.remscale = clientWidth / 375;

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";

}

};

if (document.addEventListener){

window.addEventListener(resizeEvt, recalc, false);

document.addEventListener('DOMContentLoaded', recalc, false);

}

这段代码，是跟前端开发一起调试验证OK的

在此，感谢前端同学

嘿嘿，咱是移动端开发者，看到这个代码有些蒙蔽，前端开发者一定看得懂...

以上就是解决方式了，希望对您有所帮助...

android webview 字体系统字体大小,Android 系统字体大小动态改变，导致webview中显示不兼容的问题解决...相关推荐

安装python系统找不到指定的路径_解决安装过程中显示“系统找不到指定的路径”-百度经验...
解决软件安装过程中显示"系统找不到指定的路径"?有些用户在变声专家一半时候弹出"无法打开....系统找不到指定的路径"字样,解决方法非常简单,如遇上述问题的小伙 ...
android string.format()长度,Android通过String.format格式化（动态改变）字符串资源的显示内容...
一.实现效果: 最近在项目中需要做类似于上图显示的效果,里面的数字和称谓是动态获取的,对于这种显示效果,有如下两种解决方案来处理: (1)通过代码动态设置TextView的内容,比如: /** * 显 ...
oracle改字体大小_sqlplus改字体
sqlplus_font,其值为"terminal". sqlplus_font_size,其值为14,或其他大小的值,如16.18等. 问题3 在SQL*Plus中改变字体和字符 ...
android开发点击展开列表,android - listView点击展开收起实现
废话不多说, 上图: GIF.gif 上思路: 动态改变数据适配器中的getCount()方法的返回值; 点击刷新适配器中的数据; 注意: 1.这是在普通的布局中实现; 2.如需要在ScrollVie ...
Android 动态改变桌面图标
其实很简单,利用 AndroidManifest.xml 文件中的 <activity-alias> 标签即可实现. <activity-alias> 介绍大家知道,对于 A ...
android 设置字体大小不随系统大小变化,App字体大小不随系统改变而改变
在 "设置" , "显示" , "字体大小" 里面我们可以设置系统字体大小 App界面字体,如果被修改之后,可能就达不到理想状态的效果,界面 ...
android 禁止跟随系统字体,Android 应用全局字体调节或禁止随系统字体大小更改...
1.禁止跟随系统字体大小调节在Application中复写getResources()方法 @Override public Resources getResources() {//还原字体大小 R ...
Android禁止app字体大小跟随系统字体大小调节
Android禁止app字体大小跟随系统字体大小调节针对字体不随系统应用改变而改变,不然会导致原来的一些布局变化,在Application中重写getResources() @Overridepub ...
Android 解决系统字体变大导致WebView页面显示错乱问题
在WebView开发过程中,当用户手动修改系统字体变大时,部分手机会出现WebView页面错乱问题. 为了解决这个问题,需要对WebView进行一个设置.在页面加载之前加上一下代码: webview. ...

android webview 字体系统字体大小,Android 系统字体大小动态改变，导致webview中显示不兼容的问题解决...

android webview 字体系统字体大小,Android 系统字体大小动态改变，导致webview中显示不兼容的问题解决...相关推荐

最新文章

热门文章

android webview 字体 系统字体大小,Android 系统字体大小动态改变，导致webview中显示不兼容的问题解决...

android webview 字体 系统字体大小,Android 系统字体大小动态改变，导致webview中显示不兼容的问题解决...相关推荐

最新文章

热门文章

android webview 字体系统字体大小,Android 系统字体大小动态改变，导致webview中显示不兼容的问题解决...

android webview 字体系统字体大小,Android 系统字体大小动态改变，导致webview中显示不兼容的问题解决...相关推荐