【代码】iOS适配UIImageView做遮罩

2022-08-18 11:13:02  阅读 161 次 评论 0 条

这几天APP用户反馈一个问题,就是聊天页面气泡都不显示,用公司的iPhone 6 iOS12.5.5的一点问题都没有。

于是我拿出了我自己的第一代iPhone SE iOS14.0.1的,发现了问题。

本来效果图是这样的。

IMG_0077.jpg


但是在iOS14上却是空白一片

IMG_E25733A6FD9B-1.jpeg

但是最骚的是点击事件居然还可用。

在这里我直接用UIImageView的 layer来做的遮罩


就像酱紫~

//我这里写self是因为我这本身继承了UIImageView哦~
UIImageView *maskView = nil;
    UIImage *maskImage = nil;
    //加载不同的图像
    if (isReceived) {
    maskImage = [UIImage imageNamed:@"otherChatBg"];
    } else {
    maskImage = [UIImage imageNamed:@"mychatBg"];
    }
    maskImage = [maskImage resizableImageWithCapInsets:UIEdgeInsetsMake(28, 20, 28, 20)];
    [self setImage:maskImage];
    maskView = [UIImageView new];
    maskView.image = maskImage;
    [maskView setFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
    self.layer.mask = maskView.layer;
    self.contentMode = UIViewContentModeScaleToFill;

嗯,上面这段代码在iOS14以下运行没毛病。

仔细研究下发现maskView.layer中少了 contents 的信息

这是iOS14之前的layer

1660794246056.jpg

这是iOS14之后的layer

1660794410448.jpg

从图片中可以看出,对象里的contents不见了。这点不知道是bug,还是官方特意为之。毕竟咱也没看相关的文档。

这样的话,就不能用 UIImageView 的 layer 啦, 要自己搞出一个 layer 了。

通过查找资料,发现 layer 可以设置 contents,而这个玩意儿可以接收 UIImage 的对象。开搞:

        CALayer *maskLayer = [CALayer layer];
        maskLayer.frame = self.bounds;
        [maskLayer setContents:(id)[maskImage stretchableImageWithLeftCapWidth:50 topCapHeight:30].CGImage];
        self.layer.mask = maskLayer;

嘶。。。这运行结果,貌似有那么一点不对啊~

IMG_DBA79C480312-1.jpeg

由此看来,气泡图片的拉伸出了一点点的问题哦~

那我们就来自己弄个适合尺寸的图片吧!

/// 对当前图片拉伸到对应尺寸的图片
/// @param originImage 原始图片
/// @param newSize 新的尺寸
/// @param leftCapWidth
/// @param topCapHeight
- (UIImage *)stretchImageWithOriginImage:(UIImage *)originImage newSize:(CGSize)newSize leftCapWidth:(CGFloat)leftCapWidth topCapHeight:(CGFloat)topCapHeight{
    UIImage *newImage;
    newImage = [originImage stretchableImageWithLeftCapWidth:leftCapWidth topCapHeight:topCapHeight];
    UIGraphicsBeginImageContextWithOptions(newSize, false, 0);
    [newImage drawInRect:CGRectMake(0, 0, newSize.width, newSize.height)];
    
    newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return newImage;
}

//引用要改成酱紫~
UIImageView *maskView = nil;
    UIImage *maskImage = nil;
    
    //加载不同的图像
    if (isReceived) {
    maskImage = [UIImage imageNamed:@"otherChatBg"];
    } else {
    maskImage = [UIImage imageNamed:@"mychatBg"];
    }
    maskImage = [maskImage resizableImageWithCapInsets:UIEdgeInsetsMake(28, 20, 28, 20)];
    [self setImage:maskImage];
    maskView = [UIImageView new];
    maskView.image = maskImage;
    [maskView setFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
    
    //iOS14的适配
        CALayer *maskLayer = [CALayer layer];
        maskLayer.frame = self.bounds;
        //这个就是计算尺寸的啦~
    [maskLayer setContents:(id)[self stretchImageWithOriginImage:maskImage newSize:CGSizeMake(self.frame.size.width, self.frame.size.height) leftCapWidth:28 topCapHeight:20].CGImage];
        self.layer.mask = maskLayer;

最后,问题解决~~奥利给!!

IMG_12B0730BF6D2-1.jpeg


微信扫码查看本文
本文地址:https://www.yangguangdream.com/?id=2214
版权声明:本文为原创文章,版权归 编辑君 所有,欢迎分享本文,转载请保留出处!

发表评论


表情

还没有留言,还不快点抢沙发?