SwiftUI 如何对齐两个不同字体大小的文本的底部?

ric*_*rne 5 xcode swift swiftui

我\xe2\x80\x99m 尝试对齐两个文本的底部,但较大的文本看起来像这样,我的小部件看起来像这样。我不\xe2\x80\x99t 知道为什么\xe2\x80\x99s 在这个文本视图下面仍然有一些空间。\n这是我的代码:

\n
var body: some View {\nGeometryReader{geometry in\n    ZStack(alignment: .center){\n        Image("background")\n            .resizable()\n        VStack(){\n            HStack(alignment: .bottom){\n                Text("3")\n                    .lineLimit(1)\n                    .font(.bold(.system(size: 100))())\n                    .minimumScaleFactor(0.1)\n                    .foregroundColor(Color.white)\n                    .frame(width: nil, height: geometry.size.height/3, alignment: .bottom)\n                    .lineLimit(1)\n                    .shadow(radius: 2)\n                Text("cups")\n                    .foregroundColor(Color.white)\n                    .font(.system(size: 12))\n                    .shadow(radius: 2)\n            }\n            Text("Next cup on")\n                .foregroundColor(Color.white)\n                .font(.system(size: 10))\n                .shadow(radius: 2)\n                .opacity(0.5)\n            Text("10 : 00")\n                .foregroundColor(Color.white)\n                .font(.system(size: 12))\n                .shadow(radius: 1)\n                .opacity(0.5)\n        }\n    }\n}\n
Run Code Online (Sandbox Code Playgroud)\n

}

\n

我想要的是数字 3\xe2\x80\x99s 底部与 \xe2\x80\x9ccups\xe2\x80\x9d\xe2\x80\x99s 底部对齐。\n谢谢!

\n

jn_*_*pdx 15

.bottom您可以使用以下.lastTextBaseline方式代替HStack

HStack(alignment: .lastTextBaseline) {
    Text("Hello").font(.system(size: 40))
    Text("World").font(.system(size: 10))
}
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述