如何在SwiftUI的TextField中设置斜体样式的占位符文本?
解决方案
这里提供两种实现TextField占位符斜体样式的方案:
方法1:使用Prompt参数(兼容iOS 15+)
SwiftUI从iOS 15版本开始为TextField新增了prompt参数,支持直接传入自定义Text视图,你可以直接对该Text添加斜体修饰符即可实现需求,代码最简洁:
struct TextFieldItalics: View { @State private var username: String = "" var body: some View { VStack { Text("Hello, World!") .italic() TextField(text: $username, prompt: Text("Add username").italic()) { // 输入框标签无需设置可留空 } } } }
方法2:自定义占位符覆盖(全版本兼容)
如果需要兼容iOS 15以下的系统,可以通过ZStack叠加自定义占位文本的方式实现,同时该方案支持对占位符做更多自定义样式修改:
struct TextFieldItalics: View { @State private var username: String = "" var body: some View { VStack { Text("Hello, World!") .italic() ZStack(alignment: .leading) { // 输入内容为空时显示斜体占位文本 if username.isEmpty { Text("Add username") .italic() .foregroundColor(.secondary) } TextField("", text: $username) } } } }
效果预览:
内容的提问来源于stack exchange,提问作者Paul
相关产品推荐
相关产品推荐

