返回 导航

Swift

hangge.com

Swift - 在数字键盘上添加自定义按钮(增加return键)

作者:hangge | 2017-08-22 08:10
我们知道设备的虚拟键盘不管使用的是纯数字键盘(numberPad),还是带小数点的数字键盘(decimalPad),它们默认是都不带 return 键的。
          

但这样有时可能会造成一些麻烦,比如我们输入完内容后没法点击 return 键将键盘收起来。或者输入完内容后,也没法点击 done 键直接进行搜索等操作。
本文演示如何在系统的虚拟数字键盘上添加自定义按钮。

方法一:在键盘的顶部添加一个 toolbar

1,实现方法

(1)我们通过 textField inputAccessoryView 属性,先在虚拟键盘的上方添加一个 UIToolbar
(2)然后在这个 UIToolbar 内添加我们需要的按钮(returndone 等),个数随意。  

2,效果图

(1)可以看到键盘弹出后,顶部会增加一个工具栏,其中有个“完成”按钮。
(2)点击“完成”按钮会收起键盘,并在控制台中将输入的内容打印出来。

3,样例代码

import UIKit

class ViewController: UIViewController,UITextFieldDelegate {
    
    var textField:UITextField!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        //创建并添加一个 UITextField
        textField = UITextField(frame: CGRect(x:20,y:90,width:200,height:30))
        //设置边框样式为圆角矩形
        textField.borderStyle = UITextBorderStyle.roundedRect
        //带小数点的数字键盘
        textField.keyboardType = UIKeyboardType.decimalPad
        self.view.addSubview(textField)
        
        //在键盘上添加“完成“按钮
        addDoneButtonOnKeyboard()
    }
    
    //在键盘上添加“完成“按钮
    func addDoneButtonOnKeyboard() {
        let doneToolbar = UIToolbar()
        
        //左侧的空隙
        let flexSpace = UIBarButtonItem(barButtonSystemItem: .flexibleSpace,
                                        target: nil, action: nil)
        //右侧的完成按钮
        let done: UIBarButtonItem = UIBarButtonItem(title: "完成", style: .done,
                                                    target: self,
                                                    action: #selector(doneButtonAction))
        
        var items:[UIBarButtonItem] = []
        items.append(flexSpace)
        items.append(done)
        
        doneToolbar.items = items
        doneToolbar.sizeToFit()
        
        self.textField.inputAccessoryView = doneToolbar
    }
    
    //“完成“按钮点击响应
    func doneButtonAction() {
        //收起键盘
        self.textField.resignFirstResponder()
        print("您输入的是:\(textField.text!)")
    }
}

方法二:直接在键盘上添加一个按钮

1,实现方法

(1)我们可以发现纯数字键盘(numberPad)左下角刚好有一个空闲的位置,那么可以将自定义按钮添加到这个位置上。
(2)要实现这个功能,我们首先要监听键盘出现的事件。在键盘出现后找到键盘的窗体,然后将我们自定义按钮添加到窗体中即可。
(3)要注意的是自定义按钮的位置,同时在其出现时还要添加个动画效果,确保自定义按钮能同键盘一起向上弹出显示。

2,效果图

(1)可以看到键盘弹出后,左下角多了个“完成”按钮。
(2)点击“完成”按钮便会收起键盘,并在控制台中将输入的内容打印出来。

3,样例代码

import UIKit

class ViewController: UIViewController,UITextFieldDelegate {
    
    var textField:UITextField!
    
    var doneButton:UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        //创建并添加一个 UITextField
        textField = UITextField(frame: CGRect(x:20,y:90,width:200,height:30))
        //设置边框样式为圆角矩形
        textField.borderStyle = UITextBorderStyle.roundedRect
        //带小数点的数字键盘
        textField.keyboardType = UIKeyboardType.numberPad
        self.view.addSubview(textField)

        
        //创建要添加到键盘上的“完成”按钮
        doneButton = UIButton()
        doneButton.setTitle("完成", for: UIControlState())
        doneButton.setTitleColor(UIColor.black, for: UIControlState())
        doneButton.frame = CGRect(x: 0, y: 0, width: 106, height: 53)
        doneButton.adjustsImageWhenHighlighted = false
        doneButton.addTarget(self, action: #selector(doneButtonAction), for: .touchUpInside)
        
        //监听键盘弹出通知
        NotificationCenter.default
            .addObserver(self,selector: #selector(keyboardWillShow(_:)),
                         name: NSNotification.Name.UIKeyboardWillShow, object: nil)
        
        //监听键盘隐藏通知
        NotificationCenter.default
            .addObserver(self,selector: #selector(keyboardWillHide(_:)),
                         name: NSNotification.Name.UIKeyboardWillHide, object: nil)
    }
    
    //键盘显示
    func keyboardWillShow(_ note : Notification) -> Void{
        DispatchQueue.main.async { () -> Void in
            //找到键盘的window
            let keyBoardWindow = UIApplication.shared.windows.last
            //将“完成”按钮添加到键盘的window中
            keyBoardWindow?.addSubview(self.doneButton)
            keyBoardWindow?.bringSubview(toFront: self.doneButton)
            
            //显示“完成”按钮
            self.doneButton.isHidden = false
            //计算“完成”按钮最终要显示的y坐标
            let doneButtonY = (keyBoardWindow?.frame.size.height)! - 53
            
            if let userInfo = note.userInfo,
                let value = userInfo[UIKeyboardFrameEndUserInfoKey] as? NSValue,
                let duration = userInfo[UIKeyboardAnimationDurationUserInfoKey] as? Double,
                let curve = userInfo[UIKeyboardAnimationCurveUserInfoKey] as? UInt {
                
                let frame = value.cgRectValue
                //获取虚拟键盘实际的位置和尺寸
                let intersection = frame.intersection(self.view.frame)
                
                //设置“完成”按钮最开始的y坐标
                self.doneButton.frame.origin.y = doneButtonY + intersection.height
                
                //让“完成”按钮跟随键盘出现动画移动到最终的位置
                UIView.animate(withDuration: duration, delay: 0.0,
                               options: UIViewAnimationOptions(rawValue: curve),
                               animations: { _ in
                                self.doneButton.frame.origin.y = doneButtonY
                }, completion: nil)
            }
        }
    }
    
    //键盘隐藏
    func keyboardWillHide(_ notification: Notification) {
        //隐藏“完成”按钮
        self.doneButton.isHidden = true
    }
    
    //“完成“按钮点击响应
    func doneButtonAction() {
        //收起键盘
        self.textField.resignFirstResponder()
        print("您输入的是:\(textField.text!)")
    }
}
评论

全部评论(4)

回到顶部