使用“Vstack”将图像调整为屏幕宽度，同时保持宽高比

我正在VStack显示图像（与json相比，它们将具有不同的大小）

我需要显示它以占据屏幕宽度（vstack的宽度并保持宽高比）并适当调整其大小，同时注意根据屏幕宽度的高度。我尝试了不同的方法，但是我设法正确显示了图像。

我的看法是：

struct ContentView: View {
    var body: some View {

        VStack {

            GeometryReader { geometry in
                VStack {
                    Text("Width: \(geometry.size.width)")
                    Text("Height: \(geometry.size.height)")

                }
                    .foregroundColor(.white)

            }
                .padding()
                .frame(alignment: .topLeading)
                .foregroundColor(Color.white) .background(RoundedRectangle(cornerRadius: 10) .foregroundColor(.blue))
                .padding()

            GeometryReader { geometry in
                VStack {
                    Image("sample")
                    .resizable()

                     //.frame(width: geometry.size.width)
                     .aspectRatio(contentMode: .fit)

                }
                    .foregroundColor(.white)

            }

                .frame(alignment: .topLeading)
                .foregroundColor(Color.white) .background(RoundedRectangle(cornerRadius: 10) .foregroundColor(.blue))
                .padding()



        }
        .font(.title)

    }
}

当我.frame (width: geometry.size.width)通过分配的宽度使用时geometry，该宽度会显示在整个屏幕上，但高度不能保持纵横比。（看起来被压碎了）

如何获取图像的尺寸并找到其比例以用于 .aspectRatio (myratio, contentMode: .fit)

还有另一种正确显示图像的方法，任何建议