微信小程序图片等比例缩放

发布日期： 2018-06-23 阅读量： 作者： 网络

这篇文章主要介绍了微信小程序图片等比例缩放（图片自适应屏幕）的相关资料,需要的朋友可以参考下

微信小程序图片等比例缩放

早上在论坛上看到有人写了关于图片等比例缩放的文章,只是判断了图片宽是否大于屏幕宽.我之前在做Android的时候也会遇到图片等比例缩放的问题.应该是用图片宽高比和屏幕宽高比做判断.做个笔记.

老规矩,先上图.

1.图片高宽比小于屏幕高宽比

2.图片高宽比大于屏幕高宽比

3.这种其实也是图片高宽比小于屏幕高宽比,但是高宽都大于屏幕高宽.所以不能简单用高宽来判断,应该是用高宽比判断后做缩放.

上代码:

1.index.wxml

<!--index.wxml--> 
<!--图片宽大于屏幕宽--> 
<image></image> 
<!--图片高大于屏幕高--> 
<!--<image style="width: {{imagewidth}}px; height: {{imageheight}}px;" src="{{imagesecondsrc}}" bindload="imageLoad"></image>--> 
<!--图片宽高大于屏幕宽高--> 
<!--<image style="width: {{imagewidth}}px; height: {{imageheight}}px;" src="{{imagethirdsrc}}" bindload="imageLoad"></image>-->

# 微信小程序 # 图片等比例缩放 # 图片自适应 # 图片缩放

上一篇: shell编程实战之内存检查超过设定值杀死php-fpm进程

下一篇: shell编程实战之执行多个目录下的php程序

微信小程序 图片等比例缩放

随便看看

微信小程序图片等比例缩放