如何将下划线边框添加到UITextField当它是ScrollView的子视图时

时间:2016-11-25 19:41:46

标签: ios swift uiscrollview uitextfield subview

我正在尝试以编程方式为UITextfield创建下划线边框,因为它是我在使用Swift构建的iOS应用中的UIScrollView的子视图。我已经设法实现了这一点,但只有当UITextfield是视图的子视图时,我的应用程序的以下屏幕截图显示。

UITextfield with an Underline Border

现在我希望UITextField成为同一视图中UIScrollView的子视图,但下划线边框不会显示。

我通过在viewDidLayoutSubviews方法中创建CALayer,成功设法在上面的屏幕截图中创建下划线边框,如下所示。

    let usernameTextField = UITextField()

    override func viewDidLoad() {
        usernameTextField.translatesAutoresizingMaskIntoConstraints = false
        view.addSubview(usernameTextField)
        let constraints: [NSLayoutConstraint] = [
        usernameTextField.topAnchor.constraint(equalTo: topLayoutGuide.bottomAnchor, constant: 20),
        usernameTextField.leadingAnchor.constraint(equalTo: view.layoutMarginsGuide.leadingAnchor),
        usernameTextField.trailingAnchor.constraint(equalTo: view.layoutMarginsGuide.trailingAnchor)
        ]
        NSLayoutConstraint.activate(constraints)
    }

    override func viewDidLayoutSubviews() {
            let textField = usernameTextField
            let border = CALayer()
            let width = CGFloat(1.0)
            border.borderColor = UIColor(red:0.61, green:0.61, blue:0.61, alpha:1.0).cgColor
            border.frame = CGRect(x: 0, y: textField.frame.size.height - width, width:  textField.frame.size.width, height: textField.frame.size.height)

            border.borderWidth = width

            textField.layer.addSublayer(border)

            textField.layer.masksToBounds = true

    } 

但是当UITextField是UIScrollView的子视图时,这不会起作用。这就是我的尝试:

    let usernameTextField = UITextField()
    let scrollView = UIScrollView()

override func viewDidLoad() {
    usernameTextField.translatesAutoresizingMaskIntoConstraints = false
    scrollView.translatesAutoresizingMaskIntoConstraints = false
    scrollView.addSubview(usernameTextField)
    view.addSubview(scrollView)
    let scrollViewConstraints: [NSLayoutConstraint] = [
        scrollView.topAnchor.constraint(equalTo: topLayoutGuide.bottomAnchor),
        scrollView.leadingAnchor.constraint(equalTo: view.layoutMarginsGuide.leadingAnchor),
        scrollView.trailingAnchor.constraint(equalTo: view.layoutMarginsGuide.trailingAnchor),
        scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -20)
    ]

    NSLayoutConstraint.activate(scrollViewConstraints)
    let constraints: [NSLayoutConstraint] = [
    usernameTextField.topAnchor.constraint(equalTo: scrollView.topAnchor, constant: 20),
        usernameTextField.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
        usernameTextField.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor) 
    ]
    NSLayoutConstraint.activate(constraints)
  }

   override func viewDidLayoutSubviews() {
        let textField = usernameTextField
        let border = CALayer()
        let width = CGFloat(1.0)
        border.borderColor = UIColor(red:0.61, green:0.61, blue:0.61, alpha:1.0).cgColor
        border.frame = CGRect(x: 0, y: textField.frame.size.height - width, width:  textField.frame.size.width, height: textField.frame.size.height)

        border.borderWidth = width

        textField.layer.addSublayer(border)

        textField.layer.masksToBounds = true

} 

当UITextField是同一视图中UIScrollView的子视图时,是否有人建议使用此方法?

修改

我接受了马蒂亚斯'回答他建议我将UIView作为边框而不是SubLayer进行SubView。

    let border = UIView()
    border.backgroundColor =UIColor(red:0.61, green:0.61, blue:0.61, alpha:1.0)
            border.translatesAutoresizingMaskIntoConstraints = false

    textField.addSubview(border)

        border.heightAnchor.constraint(equalToConstant: 1).isActive = true
        border.widthAnchor.constraint(equalTo:textField.widthAnchor).isActive = true
        border.bottomAnchor.constraint(equalTo: textField.bottomAnchor, constant: -1).isActive = true
        border.leftAnchor.constraint(equalTo: textField.leftAnchor).isActive = true 

这回答了这个问题,但仅仅是好奇心,我很感激任何能够解释是否有可能通过SubLayer实现相同目标的人。

1 个答案:

答案 0 :(得分:0)

不要添加subLayer,只需添加子视图:)

    let border = UIView()
border.backgroundColor =UIColor(red:0.61, green:0.61, blue:0.61, alpha:1.0)
                border.translatesAutoresizingMaskIntoConstraints = false

textField.addSubview(border)

            border.heightAnchor.constraint(equalToConstant: 1).isActive = true
            border.widthAnchor.constraint(equalTo:textField.widthAnchor).isActive = true
            border.bottomAnchor.constraint(equalTo: textField.bottomAnchor, constant: -1).isActive = true
            border.leftAnchor.constraint(equalTo: textField.leftAnchor).isActive = true