Swiftui 如何创建两个大小相同的文本视图

我正在做一个游戏，我有文本视图，表示可以翻转的卡片。卡片的每一面都有文字。我希望卡片两边的尺寸相同。i、 e.我希望文本较少一侧的卡片与文本较多一侧的卡片大小相同。我不想硬编码卡片大小，因为有时只有一行文本，而有时会有多行文本。以下是我目前掌握的代码摘录：

import SwiftUI

struct FlipTestView: View {
    
    @State var flipped = false
    
    var body: some View {
        let flipDegrees = flipped ? 180.0 : 0
        VStack {
            ZStack() {
                Text("Card One First Side Of Card")
                    .placedOnCard(Color.yellow)
                    .flipRotate(flipDegrees).opacity(flipped ? 0.0 : 1.0)
                Text("""
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                    """)
                    .placedOnCard(Color.green)
                    .flipRotate(-180 + flipDegrees).opacity(flipped ? 1.0 : 0.0)
            }
            .animation(.easeInOut(duration: 0.8))
            .onTapGesture { flipped.toggle()}
        }
    }
}

struct FlipTestView_Previews: PreviewProvider {
    static var previews: some View {
        FlipTestView()
    }
}

extension View {
    
    func flipRotate(_ degrees : Double) -> some View {
        return rotation3DEffect(Angle(degrees: degrees), axis: (x: 1.0, y: 0.0, z: 0.0))
    }
    
    func placedOnCard(_ color: Color) -> some View {
        return
            padding(15)
            //            .frame(width: 350, height: 65, alignment: .center).background(color)
            .background(color)
            .cornerRadius(16)
            .overlay(
                RoundedRectangle(cornerRadius: 16)
                    .stroke(Color.blue, lineWidth: 4)
            )
    }
}

---

将

.placedOnCard

移动到包含两侧的

ZStack

，然后将其调整为两侧中较大的一个。以下是重构代码的解决方案：

ZStack（）{
文本（“卡片第一面的卡片”）
.不透明度（翻转？0.0:1.0）
文本（“”）
知识本身是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德如果你不轻率，就必须为自己的行为负责。
""")
.flipRotate（180.0）。不透明度（翻转？1.0:0.0）
}
.placedOnCard（翻转？颜色。绿色：颜色。黄色）
.flipRotate（flipDegrees）
.animation（.easeInOut（持续时间：0.8））
.ontapsignate{flipped.toggle（）}

---