【问题标题】:SwiftUI Textfield - How to set the background Color for textfield in edit mode to clearSwiftUI Textfield - 如何在编辑模式下设置文本字段的背景颜色以清除
【发布时间】:2019-12-18 14:23:28
【问题描述】:

为了适应我的其他控件,我的 TextField 视图具有比文本本身更高的框架。

标准视图显示在带有自定义占位符的图像顶部。

当我点击 TextField 时,较小的文本区域本身具有灰色背景,如图底部所示。

如何将此文本背景设置为清晰的颜色?

struct TestView: View {
    
    @State var city: String
    @State var street: String
    
    var body: some View {
        VStack{
            ZStack(alignment: .center) {
                if city.isEmpty { Text("Bitte Namen eingeben")
                    .font(.system(size: 24, weight: .heavy, design: .default))
                    .foregroundColor(Color( red: 1.0, green: 0.0, blue: 0.0, opacity: 0.3))
                }
            TextField("", text: self.$city)
                .textFieldStyle(CustomTFStyle())
            }
            
            ZStack(alignment: .center) {
                if street.isEmpty { Text("Bitte Strasse eingeben")
                    .font(.system(size: 24, weight: .heavy, design: .default))
                    .foregroundColor(Color( red: 1.0, green: 0.0, blue: 0.0, opacity: 0.3))
                }
            TextField("", text: self.$street)
                .textFieldStyle(CustomTFStyle())
            }
        }
    }
}

public struct CustomTFStyle : TextFieldStyle {
    public func _body(configuration: TextField<Self._Label>) -> some View {
        configuration
            .accentColor(.black)
                .frame(width: 300, height: 70, alignment: .center)
                .border(Color.gray, width: 4)
             .font(.system(size: 30, weight: .heavy, design: .default))
            .clipShape(RoundedRectangle(cornerRadius: 12))
            .shadow(radius: 12)
            .foregroundColor(.black)
            
    }
}

【问题讨论】:

  • 嗨 Reiner,我刚刚测试了你的代码 - 但从未见过你的灰色背景......我该如何重现它?
  • 运行代码,点击其中一个文本字段并输入文本
  • 你测试的是哪个 iOS 版本?
  • 我假设您正在测试 13.2....在 13.0 和 13.3 中,灰色没有显示在您的示例中
  • 用 iOS 13.0 测试

标签: swiftui textfield


【解决方案1】:

"UIScrollView.appearance().backgroundColor = .lightGray" 在我的 rootview 的 init 方法中也会影响 Textfield 的行为。删除这一行就可以了。

【讨论】:

    【解决方案2】:

    无法重现此内容。尝试清理您的项目并退出/重新启动 Xcode。

    尝试将修饰符添加到您的CustomTFStyle

    .background(Color.clear)
    

    旁注: 您可能还需要考虑将AttributedString 分配为占位符,而不是在TextField 之上有条件地在ZStack 上添加一个单独的Text ?

    为此,您需要将UITextField 包装在UIViewRepresentable 中,并在makeUIView 方法中执行经典工作。

    【讨论】:

    • 我清理了项目,删除了派生数据文件夹并重新启动了 Xcode。我使用 Canvas、iphone11 和 IPAD Pro 模拟器以及在真实设备上对其进行了测试。一旦我单击文本字段,它就会显示灰色背景。我删除了 Textfieldstyle 并且行为仍然存在。我正在使用 Xcode 11.2.1 和 catalina 10.15.1。 @Jordan 我也考虑了旁注,但是因为我想习惯 swiftUi,所以我只在寻找 SwiftUI 解决方案。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-05-20
    • 2013-04-02
    • 2019-12-21
    • 2020-12-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多