WxAutoImage
来源
微信小程序开发论坛
垂直微信小程序开发交流论坛
有话说
如果你已经看过一段时间的微信小程序后,你会发现,小程序中的图片虽然给了很多种mode,但是在你使用过程中,会出现很尴尬的问题。
比如: 图片很高,但是在显示的时候,只能看到小的缩略图,且如不指定宽高,则在默认渲染中,则宽高都为320,240.
在视觉设计上会有一定的麻烦。
在实际开发中,也有很多人问过我这个问题,今天说一下单图片的适配,多图片我目前还没有找到合适的处理方案,等有了再说。
通过image的bindload来计算自适应宽高
> 微信小程序中image暴漏的函数比较少,但是bindload十分有用。
官方说明: 当图片载入完毕时,发布到 AppService 的事件名,事件对象event.detail = {height:'图片高度px', width:'图片宽度px'}
⚠️: 这里的height:'图片高度px', width:'图片宽度px'都是原始宽高,这就给了我们可以计算的余地
思路
获取图片原始宽高
获取系统屏宽
以原始宽与系统屏宽对比大小,以大者为基准缩放
实现函数
2022-11-15 09:52:50
8KB
微信小程序
1