ios How to add bottom border and side design to textfield

问题

I would like to add bottom border like as below image , I have added botom line successfully but i'm not getting side small lines

Here is my code

CALayer *border = [CALayer layer];
CGFloat borderWidth = 1;
border.borderColor = [UIColor lightGrayColor].CGColor;
border.frame = CGRectMake(0, textField.frame.size.height - borderWidth, textField.frame.size.width, textField.frame.size.height);
border.borderWidth = borderWidth;
[textField.layer addSublayer:border];
textField.layer.cornerRadius=30;
textField.layer.masksToBounds = YES;

回答1:

You need to add 3 layers (Bottom, Left and Right). Check below code.

CALayer *bottomBorder = [CALayer layer], *leftBorder = [CALayer layer], *rightBorder = [CALayer layer];

CGFloat thickness = 1.0f;
CGFloat side_height = 6.0f;

leftBorder.frame = CGRectMake(0, textField.frame.size.height - side_height, thickness, textField.frame.size.height - 1);
rightBorder.frame = CGRectMake(textField.frame.size.width - 1, textField.frame.size.height - side_height, thickness, textField.frame.size.height - 1);
bottomBorder.frame = CGRectMake(0, textField.frame.size.height-1, textField.frame.size.width, thickness);

bottomBorder.backgroundColor = [UIColor lightGrayColor].CGColor;
leftBorder.backgroundColor = [UIColor lightGrayColor].CGColor;
rightBorder.backgroundColor = [UIColor lightGrayColor].CGColor;

[textField.layer addSublayer:bottomBorder];
[textField.layer addSublayer:leftBorder];
[textField.layer addSublayer:rightBorder];

回答2:

i have just written class for border for UITextField and i hope it will help you.

class GUTextField: UITextField {

    public var bottomLineView:UIView?
    @IBInspectable var lineColor = UIColor.gray

    //MARK:- UiTextfield Draw Method Override
    override func draw(_ rect: CGRect) {
        super.draw(rect)
        self.frame = CGRect(x:self.frame.minX, y:self.frame.minY, width:rect.width, height:rect.height)
        addBottomLine()
    }

    //MARK:- ADD Bottom Line
    private func addBottomLine(){
        bottomLineView?.removeFromSuperview()
        bottomLineView = UIView(frame: CGRect(x:0, y:self.frame.height-1, width:self.frame.width, height:2))
        bottomLineView?.backgroundColor = lineColor;
        bottomLineView?.isHidden = true
        if bottomLineView != nil {
            self.addSubview(bottomLineView!)
        }
    }
}

来源：https://stackoverflow.com/questions/42350548/ios-how-to-add-bottom-border-and-side-design-to-textfield

标签

ios

objective-c

uitextfield