有这么一个需求,图片宽高固定,切掉溢出的高度。
父级view宽高固定,子级image固定宽度。
发现图片的高莫名被拉伸,百思不得其解的时候突然发现
image是有默认属性的,之前只知道有默认inline-block,才发现还有默认宽高,不设置高度。默认就会是这个240px。再次询问度娘后发现。
给image加一个属性 mode="",可选值如下
aspectFit:保持原图宽高比缩放图片,使图片的长边能完全显示出来。
aspectFill:保持原图宽高比缩放图片,使图片的短边能完全显示出来。
widthFix:宽度不变,高度自动变化,保持原图宽高比不变。
heightFix:高度不变,宽度自动变化,保持原图宽高比不变。
top:不缩放图片,只显示图片的顶部区域。
bottom:不缩放图片,只显示图片的底部区域。
center:不缩放图片,只显示图片的中间区域。
stretch:不缩放图片,并且会拉伸图片的宽度或高度到完全显示。
scaleToFill:不缩放图片,以图片的原始尺寸去覆盖容器。