CODEWITHSUNDEEP
iosiphoneswiftuitextfielduikit
hoan
hoan

Reputation: 1406

UITextField Standard Style programmatically

When I create a UITextField using storyboard, it looks like the image below. However, when I create a UITextField programmatically it has absolutely no style. I know that I can apply custom styles to the text field, but is there an easy way to get this standard style when creating the text field programmatically?

UITextField

Upvotes: 2

Views: 2720

Answers (3)

icaksama
icaksama

Reputation: 782

You can add borderStyle as .roundedRect and use White background. Something like this:

class MyCustmUITextField: UITextField { 
    override init(frame: CGRect) {
        super.init(frame: frame)
        self.borderStyle = .roundedRect
        self.backgroundColor = .white
    } 
}

Upvotes: 2

Anters Bear
Anters Bear

Reputation: 1956

Something like this:

let t = UITextField()
t.frame = CGRect(x: 10, y: 20, width: self.view.frame.width - 20, height: 40)
t.layer.cornerRadius = 5
t.layer.borderColor = UIColor.lightGray.cgColor
t.layer.borderWidth = 1
t.leftView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: t.frame.height))
t.leftViewMode = .always
t.rightView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: t.frame.height))
t.rightViewMode = .always
t.clearButtonMode = .whileEditing
self.view.addSubview(t)

EDIT:

Add this class below somewhere such that it is easily / globally accessible.

class StyledTextField: UITextField { 
    override init(frame: CGRect) {
        super.init(frame: frame)
        self.layer.cornerRadius = 5
        self.layer.borderColor = UIColor.lightGray.cgColor
        self.layer.borderWidth = 1
        self.leftView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: t.frame.height))
        self.leftViewMode = .always
        self.rightView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: t.frame.height))
        self.rightViewMode = .always
        self.clearButtonMode = .whileEditing
    }
}

Then you can call this UITextField from where ever you want as follows

let t = StyledTextField()
t.frame = CGRect(x: 10, y: 20, width: self.view.frame.width - 20, height: 40)
self.view.addSubview(t)

EDIT 2:

Use UIEdgeInsets to get padding on all four sides.

class StyledTextField: UITextField { 
    let insetConstant = UIEdgeInsets(top: 4, left: 10, bottom: 4, right: 10)

    override func textRect(forBounds bounds: CGRect) -> CGRect {
        return UIEdgeInsetsInsetRect(bounds, insetConstant)
    }

    override func editingRect(forBounds bounds: CGRect) -> CGRect {
        return UIEdgeInsetsInsetRect(bounds, insetConstant)
    }

    override func placeholderRect(forBounds bounds: CGRect) -> CGRect {
        return UIEdgeInsetsInsetRect(bounds, insetConstant)
    }

    override init(frame: CGRect) {
        super.init(frame: frame)

        self.layer.cornerRadius = 5
        self.layer.borderColor = UIColor(white: 2/3, alpha: 0.5).cgColor
        self.layer.borderWidth = 1
        self.clearButtonMode = .whileEditing
        self.keyboardType = UIKeyboardType.decimalPad
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

Upvotes: 2

Ahmed AbdAlfattah
Ahmed AbdAlfattah

Reputation: 73

You can create a subclass from UITextField to serve as your custom text field. Following this, you need only to instantiate your custom class and then you're good to go. Something like this:

class MyCustmUITextField: UITextField { 
    override init(frame: CGRect) {
        super.init(frame: frame)
        self.layer.cornerRadius = 5
        self.layer.borderColor = UIColor.black
        self.font = UIFont.systemFont(ofSize: 20)
        self.adjustsFontSizeToFitWidth = true
        // then add whatever styles you wish
    } 
}

From there all you need is to create a new instance of MyCustomUITextField

Upvotes: 1

Related Questions