In the first iOS14 beta, the following code does not work anymore when drawingGroup() is called:
Without drawingGroup(), this code displays on both iOS13 and 14 a gradient from black to white (0-30% of it), as well as a gradient from white to black (30%-100%), right next to each other.
On iOS13 and 14, when enabling drawingGroup(), the gradient in the Playground changes from black->white to white->yellow (for the left view, and equivalently for the right view). This is the first weird behaviour I observed.
On iOS14 only, calling drawingGroup() breaks the .padding() calculation. I can fix this as follows, which works on both iOS13 and 14:
Note that calling .frame(width: g.size.width) only works on RightView, on LeftView, I can either omit this call, or I need to call .frame(width: self.ratio * g.size.width). Which I absolutely don't understand. It would make sense to call .frame(width: (1-ratio) * g.size.width) on RightView, but that leads to the broken behaviour again.
It seems to me that in iOS14, for drawing groups, left padding is included in the frame width, whereas right padding is not. in iOS13, left padding is also not included in the frame width.
If that is the case, it seems like a regression in iOS14 to me.
Code Block import SwiftUI import PlaygroundSupport struct ContentView: View { var body: some View { MaskView().frame(width:300, height: 50) } } struct MaskView: View { var ratio: CGFloat = 0.3 var body: some View { GeometryReader { g in ZStack { LeftView() .mask(Rectangle() .padding(.trailing, (1-self.ratio) * g.size.width)) RightView() .mask(Rectangle() .padding(.leading, self.ratio * g.size.width)) } } } } struct LeftView: View { var body: some View { Rectangle().fill( LinearGradient( gradient: Gradient(colors: [.black, .white]), startPoint: .leading, endPoint: .trailing) ) .drawingGroup() } } struct RightView: View { var body: some View { Rectangle().fill( LinearGradient( gradient: Gradient(colors: [.white, .black]), startPoint: .leading, endPoint: .trailing) ) .drawingGroup() } } PlaygroundPage.current.setLiveView(ContentView())
Without drawingGroup(), this code displays on both iOS13 and 14 a gradient from black to white (0-30% of it), as well as a gradient from white to black (30%-100%), right next to each other.
On iOS13 and 14, when enabling drawingGroup(), the gradient in the Playground changes from black->white to white->yellow (for the left view, and equivalently for the right view). This is the first weird behaviour I observed.
On iOS14 only, calling drawingGroup() breaks the .padding() calculation. I can fix this as follows, which works on both iOS13 and 14:
Code Block var body: some View { GeometryReader { g in ZStack { LeftView() .mask(Rectangle() .padding(.trailing, (1-self.ratio) * g.size.width)) RightView() .mask(Rectangle() .frame(width: g.size.width) .padding(.leading, self.ratio * g.size.width)) } } }
Note that calling .frame(width: g.size.width) only works on RightView, on LeftView, I can either omit this call, or I need to call .frame(width: self.ratio * g.size.width). Which I absolutely don't understand. It would make sense to call .frame(width: (1-ratio) * g.size.width) on RightView, but that leads to the broken behaviour again.
It seems to me that in iOS14, for drawing groups, left padding is included in the frame width, whereas right padding is not. in iOS13, left padding is also not included in the frame width.
If that is the case, it seems like a regression in iOS14 to me.