MacOS swiftUI 自定义 ui 带有圆边的 TextField 字段
MacOS swiftUI Custom ui TextField field with rounded edge
我在自定义 TextField 字段时遇到问题,我想尝试使两者的边框与第一张图片的边框相同:
- 边框颜色
- 边缘厚度尺寸
- 边缘圆化类型
有人可以给我建议吗?
我想达到的结果:
我得到的结果:
HStack(alignment: .center) {
Spacer()
TextField("Git Repository URL", text: $repoUrlStr)
.textFieldStyle(PlainTextFieldStyle())
.lineLimit(1)
.frame(width: 300)
.onAppear {
let url = "https://github.com/name/name"
if isValid(url: url) == true {
print("ok", url)
}
}
Button {
if !repoUrlStr.isEmpty {
self.repoUrlStr = ""
}
} label: {
Image(systemName: "xmark.circle.fill")
.padding(.trailing, 2)
.font(.system(size: 12))
}
.buttonStyle(PlainButtonStyle())
.opacity(repoUrlStr.isEmpty ? 0 : 1)
Spacer()
}
.padding([.top, .bottom], 4)
.border(Color.gray, width: 2)
.cornerRadius(3)
.padding(.bottom, 15)
尝试在背景中使用圆角矩形(带有所需的参数,如角半径、颜色等)而不是边框,例如
.background(
RoundedRectangle(cornerRadius: 8)
.stroke(your_color_here)
)
我在自定义 TextField 字段时遇到问题,我想尝试使两者的边框与第一张图片的边框相同:
- 边框颜色
- 边缘厚度尺寸
- 边缘圆化类型
有人可以给我建议吗?
我想达到的结果:
我得到的结果:
HStack(alignment: .center) {
Spacer()
TextField("Git Repository URL", text: $repoUrlStr)
.textFieldStyle(PlainTextFieldStyle())
.lineLimit(1)
.frame(width: 300)
.onAppear {
let url = "https://github.com/name/name"
if isValid(url: url) == true {
print("ok", url)
}
}
Button {
if !repoUrlStr.isEmpty {
self.repoUrlStr = ""
}
} label: {
Image(systemName: "xmark.circle.fill")
.padding(.trailing, 2)
.font(.system(size: 12))
}
.buttonStyle(PlainButtonStyle())
.opacity(repoUrlStr.isEmpty ? 0 : 1)
Spacer()
}
.padding([.top, .bottom], 4)
.border(Color.gray, width: 2)
.cornerRadius(3)
.padding(.bottom, 15)
尝试在背景中使用圆角矩形(带有所需的参数,如角半径、颜色等)而不是边框,例如
.background(
RoundedRectangle(cornerRadius: 8)
.stroke(your_color_here)
)