設計iOS中隨系統鍵盤彈收和內容文字長度自適應高度的文本框

設計iOS中隨系統鍵盤彈收和內容文字長度自適應高度的文本框

    文本輸入框是多數與社交相關的app中不可或缺的一個控件，這些文本輸入框應該具有以下的功能：

1.在鍵盤爲彈起時，輸入框懸浮在界面底部。

2.當鍵盤彈起時，輸入框位置上移至鍵盤上方，而且動畫應與鍵盤同步。

3.當輸入的文字超出一行時，輸入框應想用的進行高度擴展。

4.當輸入框的高度達到某一極限值時，輸入框高度不該繼續擴展，文字區域應該支持滑動。

    使用autolayout佈局技術加上對鍵盤的相關監聽，能夠十分方便的實現上述效果。首先在xib文件中進行相關約束的添加，以下圖：

將須要的屬性與約束對象關聯到文件中：

//總體文本控件的高度
    @IBOutlet weak var textViewHeight: NSLayoutConstraint!
    //文本控件中的文字輸入控件UITestView的高度
    @IBOutlet weak var textFieldHeight: NSLayoutConstraint!
    //文本控件中文字輸入控件
    @IBOutlet weak var ourTextField: UITextView!
    //文本控件與父視圖底部的約束距離
    @IBOutlet weak var textViewBottom: NSLayoutConstraint!
    //文本控件
    @IBOutlet weak var ourTextView: UIView!

在初始化方法中進行通知的註冊和代理的設置：

    NSNotificationCenter.defaultCenter().addObserver(self, selector: Selector("keyboardWillShow:"), name: UIKeyboardWillShowNotification, object: nil)
    NSNotificationCenter.defaultCenter().addObserver(self, selector: Selector("keyboardWillHidden:"), name: UIKeyboardWillHideNotification, object: nil)
    ourTextField.delegate=self

實現通知的監聽方法以下：

 //鍵盤將要展現時觸發的方法
    func keyboardWillShow(noti:NSNotification){
        //獲取通知信息
        let info:Dictionary = noti.userInfo!
        //獲取信息中的鍵盤尺寸和位置信息
        let value:NSValue = info[UIKeyboardFrameBeginUserInfoKey] as! NSValue
        //獲取鍵盤動畫的時間信息
        let value2:NSValue = info[UIKeyboardAnimationDurationUserInfoKey] as! NSValue
        let keyboardSize = value.CGRectValue()
        let height = keyboardSize.height
        var time:NSTimeInterval=0
        value2.getValue(&time)
        //重設約束
        textViewBottom.constant = height
        //動畫展現
        UIView.animateWithDuration(time) { () -> Void in
            self.view.layoutIfNeeded()
        }
    }
    //鍵盤將要隱藏時觸發的方法
    func keyboardWillHidden(noti:NSNotification){
        let info:Dictionary = noti.userInfo!
        let value2:NSValue = info[UIKeyboardAnimationDurationUserInfoKey] as! NSValue
        var time:NSTimeInterval=0
        value2.getValue(&time)
        textViewBottom.constant = 0
        UIView.animateWithDuration(time) { () -> Void in
            self.view.layoutIfNeeded()
        }
    }

監聽的鍵盤狀態發送的通知中，會傳遞進來許多鍵盤信息，可取的鍵值以下：

@available(iOS 3.2, *)
public let UIKeyboardFrameBeginUserInfoKey: String //鍵盤的初始位置尺寸 爲CGRect類型的NSValue值
@available(iOS 3.2, *)
public let UIKeyboardFrameEndUserInfoKey: String // 鍵盤的末位位置尺寸 爲CGRect類型的NSValue值
@available(iOS 3.0, *)
public let UIKeyboardAnimationDurationUserInfoKey: String // 鍵盤動畫時間 double類型的NSValue
@available(iOS 3.0, *)
public let UIKeyboardAnimationCurveUserInfoKey: String // 鍵盤動畫效果 (UIViewAnimationCurve)枚舉類型的NSNumber值
@available(iOS 9.0, *)
public let UIKeyboardIsLocalUserInfoKey: String //與多任務相關 判斷鍵盤是否屬於當前應用 iOS9後可用

能夠監聽的與鍵盤相關信息的通知有以下幾種：

public let UIKeyboardWillShowNotification: String//鍵盤將要出現
public let UIKeyboardDidShowNotification: String//鍵盤已經出現
public let UIKeyboardWillHideNotification: String//鍵盤將要隱藏
public let UIKeyboardDidHideNotification: String//鍵盤已經隱藏
@available(iOS 5.0, *)
public let UIKeyboardWillChangeFrameNotification: String//鍵盤frame將要改變
@available(iOS 5.0, *)
public let UIKeyboardDidChangeFrameNotification: String//鍵盤frame已經改變

還須要實現當輸入框文字長度改變時的回調方法以下：

func textViewDidChange(textView: UITextView) {
        let height = textView.contentSize.height
        if height <= 37 {
            textFieldHeight.constant = 37
            textViewHeight.constant = 53
            UIView.animateWithDuration(0.3, animations: { () -> Void in
                self.view.layoutIfNeeded()
            })
            return
            //臨界值
        }else if height<100 {
            textFieldHeight.constant = height
            textViewHeight.constant = height+16
            UIView.animateWithDuration(0.3, animations: { () -> Void in
                self.view.layoutIfNeeded()
            })
        }else{
            textFieldHeight.constant = 100
            textViewHeight.constant = 116
            UIView.animateWithDuration(0.3, animations: { () -> Void in
                self.view.layoutIfNeeded()
            })
        }
    }

上面代碼是實現可自適應高度和位置的文本輸入框控件的核心代碼，效果圖下圖：

 

                 

專一技術，熱愛生活，交流技術，也作朋友。

——琿少 QQ羣：203317592