iOS不同宽高比图片的填充适配—imageView中的图片左右两

2021-03-05  本文已影响0人  ___F

需求:

我们APP瀑布流列表的图片的比例是16:9,但网络请求的图片有一些不同比例的,产品需求是图片在不变形情况下,保留左右两边不截取,左右两边不留白,上下部分可截取可留白。

方案:

苹果提供了修改UIimageView填充模式的属性contentMode,其中有这样的两种模式:

UIViewContentModeScaleAspectFit:图片原始比例完整显示在imageView中,但会有留白,如下所示
image

比正常比例宽的图片上下会留白

image

比正常比例高的图片左右会留白

UIViewContentModeScaleAspectFill:图片原始比例充满imageView,但会有裁剪,即部分图片内容在imageView中显示不下,如下所示
image

比正常比例宽的图片左右会截取

image

比正常比例高的图片上下会截取

方案:

这两个模式都不能单独完成,两边不截取,不留白这个需求,所以要在加载图片时获取图片的宽高比与imageView的宽高比做比较,分别选用不同的模式。

 if (image.size.width/image.size.height > 16.0/9.0) {
    //比正常比例宽的图片
    imageView.contentMode = UIViewContentModeScaleAspectFit;
 } else {
    //比正常比例高的图片
    imageView.contentMode = UIViewContentModeScaleAspectFill;
 }

这样就可以完成左右不截取,不留白,图片不变形的需求了。

上一篇下一篇

猜你喜欢

热点阅读