SwiftUI圆角TextField设置前景色时背景与文字颜色冲突如何解决

问题原因 #

你当前代码的问题在于未给作为背景的RoundedRectangle单独指定填充色，它会默认继承上层的foregroundColor作为自身填充色，同时TextField的输入文本也会继承该foregroundColor，才会出现背景和文本颜色同步变更的问题。

解决方案 #

将背景色单独绑定到RoundedRectangle的fill属性上，foregroundColor仅用来指定输入文本的颜色即可，修正后的代码如下：

TextField("Message...", text: $chatViewModel.composedMessage)
          .frame(height: 30)
          .padding(10)
          // 单独给背景圆角设置填充色，不继承全局前景色
          .background(RoundedRectangle(cornerRadius: 20).fill(Color(red: 237/255, green: 237/255, blue: 237/255)))
          // 这里仅控制输入文本的颜色
          .foregroundColor(.black)

如果需要自定义光标颜色，可以额外添加.tint()修饰符配置；如果需要调整占位符文字颜色，iOS 15+ 可以配合placeholder修饰符自定义占位符视图实现。

内容的提问来源于stack exchange，提问作者Gurmukh Singh