The ImageRenderer ain’t Rendering
#DevNotes from building Lagree Buddy
The TLDR; of this entire thing?
I created a shareable asset for Lagree Buddy users to share their milestones, but ran into a weird bug.
The Bug
My purple badge (as seen below) would never render.
The Reason
SwiftUI’s new .containerRelativeFrame does not play nicely with SwiftUI’s new ImageRenderer. Using these two together will "disappear" whichever view it’s applied to.
The full (but still short) story
I enjoy using new APIs as much as I dislike using a GeometryReader.
So instead of going with the tried and true way of using a UIGraphicsImageRenderer to create my share asset, I went with the new ImageRenderer. And instead of just adding horizontal padding to my purple badge, I threw in a .containerRelativeFrame because, like I said,
“New APIs! Whee!”
And that is where things went sideways.
Because no matter what adjustments I made, my badge refused to render!
In hindsight, my problem was thinking it was an ImageRenderer problem and not a Text View Modifier problem. But it’s because I assumed the ImageRenderer was manipulating the layout like a GeoemetryReader.
This meant that my dodo-brain never dug into the view code, but instead, it kept futzing with how I constructed the view. So I tried all sorts of inconsequential things like converting the shareable view from a computed property to a function, but, of course, that didn’t work:
But once I deduced it was not the ImageRenderer’s fault, I finally took a closer look at the view code and all I had to do was replace that line of code with some basic padding:
So now, you are all free to share how obsessed you are with Lagree, like me 😂.
