美文网首页
iOS ScrollView中的textFiled解决键盘遮挡

iOS ScrollView中的textFiled解决键盘遮挡

作者: Noah牛YY | 来源:发表于2015-12-19 18:54 被阅读2259次

关于iOS TextFiled的详细使用请看:iOS TextFiled

本文中scrollView的布局请看:scrollView的布局

点击视图收起键盘

给Content View新建contentView类,继承UIView类,实现收起键盘的功能

class contentView: UIView {
    //点击收回键盘
    override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
        self.endEditing(true)
    }
}

绑定Content View和contentView类

解决键盘的遮挡问题

给viewControllor添加监听事件

// 监听键盘弹出事件
NSNotificationCenter.defaultCenter().addObserver(self, selector: "onKeyboardWillShowFrame:", name: UIKeyboardWillShowNotification, object: nil)
// 监听键盘隐藏事件
NSNotificationCenter.defaultCenter().addObserver(self, selector: "onKeyboardWillHideFrame:", name: UIKeyboardWillHideNotification, object: nil)

实现键盘出现的事件

func onKeyboardWillShowFrame(notification: NSNotification) {
        // 1、将通知中的数据转换成NSDictionary 
        let dict = NSDictionary(dictionary: notification.userInfo!)
        // 2、获取键盘最后的Frame值 
        let keyboardFrame = dict[UIKeyboardFrameEndUserInfoKey]!.CGRectValue
        // 4、获取键盘弹出动画事件
        let duration = dict[UIKeyboardAnimationDurationUserInfoKey] as! Double
        UIView.animateWithDuration(duration, animations: { () -> Void in
        // 5、设置整个屏幕随键盘移动
        //下面的方法是将视图整个上移ty的距离
//        self.scrollView.transform = CGAffineTransformMakeTranslation(0, ty)
        //判断输入的是哪个框
            var textClicked: UITextField!
            if self.text.isFirstResponder() {
                textClicked = self.text
            }else if self.text1.isFirstResponder() {
                textClicked = self.text1
            }else if self.text2.isFirstResponder() {
                textClicked = self.text2
            }
            //如果当前输入的框的位置低于键盘的高度就移动视图
            if textClicked.frame.maxY > keyboardFrame.origin.y{
                //被点击的文本框的底部的Y值 和  键盘的顶端的Y值 就是要移动的距离
                let offSet = textClicked.frame.maxY - keyboardFrame.origin.y
                //设置scrollView的可拖动距离(contentSize)为原来的视图高+键盘高,这样键盘没有遮挡的部分可以滚动查看原来所有的视图
                self.scrollView.contentSize.height = self.scrollViewHieght + keyboardFrame.size.height
                //+10 是为了使textFiled不要紧贴输入法
                self.scrollView.contentOffset = CGPoint(x: 0.0, y: offSet + 10)
            }
        })

    }
        
        deinit {        // 控制器销毁时,移除消息通知监听(必须)
            NSNotificationCenter.defaultCenter().removeObserver(self)
    }

其中的scrollViewHieght是和视图的高相等的
在类中声明scrollViewHieght,并且在viewDidLoad方法在中将视图的高赋值给scrollViewHieght

    var scrollViewHieght: CGFloat!   
//下面这句话写在viewDidLoad方法中     
    scrollViewHieght = self.view.frame.height

实现键盘收起事件,将视图恢复

// MARK -   键盘隐藏事件监听
    func onKeyboardWillHideFrame(notification: NSNotification) {
        let dict = NSDictionary(dictionary: notification.userInfo!)
        let duration = dict[UIKeyboardAnimationDurationUserInfoKey] as! Double
        UIView.animateWithDuration(duration, animations: { () -> Void in
        //让scrollView还原
        self.scrollView.contentOffset = CGPoint(x: 0.0, y: 0)
        self.scrollView.contentSize.height = self.view.frame.height
        })
    }

别忘了将所有textFiled的delegate设置为self,并且实现textFieldShouldReturn方法,此时,textFiled所在的类要继承UITextFiledDelegate协议

text1.delegate = self
text.delegate = self
text2.delegate = self
func textFieldShouldReturn(textField: UITextField) -> Bool {
        //当前textField取消焦点
        textField.resignFirstResponder()
        return true
    }

这样就可以解决键盘遮挡的问题。

下面说一下代码中用到的和没用到的scrollView和view的一些属性

ScrollView的一些属性

  • contentSize: CGSize 有 width 和 height,代表ScrollView可以滚动的视图大小
  • contentSize: CGPoint 有 x 和 y ,表示将ScrollView移动到指定坐标

View的一些属性

View的 frame 属性 有

  • width 自身的宽
  • height 自身的高
  • max X/Y
  • mid X/Y
  • min X/Y
    如图 介绍了Y X就自行脑补


    屏幕快照 2015-12-19 下午6.45.45.png

本文原创,作者初学不容易 =。= ,假如你转载,注明出处
360云盘:TextFieldView (提取码:92d4)

2016.1.10更新

机智的我发现,当你的软件设置为中文模式的时候,你的输入法会多出来一部分候选单词,这个时候,系统计算的键盘高度并不包含候选单词的高度,所以会出现输入框还是被遮挡的状况,解决方法就是,在下面这个代码中:

//+10 是为了使textFiled不要紧贴输入法
 self.scrollView.contentOffset = CGPoint(x: 0.0, y: offSet + 10)

将10 修改为更大的数字,置于具体是多少,就读者自己看着办吧!

相关文章

网友评论

      本文标题:iOS ScrollView中的textFiled解决键盘遮挡

      本文链接:https://www.haomeiwen.com/subject/qnzphttx.html