7.7 C
New York
Thursday, March 27, 2025

ios – SwiftUI Views are shifting after being loaded (the peak is altering)


So I’m utilizing a swiftUI view inside UIKit utilizing UIHostingController . That is the code for that half

class ProductCardViewController: UIViewController {
  var purchaseResult: PurchaseResult = .failure

  override func viewAppearance() {
    tremendous.viewAppearance()
      let productCardVc: UIHostingController
    change purchaseResult {
    case .success:
       let productCardVc = UIHostingController(rootView: AnyView(ProductCardView()))
    case .failure:
        productCardVc = UIHostingController(rootView: AnyView(ProductPurchaseFailureView(navigationController: navigationController)))
    }
    setupHostingController(productCardVc)
  }

  personal func setupHostingController(_ hostingController: UIHostingController) {
    hostingController.view.bounds = view.bounds
    hostingController.view.backgroundColor = .clear
    hostingController.view.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(hostingController.view)

    NSLayoutConstraint.activate([
      hostingController.view.topAnchor.constraint(equalTo: view.topAnchor),
      hostingController.view.bottomAnchor.constraint(equalTo: view.bottomAnchor),
      hostingController.view.leadingAnchor.constraint(equalTo: view.leadingAnchor),
      hostingController.view.trailingAnchor.constraint(equalTo: view.trailingAnchor)
    ])
  }
  
}

However when my swiftUI View hundreds there’s a change in top of the geomatry of the view from top 852 to top 759. I do not know why that is taking place .

My SwiftUI view

import SwiftUI
import Lottie

struct ProductPurchaseFailureView: View {
    var navigationController: UINavigationController?
    var physique: some View {
        GeometryReader { geometry in
            ZStack() {
                Picture("random_image")
                    .resizable()
                    .opacity(0.3)
                    .blur(radius: 150)
                    .background(Colour.purchaseFailureBackground)
                    .ignoresSafeArea()
                
                ZStack {
                  Textual content("Scratch Card")
                    .font(.customized(FontConstants.therokBold.rawValue, measurement: 28))
                    .foregroundColor(.white)
                    .shadow(coloration: .black, radius: 2, x: 1, y: 2)
                  HStack {
                    Spacer()
                    Button {
                    } label: {
                      Picture(systemName: "xmark")
                        .resizable()
                        .foregroundColor(.tabbar)
                        .body(width: 12, top: 12)
                        .padding(14)
                        .background(
                          Circle()
                            .stroke(.tabbar)
                        )
                    }
                  }.padding(.horizontal)
                }
                .body(width:geometry.measurement.width, top: geometry.measurement.top, alignment: .high)

                VStack {
                    LottieView(animation: .named("exclamation_mark"))
                        .enjoying(loopMode: .loop)
                        .resizable()
                        .aspectRatio(contentMode: .match)
                        .body(width: 150)
                    VStack {
                        Textual content("We're unable to fetch your reward")
                            .font(.system(measurement: 18, weight: .daring))
                            .foregroundColor(.orange)
                            .padding(.backside)
                        Textual content("Please go to the Rewards Web page later to find your reward.")
                            .font(.system(measurement: 16))
                            .foregroundColor(.main)
                    }
                    .multilineTextAlignment(.middle)
                    .body(maxWidth: .infinity, alignment: .middle)
                    .padding()
                    Line()
                        .stroke(model: StrokeStyle(lineWidth: 1 ,sprint: [5]))
                        .body(width: geometry.measurement.width * 0.8 , top: 1)
                        .foregroundColor(.main)
                    Button {
                    } label: {
                        Textual content("Again")
                            .font(.headline)
                            .foregroundColor(.purchaseFailureCardBg)
                            .padding()
                            .body(maxWidth: .infinity)
                    }
                    .padding(.horizontal)
                    .padding(.high, 10)
                    .buttonStyle(ThreeDimensionalButtonStyle())
                    .body(width: geometry.measurement.width * 0.7, top: 50)
                }
                
                
                .body(width: geometry.measurement.width * 0.9,top: geometry.measurement.top * 0.55)
                .background(Colour.purchaseFailureCardBg)
                .cornerRadius(16)
                .shadow(radius: 10)
            }
            
        }
    }
}
struct Line: Form {
    func path(in rect: CGRect) -> Path {
        var path = Path()
        path.transfer(to: CGPoint(x: 0, y: 0))
        path.addLine(to: CGPoint (x: rect.width, y: 0))
        return path
    }
}
#Preview {
    ProductPurchaseFailureView()
}



struct ThreeDimensionalButtonStyle: ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        let bgView = self.getBgView()
        if #out there(iOS 15.0, *) {
            configuration.label.foregroundStyle(Colour.white)
                .padding(16)
                .background {
                    ZStack {
                        bgView
                            .opacity(0.2)
                            .offset(y: configuration.isPressed ? 0:8)
                            .padding(.horizontal,2)
                        bgView
                    }
                }
                .rotation3DEffect(.levels(20), axis: (x: 1,y: 0,z:0))
                .offset(y: configuration.isPressed ? 8 : 0)
                .animation(.interactiveSpring(), worth: configuration.isPressed)
            
        } else {
            // Fallback on earlier variations
            configuration.label.foregroundColor(Colour.white)
                .padding(16)
                .background (
                    ZStack {
                        bgView
                            .opacity(0.2)
                            .offset(y: configuration.isPressed ? 0:8)
                            .padding(.horizontal,2)
                        bgView
                    }
                )
                .rotation3DEffect(.levels(20), axis: (x: 1,y: 0,z:0))
                .offset(y: configuration.isPressed ? 8 : 0) // 2
                .animation(.interactiveSpring(), worth: configuration.isPressed)
        }
        
        
        
    }
    func getBgView() -> some View {
        Colour.purchaseFailureButtonBackground
            .clipShape(RoundedRectangle(cornerRadius: 12))
            .body(top: 40)
    }
    
}
 

I do not perceive the place I’m doing mistaken. I’m very new to SwiftUI and have solely labored with UIKit . Please assist guys

Related Articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Latest Articles