View with Navigation Bar side effect

[callmeapplee]

When I put the skeleton in the view with the navigation bar, the view starts to change the frame, but when I change the transition to .scale, everything works.

struct ContentView: View {
    var body: some View {
        NavigationView(content: {
            Text("Hello, World!")
                .skeleton(with: true)
                .navigationTitle("temp")
                .navigationBarTitleDisplayMode(.inline)
        })
    }
}

[CSolanaM]

I'm trying to reproduce the error with the snippet you provided but I can't. Can you add another example on how to reproduce it? or a video to see the issue?

Thanks!

[callmeapplee]

2024-03-26.23.00.51.mov

[CSolanaM]

Ok, now I can reproduce it, thanks for the video:

Can you try to move the .navigationBarTitleDisplayMode(.inline) line above the .skeleton(with: true, size: CGSize(width: 100, height: 100)) ?

In my tests it's working with your example.

This might be because the way SwiftUI works. In this case, the default height for the navigation bar would be the large one, and you're setting it to the inline one. This makes one value change to another one, and with the way modifiers work, if placed after the skeleton modifier, it will "inherit" the animation for that value. That's why the order is always important.

Anyway, I'll check if there's any way to prevent this animation to be propagated after the skeleton modifier. For now, just changing the order should work, I guess.

I'll be looking forward if this solutions also works for you.

Thanks!

[callmeapplee]

I can't move .navigation Bar Title Display Mode(.inline) line above the view because, I have VStack and more than one view, that i should set skeleton.

Thank you for support.

[CSolanaM]

Can you test your code with the library examples? By opening the Examples/SkeletonUI.xcworkspace file.

That's where I'm testing yours and was able to reproduce it, as well as changing the library. I noticed that if in SkeletonModifier.swift I change the onAppear to this:

            .onAppear {
                DispatchQueue.main.asyncAfter(deadline: .now() + .zero, execute: {
                    animate.toggle()
                })
            }

It even works fine without the After part:

            .onAppear {
                DispatchQueue.main.async {
                    animate.toggle()
                }
            }

It stops doing that side effect. Could you confirm this on your side? Thanks

[CSolanaM]

@callmeapplee Hi, could you check that?

I'd like to know if that would work for you before releasing the fix.

Thanks

[CSolanaM]

Fixed in 2.0.2