话不多说,直接先上设计图:设计图是真的很好看鸭!但是实际上长传的图片很长,导致很模糊的状态,肯定不符合要求的。 还好小程序有个mode属性:
scaleToFill 缩放模式(默认属性),不保持纵横比缩放图片,使图片的宽高完全拉伸至填满 image 元素
aspectFit 缩放模式,保持纵横比缩放图片,使图片的长边能完全显示出来。也就是说,可以完整地将图片显示出来。
aspectFill 缩放模式,保持纵横比缩放图片,只保证图片的短边能完全显示出来。也就是说,图片通常只在水平或垂直方向是完整的,另一个方向将会发生截取。
当时使用image实现图像自使用的时候,设置mode=“aspectFill”
mode=“aspectFit”——示例: mode=“scaleToFill”——示例: mode=“aspectFill”——示例: