可可触摸 - 添加纹理覆盖视图

Question

我有一组瓷砖作为具有可编程背景色的UIViews，并且每个 可以是不同的颜色。我想添加纹理，像一个侧光斜面，每个。这可以通过覆盖视图或其他方法来完成吗？

我正在寻找不需要每个案例的自定义图像文件的建议。

Answer 1

这可能会帮助某人，虽然这是从SO上的其他主题拼凑在一起。 要创建具有用于正常和视网膜显示任意颜色的斜切平铺图像，我提出在Photoshop斜切图像和饱和度设置为零，使得灰度图像称为tileBevel.png

我还创建一个用于视网膜显示器（tileBevel@2x.png）

下面是代码：

+ (UIImage*) createTileWithColor:(UIColor*)tileColor { 

    int pixelsHigh = 44; 
    int pixelsWide = 46; 
    UIImage *bottomImage; 

    if([UIScreen respondsToSelector:@selector(scale)] && [[UIScreen mainScreen] scale] == 2.0) { 
     pixelsHigh *= 2; 
     pixelsWide *= 2; 
     bottomImage = [UIImage imageNamed:@"tileBevel@2x.png"];   
    } 
    else { 
     bottomImage = [UIImage imageNamed:@"tileBevel.png"]; 
    } 

    CGImageRef theCGImage = NULL; 
    CGContextRef tileBitmapContext = NULL; 

    CGRect rectangle = CGRectMake(0,0,pixelsWide,pixelsHigh); 

    UIGraphicsBeginImageContext(rectangle.size); 

    [bottomImage drawInRect:rectangle]; 

    tileBitmapContext = UIGraphicsGetCurrentContext(); 

    CGContextSetBlendMode(tileBitmapContext, kCGBlendModeOverlay); 

    CGContextSetFillColorWithColor(tileBitmapContext, tileColor.CGColor);   
    CGContextFillRect(tileBitmapContext, rectangle); 

    theCGImage=CGBitmapContextCreateImage(tileBitmapContext); 

    UIGraphicsEndImageContext(); 

    return [UIImage imageWithCGImage:theCGImage]; 

} 

此检查是否使用了视网膜显示，调整要绘制的矩形的大小，选取合适的灰度基础图像，将混合模式设置为覆盖，然后在底部图像顶部绘制矩形。所有这些都在由BeginImageContext和EndImageContext调用括起来的图形上下文中完成。这些设置UIImage drawRect：方法所需的当前上下文。核心图形函数需要上下文作为参数，通过调用来获取当前上下文。

而结果是这样的：

Answer 2

如果你想保留源图像的alpha通道，只是填充矩形前添加此吉姆代码：

// Apply mask 
CGContextTranslateCTM(tileBitmapContext, 0, rectangle.size.height); 
CGContextScaleCTM(tileBitmapContext, 1.0f, -1.0f); 

CGContextClipToMask(tileBitmapContext, rectangle, bottomImage.CGImage); 

Answer 3

Swift 3解决方案，基本上基于吉姆的答案和Scriptease的补充，以及一些细微的变化：

class func image(bottomImage: UIImage, topImage: UIImage, tileColor: UIColor) -> UIImage? { 
    let pixelsHigh: CGFloat = bottomImage.size.height 
    let pixelsWide: CGFloat = bottomImage.size.width 

    let rectangle = CGRect.init(x: 0, y: 0, width: pixelsWide, height: pixelsHigh) 
    UIGraphicsBeginImageContext(rectangle.size); 

    bottomImage.draw(in: rectangle) 

    if let tileBitmapContext = UIGraphicsGetCurrentContext() { 
     tileBitmapContext.setBlendMode(.overlay) 
     tileBitmapContext.setFillColor(tileColor.cgColor) 
     tileBitmapContext.scaleBy(x: 1.0, y: -1.0) 
     tileBitmapContext.clip(to: rectangle, mask: bottomImage.cgImage!) 
     tileBitmapContext.fill(rectangle) 
     let theCGImage = tileBitmapContext.makeImage() 
     UIGraphicsEndImageContext(); 

     if let theImage = theCGImage { 
      return UIImage.init(cgImage: theImage) 
     } 
    } 

    return nil 
}