Flatten CALayer sublayers into one layer - objective-c

Question

In my app I have one root layer, and many images which are sublayers of rootLayer. I'd like to flatten all the sublayers of rootLayer into one layer/image, that don't have any sublayers. I think I should do this by drawing all sublayers in core graphics context, but I don't know how to do that.
I hope you'll understand me, and sorry for my English.

Answer 1

From your own example for Mac OS X:
CGContextRef myBitmapContext = MyCreateBitmapContext(800,600);
[rootLayer renderInContext:myBitmapContext];
CGImageRef myImage = CGBitmapContextCreateImage(myBitmapContext);
rootLayer.contents = (id) myImage;
rootLayer.sublayers = nil;
CGImageRelease(myImage);
iOS:
UIGraphicsBeginImageContextWithOptions(rootLayer.bounds.size, NO, 0.0);
[rootLayer renderInContext: UIGraphicsGetCurrentContext()];
UIImage *layerImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
rootLayer.contents = (id) layerImage.CGImage;
rootLayer.sublayers = nil;
Also note the caveat in the docs:
The Mac OS X v10.5 implementation of
this method does not support the
entire Core Animation composition
model. QCCompositionLayer,
CAOpenGLLayer, and QTMovieLayer layers
are not rendered. Additionally, layers
that use 3D transforms are not
rendered, nor are layers that specify
backgroundFilters, filters,
compositingFilter, or a mask values.

Answer 2

Do you still want the layer to be interactive? If not, call -renderInContext: and show the bitmap context.

Answer 3

I also once considered using render(in: CGContext).
However, I decided not to after reading this:
Important
The OS X v10.5 implementation of this method does not support the entire Core Animation composition model. QCCompositionLayer, CAOpenGLLayer, and QTMovieLayer layers are not rendered. Additionally, layers that use 3D transforms are not rendered, nor are layers that specify backgroundFilters, filters, compositingFilter, or a mask values. Future versions of macOS may add support for rendering these layers and properties.
Seriously, no masks? I say, "WORK, Apple."
For a caveat, it's too huge to ignore, so I had to find a different approach.
solution
extension CALayer {
func flatten(in size: CGSize) -> CALayer {
let flattenedLayer = CALayer(in: size)
flattenedLayer.contents = getCGImage(in: size)
return flattenedLayer
}
}
It converts CALayer into CGImage and make a new CALayer with flattened image as its contents.
Of course, I had to make getCGImage(in: CGSize) as well, using CARenderer.
implementation
import AppKit
import Metal
let device = MTLCreateSystemDefaultDevice()!
let context = CIContext()
var textureDescriptor: MTLTextureDescriptor = {
let textureDescriptor = MTLTextureDescriptor.texture2DDescriptor(pixelFormat: .rgba8Unorm, width: 0, height: 0, mipmapped: false)
textureDescriptor.usage = [MTLTextureUsage.shaderRead, .shaderWrite, .renderTarget]
return textureDescriptor
}()
let maxScaleFactor = NSScreen.screens.reduce(1) { max($0, $1.backingScaleFactor) }
let scaleTransform = CATransform3DMakeScale(maxScaleFactor, maxScaleFactor, 1)
let colorSpace = CGColorSpace(name: CGColorSpace.sRGB)!
extension CALayer {
convenience init(in size: CGSize, with sublayer: CALayer? = nil) {
self.init()
frame.size = size
if let sublayer { addSublayer(sublayer) }
}
func getCGImage(in size: CGSize) -> CGImage {
let ciImage = getCIImage(in: size)
return context.createCGImage(ciImage, from: ciImage.extent)!
}
func getCIImage(in size: CGSize) -> CIImage {
let superlayer = self.superlayer
let ciImage = CALayer(in: size, with: self).ciImage
if let superlayer { superlayer.addSublayer(self) }
return ciImage
}
var ciImage: CIImage {
let width = frame.size.width * maxScaleFactor
let height = frame.size.height * maxScaleFactor
textureDescriptor.width = Int(width)
textureDescriptor.height = Int(height)
let texture: MTLTexture = device.makeTexture(descriptor: textureDescriptor)!
let renderer = CARenderer(mtlTexture: texture)
transform = scaleTransform
frame = .init(origin: .zero, size: .init(width: width, height: height))
renderer.bounds = frame
renderer.layer = self
CATransaction.flush()
CATransaction.commit()
renderer.beginFrame(atTime: 0, timeStamp: nil)
renderer.render()
renderer.endFrame()
return CIImage(mtlTexture: texture, options: [.colorSpace: colorSpace])!
}
}
There are a few things to note:
use of CATransform3D to match resolution of HiDPI display
temporarily added as a new CALayer's sublayer in getCIImage(in: CGSize) for layers like CAShapeLayer with zero frame size; this is also to get the image independent from its frame origin/position
use of CATransaction.flush() to transfer ownership of the layer tree to the CARenderer’s context
extras
Since CALayer can have NSImage as its contents too in macOS 10.6 and later, you can change the function accordingly.
extension CALayer {
func getNSImage(in size: CGSize) -> NSImage {
let ciImage = getCIImage(in: size)
return NSImage(data: ciImage.pngData)!
}
}
extension CIImage {
var pngData: Data { context.pngRepresentation(of: self, format: .RGBA8, colorSpace: colorSpace!)! }
// jpeg, tiff, etc. can be created the same way
}
Coming this far, saving as image is not hard at all,
but using write...Representation(of: CIImage, ...) is probably the easiest way:
extension CALayer {
func saveAsPNG(at url: URL, in size: CGSize? = nil) {
let image = size == nil ? ciImage : getCIImage(in: size!)
return try! context.writePNGRepresentation(of: image, to: url, format: .RGBA8, colorSpace: colorSpace)
}
// jpeg, tiff, etc. can be saved the same way
}