如何创建带下划线的UITextField

时间:2015-06-08 05:16:28

标签: ios swift storyboard uitextfield

iOS noob

当我向ViewController添加默认UITextField时,它看起来像这样:

enter image description here

我的设计师希望我让UITextField看起来像这样(即背景是透明的,只有一个下划线:

enter image description here

我该怎么做?应该要求我的设计师将图像设置为UITextField的背景。图像应该是什么样的?如果图像是=蓝色背景+下划线(减去我猜的数字)

是吗?

更新: 基于下面的方向(来自@Ashish Kakkad),将此代码添加到Swift中以查看ViewDidLoad:

    var bottomLine = CALayer()
    bottomLine.frame = CGRectMake(0.0, view.frame.height - 1, view.frame.width, 1.0)
    bottomLine.backgroundColor = UIColor.whiteColor().CGColor
    tf_editPassword.borderStyle = UITextBorderStyle.None
    tf_editPassword.layer.addSublayer(bottomLine)

这几乎可行,但问题是所有边框都消失了,我只想留下底线。

5 个答案:

答案 0 :(得分:10)

试试这段代码:

的OBJ-C

CALayer *bottomLine = [CALayer layer];
bottomLine.frame = CGRectMake(0.0f, self.frame.size.height - 1, self.frame.size.width, 1.0f);
bottomLine.backgroundColor = [UIColor whiteColor].CGColor;
[myTextField setBorderStyle:UITextBorderStyleNone];
[myTextField.layer addSublayer:bottomLine];

夫特

var bottomLine = CALayer()
bottomLine.frame = CGRectMake(0.0, view.frame.height - 1, view.frame.width, 1.0)
bottomLine.backgroundColor = UIColor.whiteColor().CGColor
myTextField.borderStyle = UITextBorderStyle.None
myTextField.layer.addSublayer(bottomLine)

希望有所帮助

如果您使用自动布局,请尝试在viewDidLayoutSubviews方法中执行此代码。

答案 1 :(得分:4)

@Ashish Kakkad发布了正确的代码,但它可能不适用于@ user1406716的原因是因为当文本字段中没有文本时,框架的高度和宽度为0,所以您可以尝试以下操作:

Obj-C:

Workout
斯威夫特:

CALayer *bottomLine = [CALayer layer];
bottomLine.frame = CGRectMake(0.0f, 75 - 1, 300, 1.0f);
bottomLine.backgroundColor = [UIColor whiteColor].CGColor;
[myTextField setBorderStyle:UITextBorderStyleNone];
[myTextField.layer addSublayer:bottomLine];

即使文本字段中没有文本,也可以确保该行可见。

答案 2 :(得分:3)

将此扩展用于UITextField

extension UITextField {

    func setUnderLine() {
        let border = CALayer()
        let width = CGFloat(0.5)
        border.borderColor = UIColor.darkGray.cgColor
        border.frame = CGRect(x: 0, y: self.frame.size.height - width, width:  self.frame.size.width - 10, height: self.frame.size.height)
        border.borderWidth = width
        self.layer.addSublayer(border)
        self.layer.masksToBounds = true
    }

}

ViewDidLoad()中调用上述函数,并在文本字段上显示下划线。

myTextField.setUnderLine()

答案 3 :(得分:1)

使用Swift 3更新此内容:

let bottomLine = CALayer()
bottomLine.frame = CGRect(origin: CGPoint(x: 0, y:first.frame.height - 1), size: CGSize(width: first.frame.width, height:  1))
bottomLine.backgroundColor = UIColor.white.cgColor
first.borderStyle = UITextBorderStyle.none
first.layer.addSublayer(bottomLine)

答案 4 :(得分:0)

删除边框并添加下划线 - Swift 5:

lock