iOS 15/16 Issue

One of the apps I’m building makes use of view transitions to move views into and out of the screen from right to left. When I upgraded to iOS 16, some of the views were going in the wrong direction, while still going in the correct direction when run on an iOS 15 simulator. These two videos show the example code running on both 15 and 16. As you can see, two different things are happening.

struct ContentView: View {
    
    var screenWidth = UIScreen.main.bounds.width
    
    @State var blueViewIsShowing = true
    
    var body: some View {
        VStack {

            Spacer()
            
            switch blueViewIsShowing {
            case true:
                CircleView(color: .blue)
                    .frame(width: screenWidth)
                    .transition(.offset(CGSize(width: -screenWidth, height: 0)))
            case false:
                CircleView(color: .orange)
                    .frame(width: screenWidth)
                    .transition(.offset(CGSize(width: screenWidth, height: 0)))

            }
            
            Spacer()
            
            Button {
                withAnimation(Animation.linear(duration: 1)) {
                    blueViewIsShowing.toggle()
                }
                
            } label: {
                Text("Switch View")
                    .padding()
                    .background(RoundedRectangle(cornerRadius: 10).fill(.green))
                    .foregroundColor(.black)

            }
            
            Spacer()
        }

    }
}

iPhone_13_ios_15_AdobeExpress
iPhone_13_ios_16_AdobeExpress

I’m just looking for thoughts from anyone who’s had similar experiences with upgrades… I’m not sure if I’ll need to find a workaround so that I can keep the minimum deployment at 15, or if the whole thing is a bug which Apple plans on addressing…

@Arron_E I’m not sure what the problem is, but if you found a solution for the iOS 16 version, using the new Xcode released, you can use the technique we use to handle this kind of version-based issue. I’ll share the link below.

Thanks @joash, but if I’m understanding it correctly, I’m not sure this will lead to a solution, as it’s not an issue of availability. Everything in the code is available to both 15 and 16, it just functions differently in each. It seems that in 15 (first gif), a negative offset transition value will always move the view in a rightward direction, whether it’s being inserted or removed, while in 16 (second gif), a negative value will always move the view into and out of the left side of the screen.

I had initially used the transition pasted below, but things things got “flipped” in same way they did with the .offset(CGSize) option.

.transition(.asymmetric(insertion: .move(edge: vm.isMovingForward ? .trailing : .leading), removal: .move(edge: vm.isMovingForward ? .leading : .trailing)))

Hey @Arron_E, apologies for the misunderstanding.

I’m afraid I can’t tell you why things changed in iOS 16, as I can only speculate, but to fix what you wanted to do on iOS 16, you can use the asymmetric transition, and use your existing offset transitions as the insertion and removal values in reverse order for each case.

See the code below:

            case true:
                CircleView(color: .blue)
                    .frame(width: screenWidth)
                    .transition(
                        .asymmetric(
                            insertion: .offset(CGSize(width: -screenWidth, height: 0)),
                            removal: .offset(CGSize(width: screenWidth, height: 0))
                        )
                    )
            case false:
                CircleView(color: .orange)
                    .frame(width: screenWidth)
                    .transition(
                        .asymmetric(
                            insertion: .offset(CGSize(width: screenWidth, height: 0)),
                            removal: .offset(CGSize(width: -screenWidth, height: 0))
                        )
                    )
            }

@joash thanks. Unfortunately, I get the same issue when I use the asymmetric option. I get the two (different) results - same as the two gifs I posted, when I run on a 15 versus a 16 simulator. Did you try and get a different result than I did?

I appreciate all your help and suggestions. I was going to do some research on whether this is something I should report to Apple, and if so, how to go about it. I just haven’t gotten around to it.

I just submitted feedback to Apple regarding the issue

1 Like