SwiftUI:旋转后文本不具有屏幕的全宽

kuz*_*zdu 4 swiftui

该应用程序仅支持肖像模式。应显示两个问题,但它们会相应轮换。因此,无论玩家坐在哪里,都可以清楚地看到问题。

不管怎样,旋转时边界框似乎没有旋转。

ZStack {
        HStack {
            GeometryReader { proxy in
                Text(challenge)
                    .rotationEffect(Angle(degrees: 90), anchor: .center)
                    .frame(maxWidth: proxy.size.height, minHeight: proxy.size.width)
                    .foregroundColor(.red)
                    .font(.largeTitle)
                    .background(Color.blue)
            }
            Spacer()
            GeometryReader { proxy in
                Text(challenge)
                    .rotationEffect(Angle(degrees: 270), anchor: .center)
                    .frame(maxWidth: proxy.size.height, minHeight: proxy.size.width)
                    .foregroundColor(.red)
                    .font(.largeTitle)
                    .background(Color.blue)
            }
        }
    }
Run Code Online (Sandbox Code Playgroud)

我尝试过很多不同的事情。我省略了GeometryReader并使用“fixedSize()”。然后我看到屏幕上出现了一行字。

我也尝试过这个解决方案,但它没有按预期工作。

我的结果始终是不使用全宽度的文本。(重叠只是另一个错误,但我一定会控制住它)。

在此输入图像描述

我真正想要拥有的是: 在此输入图像描述

Asp*_*eri 9

这是可能方法的演示。使用 Xcode 12.1 / iOS 14.1 准备

演示

struct DemoView: View {
    var body: some View {
        HStack {
            RotatedText(text: lorem, angle: Angle(degrees: 90))
            RotatedText(text: lorem, angle: Angle(degrees: -90))
        }
    }
}

struct RotatedText: View {
    let text: String
    let angle: Angle
    var color: Color = .blue
    
    var body: some View {
        color.overlay(
            GeometryReader { gp in
                VStack {
                    Text(text)
                        .frame(width: gp.size.height, height: gp.size.width)
                        .rotationEffect(angle)
                }.frame(width: gp.size.width, height: gp.size.height)
            }
        )
    }
}
Run Code Online (Sandbox Code Playgroud)