rn 的 Image组件 在ios 选染图片模糊问题处理:
问题起因:
ios 渲染图片模糊,安卓没有,找了半天原因,一直以为是上传图片的尺寸问题,然后不停加大上传cdn的图片尺寸
发现从 220x710 图片尺寸加大到 880x2840 , 图片依旧是模糊的,于是排查可能是ios在渲染图片的过程中,
图片尺寸不是整数,而是带有小数点,会导致图片在渲染的过程中出现问题,精密度不对导致渲染模糊
这个原因的猜想是h5在内嵌ios app的时候发现的,在h5端有一个属性image-rendering: -webkit-optimize-contrast;可以解决图片渲染尺寸不够精密,有小数点的问题,但是rn那边可没有这个css的属性
那怎么办呢,各种固定尺寸,放大尺寸缩放处理等都试过了,没法解决,
解决方案:
最终怎么解决的呢,当时想到到rn除了 有 Image 组件可以渲染图片,还有一个ImageBackground组件可以渲染图片
于是就用这个背景图渲染组件试了下,发现不模糊了,我不知道是不是 ImageBackground 和Image组件两个图片的底层渲染机制不同导致的还是什么原因
有大佬知道这两个组件的区别的话请不吝赐教