Back in https://github.com/facebook/react-native/commit/d70d7fd0b3984ee54622afc4692a6c945618c345 , React Native switched their usages of UIGraphicsBeginImageContext() / UIGraphicsEndImageContext() with UIGraphicsImageRenderer. There is no macOS equivalent to this class, so we kept maintaining larger ifdefs with our old shims for the deprecated methods. With React Native 0.76+, I'm starting to see more usage of UIGraphicsImageRenderer (specifically, to render web-style box shadows), so let's make a proper shim of it on macOS.
Let's create a class RCTUIGraphicsImageRenderer that has the same shape as the equivalent iOS code, only implementing the methods and properties we need. Functionally, the new class is doing the same thing as the old code, but in a more cross platform friendly way. There are some changes though, namely we don't flip and scale the CGContext to match the iOS and macOS coordinate systems. It seems calling [image lockFocusFlipped:YES] is sufficient.
Related upstream PRs:
RCTUIGraphicsImageRenderer()(which conflicts with my shim) upstream toRCTMakeUIGraphicsImageRenderer(): https://github.com/facebook/react-native/pull/46772Summary:
Back in https://github.com/facebook/react-native/commit/d70d7fd0b3984ee54622afc4692a6c945618c345 , React Native switched their usages of
UIGraphicsBeginImageContext()/UIGraphicsEndImageContext()withUIGraphicsImageRenderer. There is no macOS equivalent to this class, so we kept maintaining larger ifdefs with our old shims for the deprecated methods. With React Native 0.76+, I'm starting to see more usage ofUIGraphicsImageRenderer(specifically, to render web-style box shadows), so let's make a proper shim of it on macOS.Let's create a class
RCTUIGraphicsImageRendererthat has the same shape as the equivalent iOS code, only implementing the methods and properties we need. Functionally, the new class is doing the same thing as the old code, but in a more cross platform friendly way. There are some changes though, namely we don't flip and scale theCGContextto match the iOS and macOS coordinate systems. It seems calling[image lockFocusFlipped:YES]is sufficient.Inspiration for this shim came from a few sources, namely https://github.com/shaps80/GraphicsRenderer .
Test Plan:
At the current repo sync point, the main use case is in border drawing, which seems to look fine: