swift 文本编辑器上不显示占位符文本

2w3rbyxf  于 2023-05-16  发布在  Swift
关注(0)|答案(2)|浏览(205)

试图创建一个界面,用户可以写一串文本,在屏幕上环绕。
我创建了一个名为“TextArea”的SwiftUI页面,当我需要它时,我可以在另一个页面上调用它。因为TextEditor不能放置占位符文本。我需要创建一个,这是我从其他用户那里得到的代码。

import SwiftUI
import UIKit

struct TextArea: View {
    @Binding var text: String
    let placeholder: String
    
    init(_ placeholder: String, text: Binding<String>) {
        self.placeholder = placeholder
        self._text = text
        UITextView.appearance().backgroundColor = .clear
    }
    
    var body: some View {
        ZStack(alignment: .topLeading) {
            
            if text.isEmpty {
                Text(placeholder)
                    .foregroundColor(Color(.placeholderText))
                    .padding(.horizontal, 8)
                    .padding(.vertical, 12)
            }
            
            TextEditor(text: $text)
                .padding(4)
        }
        .font(.body)
    }
}

然后在另一个SwiftUI页面上,我用这段代码调用它。

TextArea("What's Happening", text: $caption)

在那一页的顶部我建立了它

@State private var caption = ""

代码编译时没有错误,在模拟器中也没有生成问题。当我运行应用程序时,没有占位符文本。TextEditor工作正常,符合预期。唯一缺少的是占位符文本。
先谢谢你了!

hmtdttj4

hmtdttj41#

ZStack从下往上放置视图。
以便交换占位符视图和TextEditor。

struct TextArea: View {
    @Binding var text: String
    let placeholder: String
    
    init(_ placeholder: String, text: Binding<String>) {
        self.placeholder = placeholder
        self._text = text
        UITextView.appearance().backgroundColor = .clear
    }
    
    var body: some View {
        ZStack(alignment: .topLeading) {
            TextEditor(text: $text) // <= Here
                .padding(4)
            
            if text.isEmpty {
                Text(placeholder)
                    .foregroundColor(Color(.placeholderText))
                    .padding(.horizontal, 8)
                    .padding(.vertical, 12)
            }
        }
        .font(.body)
    }
}
b09cbbtk

b09cbbtk2#

如果我们去掉init(),代码可能会更清晰一些,因为占位符将在交换视图后覆盖TextEditor,并且我们不需要担心后台UITextView(它是TextEditor的一部分)。

struct TextArea: View {
    @Binding var text: String
    let placeholder: String
    
    init(_ placeholder: String, text: Binding<String>) {
        self.placeholder = placeholder
        self._text = text
        UITextView.appearance().backgroundColor = .clear
    }
    
    var body: some View {
        ZStack(alignment: .topLeading) {
            TextEditor(text: $text)
                .padding(4)
            
            if text.isEmpty {
                Text(placeholder)
                    .foregroundColor(Color(.placeholderText))
                    .padding(.horizontal, 8)
                    .padding(.vertical, 12)
            }
        }
        .font(.body)
    }
}

相关问题