UITextField单击按钮时更改宽度

时间:2020-04-08 10:34:25

标签: swift xcode

我想在我的应用中创建一个搜索字段,我想知道是否有可能先使其不可见,然后单击按钮就可以使其显示,如下面视频中的放大镜一样

enter image description here

我尝试使UITextField的宽度开始为0,然后使按钮使宽度变大,但是我做错了,无法弄清楚。也许您可以在一个空白项目中举例并显示/链接代码?

希望您能提供帮助:)

2 个答案:

答案 0 :(得分:2)

UIView.animate(withDuration: 0.3, delay: 0, options: .curveEaseInOut, animations: {
        //change view width
    }) { (completed) in
        //you can use completion or you can delete I am using it like that
        self.searchTextview.becomeFirstResponder()
    }

我正在使用此视图。您可以根据需要进行更改。通过动画更改约束或宽度

答案 1 :(得分:1)

用于扩展SearchTextField的函数

  func setTextField(setExpand:Bool = false){

        self.txtfldSearch.delegate = self
        self.txtfldSearch.borderStyle = UITextField.BorderStyle.none
        self.txtfldSearch.translatesAutoresizingMaskIntoConstraints = true
        let bottomLine = CALayer()
        bottomLine.backgroundColor = UIColor.red.cgColor
        UIView.animate(withDuration: 0.5) {
          if setExpand{
                      self.txtfldSearch.frame = CGRect(x: 
                      self.viewContainer.frame.origin.x + 8, y: 
                      self.txtfldSearch.frame.origin.y, width: 
                      (self.btnSearch.frame.origin.x - 
                      (self.viewContainer.frame.origin.x + 16)), 
                       height: self.txtfldSearch.frame.size.height)
                       bottomLine.frame = CGRect(x: 0.0, y: 
                      self.txtfldSearch.frame.size.height-2, width: 
                      self.txtfldSearch.frame.size.width, height: 2.0)
            }
       else{
                    self.txtfldSearch.frame = CGRect(x: 
                    self.btnSearch.frame.origin.x - 8, 
                    y: self.txtfldSearch.frame.origin.y, width: 0, 
                    height:self.txtfldSearch.frame.size.height)
                    bottomLine.frame = CGRect(x: 0.0, y: 
                    self.txtfldSearch.frame.size.height-2, width: 
                    self.txtfldSearch.frame.size.width, height: 2.0)
            }  
      }    
    self.txtfldSearch.layer.addSublayer(bottomLine)

}

使用代码进行扩展传递true,其他情况传递false

  self.setTextField(setExpand: true)