Hstack doesn't show up on screen(Xcode)

Question

So I've created some stack views, a Zstack and Hstack in a V stack.The things in the Z-stack shows up, but the Text Hstack,"SquatCounter" only shows up when I run the app using iphone 11/12 simulators.But when i run this app on my iphone se2, the Hstack just isn't there. I need the text in the Hstack to show up no matter the phone model, anyone with experience pls help!

Expected result: The Text "squatCounter"shows up no matter what iphone its running on

Actual result; Text"squatCounter" only shows up on iphone 11/12 simulators, but not on other simulators/my own iphone se 2

I've tried adding a physical Hstack with a label inside and it also doesn't show up.

    var body: some View {
    VStack {
        ZStack {
            GeometryReader { geo in
                CameraViewWrapper(poseEstimator: poseEstimator)
                StickFigureView(poseEstimator: poseEstimator, size: geo.size)
            }
        }.padding(0.0).frame(width: UIScreen.main.bounds.size.width, height: UIScreen.main.bounds.size.height * 1920 / 1080, alignment: .center)
        HStack {
            Text("Squat counter:")
                .font(.title)
            Text(String(poseEstimator.squatCount))
                .font(.title)
            Image(systemName: "exclamationmark.triangle.fill")
                .font(.largeTitle)
                .foregroundColor(Color.red)
                .opacity(poseEstimator.isGoodPosture ? 0.0 : 1.0)
        }
    }
}

user_9607863 · Answer

This line doesn't look quite right:

.frame(width: UIScreen.main.bounds.size.width, height: UIScreen.main.bounds.size.height * 1920 / 1080, alignment: .center)

You should basically never use UIScreen in SwiftUI, that's what GeometryReader is for. You are also setting a fixed frame ratio, with setting the height more than the screen's height.

What you can do instead is use aspectRatio(_:contentMode:) to fix the view to a certain aspect ratio. Example:

VStack(spacing: 0) {
    Color.red.aspectRatio(1920 / 1080, contentMode: .fit)

    Color.green
}

Result:

Hstack doesn't show up on screen(Xcode)

1 Answers