SwiftUI:回転後にテキストが画面の全幅になりません

Dec 01 2020

アプリはpotraitモードのみをサポートしています。2つの質問が表示されますが、それに応じてローテーションされます。そのため、プレイヤーはどこに座っていても、質問をよく見ることができます。

とにかく、回転中にバウンディングボックスが回転していないようです。

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)
            }
        }
    }

私はいろいろなことを試しました。をGeometryReader省略して、「fixedSize()」を使用しました。次に、画面を横切るワンライナーを取得します。

私もこの解決策を試しましたが、期待どおりに機能しません。

私の結果は常に全幅を使用しないテキストです。(オーバーラップは別の間違いですが、私は間違いなくそれを制御します)。

私が実際に欲しいもの:

回答

2 Asperi Dec 01 2020 at 23:33

これが可能なアプローチのデモです。Xcode 12.1 / iOS14.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)
            }
        )
    }
}