使用swift 2仅使用顶部和底部边框的文本字段
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了使用swift 2仅使用顶部和底部边框的文本字段相关的知识,希望对你有一定的参考价值。
我有一个忘记密码的页面。它只有一个文本字段,要求用户填写他们的电子邮件地址。 Designer仅设计了带有顶部和底部边框的文本字段。我尝试从这里UITextField Only Top And Bottom Border回答,但在结果中它只显示文本字段的底部边框。
就像在图像中我想为顶部和底部创建一个灰色边框
要删除具有视图的战斗,您可以使用包含TextField的静态单元格创建tableView。 Voila完成了...顶部和底部边框免费提供,你将使用标准的苹果东西:)
如果您真的想要绘制图层而不是按照链接问题上的步骤绘制:
CALayer *topBorder = [CALayer layer];
topBorder.frame = CGRectMake(0, 0, self.frame.size.width, 1);
topBorder.backgroundColor = [UIColor blackColor].CGColor;
[myTextField.layer addSublayer:topBorder];
CALayer *bottomBorder = [CALayer layer];
bottomBorder.frame = CGRectMake(0, self.frame.size.height - 1, self.frame.size.width, 1);
bottomBorder.backgroundColor = [UIColor blackColor].CGColor;
[myTextField.layer addSublayer:bottomBorder];
在Swift中:
let topBorder = CALayer()
topBorder.frame = CGRectMake(0, 0, bounds.size.width, 1)
topBorder.backgroundColor = UIColor.grayColor()
textField.layer.addSublayer(topBorder)
let bottomBorder = CALayer()
bottomBorder.frame = CGRectMake(0, bounds.size.height-1, bounds.size.width, 1)
bottomBorder.backgroundColor = UIColor.grayColor()
textField.layer.addSublayer(bottomBorder)
感谢@El Captain对@Bjorn Ro的宝贵评论和很好的回答,即使它是在Objective-c我认为。我对这个问题的回答是(我正在使用swift 2 Xcode 7)
覆盖swift文件中的函数viewDidLayoutSubviews()。而代码也是如此
override func viewDidLayoutSubviews() {
// Creates the bottom border
let borderBottom = CALayer()
let borderWidth = CGFloat(2.0)
borderBottom.borderColor = UIColor.grayColor().CGColor
borderBottom.frame = CGRect(x: 0, y: forgotPasswordEmailText.frame.height - 1.0, width: forgotPasswordEmailText.frame.width , height: forgotPasswordEmailText.frame.height - 1.0)
borderBottom.borderWidth = borderWidth
forgotPasswordEmailText.layer.addSublayer(borderBottom)
forgotPasswordEmailText.layer.masksToBounds = true
// Creates the Top border
let borderTop = CALayer()
borderTop.borderColor = UIColor.grayColor().CGColor
borderTop.frame = CGRect(x: 0, y: 0, width: forgotPasswordEmailText.frame.width, height: 1)
borderTop.borderWidth = borderWidth
forgotPasswordEmailText.layer.addSublayer(borderTop)
forgotPasswordEmailText.layer.masksToBounds = true
}
forgotPasswordEmailText是用于输入电子邮件的文本字段
最终输出看起来像这样......带有灰色边框(iPhone 4s模拟器的屏幕截图)
到目前为止发布的程序化解决方案的好建议。但我想我会分享一个Interface Builder解决方案....
1)在视图控制器中创建视图集合
@IBOutlet private var borderViews: [UIView]?
2)在界面构建器1px中创建2个UIViews高约束到文本字段周围的所需位置
3)将界面构建器中的2个视图连接到borderViews IBOutlet
4)使用setValue forKeyPath自定义两个视图的外观...例如,成功时您可能希望边框变为绿色
setValue(UIColor.green, forKeyPath: "borderViews.backgroundColor")
在Swift 3中使用扩展:
- 创建Swift文件
import UIKit extension UITextField { func setBottomBorder() { self.borderStyle = .none self.layer.backgroundColor = UIColor.white.cgColor self.layer.masksToBounds = false self.layer.shadowColor = UIColor.gray.cgColor self.layer.shadowOffset = CGSize(width: 0.0, height: 1.0) self.layer.shadowOpacity = 1.0 self.layer.shadowRadius = 0.0 } }
- 随时随地打电话:
PasswordField.setBottomBorder();
这是一个很好的,简单的Swift 4实现,可以处理调整视图的大小:)
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
viewToShadow.backgroundColor = .white
viewToShadow.layer.masksToBounds = false
viewToShadow.layer.sublayers?
.filter { layer -> Bool in
return layer.backgroundColor == UIColor.almostBlack.alpha(0.5).cgColor
}
.forEach { layer in
layer.removeFromSuperlayer()
}
[CGRect(x: 0.0, y: 0.0, width: viewToShadow.bounds.width, height: 0.5),
CGRect(x: 0.0, y: viewToShadow.bounds.height, width: viewToShadow.bounds.width, height: 0.5)]
.forEach { frame in
let layer = CALayer()
layer.frame = frame
layer.backgroundColor = UIColor.almostBlack.alpha(0.5).cgColor
viewToShadow.layer.addSublayer(layer)
}
}
使用方便的扩展
extension UITextField {
func addTopBorder(){
let bottomLine = CALayer()
bottomLine.frame = CGRect.init(x: 0, y: 0, width: self.frame.size.width, height: 1)
bottomLine.backgroundColor = UIColor.white.cgColor
self.borderStyle = UITextField.BorderStyle.none
self.layer.addSublayer(bottomLine)
}
func addBottomBorder(){
let bottomLine = CALayer()
bottomLine.frame = CGRect.init(x: 0, y: self.frame.size.height - 1, width: self.frame.size.width, height: 1)
bottomLine.backgroundColor = UIColor.white.cgColor
self.attributedPlaceholder = NSAttributedString(string: self.placeholder ?? "-", attributes: [NSAttributedString.Key.foregroundColor : #colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)])
self.borderStyle = UITextField.BorderStyle.none
self.layer.addSublayer(bottomLine)
}
}
像这样在你的控制器中使用它
yourTextfield.addTopBorder()
yourTextfield.addBottomBorder()
并且不要忘记在主线程上使用它
DispatchQueue.main.async {
self.yourTextfield.addTopBorder()
self.yourTextfield.addBottomBorder()
}
以上是关于使用swift 2仅使用顶部和底部边框的文本字段的主要内容,如果未能解决你的问题,请参考以下文章