iOS平台主图叠加徽章式小图时水印过大问题求助

我懂你遇到的这个问题——当主图本身尺寸比较小时，固定尺寸的水印就会显得特别大，破坏整体视觉效果。咱们可以通过根据主图尺寸动态缩放水印的方式来解决，让水印始终保持合适的比例，不管主图是大是小。

修改后的代码示例 #

[_productImg sd_setImageWithURL:[NSURL URLWithString:imgUrl] placeholderImage:nil completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL) { 
    if (image.size.width > 0 && img.isdefaultImage) { 
        UIImage *watermark = [UIImage imageNamed:@"is_default_big"]; 
        CGFloat scale = image.scale; 

        // 关键：定义水印占主图宽度的比例，这里设为15%，你可以根据需求调整
        CGFloat watermarkWidthRatio = 0.15;
        // 计算水印的新宽度，保持原宽高比避免变形
        CGFloat newWatermarkWidth = image.size.width * watermarkWidthRatio;
        CGFloat newWatermarkHeight = newWatermarkWidth * (watermark.size.height / watermark.size.width);

        UIGraphicsBeginImageContextWithOptions(image.size, NO, 0.0); 
        [image drawInRect:CGRectMake(0, 0, image.size.width, image.size.height)]; 
        // 使用缩放后的尺寸绘制水印，位置仍保持右上角
        [watermark drawInRect:CGRectMake(image.size.width - newWatermarkWidth, 0, newWatermarkWidth, newWatermarkHeight)]; 
        UIImage *result = UIGraphicsGetImageFromCurrentImageContext(); 
        UIGraphicsEndImageContext(); 
        _productImg.image = result; 
    } 
    [_spinner stopAnimating]; 
    [_spinner removeFromSuperview]; 
}];

关键逻辑说明 #

• 首先设定一个watermarkWidthRatio比例值（比如0.15代表水印宽度是主图宽度的15%），这个数值你可以根据产品视觉需求灵活调整
• 通过主图宽度乘以比例得到水印的新宽度，再根据原水印的宽高比计算出新高度，保证水印不会拉伸变形
• 最后用新的尺寸绘制水印，位置依然保持在右上角，只是坐标跟着水印新宽度做了对应调整

这样修改后，不管主图是大尺寸还是小尺寸，水印都会按比例缩放，始终保持协调的视觉效果啦。

内容的提问来源于stack exchange，提问作者Mayank Patel