簡體   English   中英

SwiftUI中的TextEditor定位

[英]TextEditor positioning in SwiftUI

我添加了一個文本編輯器,但無法將其 position 居中,文本編輯器已向右移動,如圖所示。 抱歉,我剛剛注意到整個頁面都向右移動了。 我不知道我做錯了什么。 你可以解決這個問題。 我希望它站在中間。

在此處輸入圖像描述

struct TextSend: View {
    
    @State private var inputText = ""
    
    var body: some View {
        GeometryReader { geometry in
            VStack {
                HStack {
                    Text("Picture")
                        .font(.system(size: 60))
                        .frame(width: geometry.size.width, height: geometry.size.height / 10)
                        .foregroundColor(.init(red: 45 / 255, green: 0 / 255, blue: 112 / 255))
                    Spacer().frame(height: geometry.size.height / 5)
                }

                VStack {
                    Text("Hi").frame(width: geometry.size.width, height: geometry.size.height / 10)
                }
                
                
                HStack {
                    ForEach(0 ..< 3) { _ in
                        CircleView()
                            .frame(width: geometry.size.width / 5, height: geometry.size.height / 10)
                            .shadow(radius: 10)
                    }
                }
                VStack {
                    
                TextEditor(text: $inputText) .frame(width: geometry.size.width, height:geometry.size.height / 3) .overlay(RoundedRectangle(cornerRadius: 30).stroke(Color.init( red: 45/255, green: 0/255, blue: 112/255), lineWidth: 1)).lineSpacing(10)
                    .autocapitalization(.words)
                    .disableAutocorrection(true)
                    .padding()
                }
                Spacer().frame(height: geometry.size.height / 15)
                VStack {
                    Button(action: {}, label: {
                        Text("Gönder")
                            .frame(width: geometry.size.width / 3, height: 50)
                            .padding(10)
                            .font(Font.system(size: 30, weight: .medium, design: .serif))
                            .foregroundColor(.white)
                            .background(RoundedRectangle(cornerRadius: 30))
                            .foregroundColor(.init(red: 45 / 255, green: 0 / 255, blue: 112 / 255))

                    })
                }
            }
        }
    }
}

從所有使用的地方刪除frame(width: geometry.size.width ,因為這樣的硬編碼會破壞布局。嘗試始終僅將geometry用於可計算的值。

這是固定部件(使用 Xcode 12.1 / iOS 14.1 測試)

演示

    HStack {
        Text("Picture")
            .font(.system(size: 60))
            .frame(height: geometry.size.height / 10)    // << !!
            .foregroundColor(.init(red: 45 / 255, green: 0 / 255, blue: 112 / 255))
        Spacer().frame(height: geometry.size.height / 5)
    }

    VStack {
        Text("Hi").frame(height: geometry.size.height / 10)   // << !!
    }
    
    
    // ... other code

    VStack {
        
    TextEditor(text: $inputText)
       .frame(height:geometry.size.height / 3)      // << !!
       .overlay(RoundedRectangle(cornerRadius: 30).stroke(Color.init( red: 45/255, green: 0/255, blue: 112/255), lineWidth: 1)).lineSpacing(10)
        .autocapitalization(.words)
        .disableAutocorrection(true)
        .padding()
    }

您需要在GeometryReader中為您的第一個孩子添加frame ,在您的情況下是VStack

VStack{
}.frame(width:geometry.size.width , height: geometry.size.height)

ps:你可以這樣做: geometry.size.width - 10例如,用於填充目的

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM