iOS ScrollView中的textFiled解决键盘遮挡的问题

关于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 修改为更大的数字,置于具体是多少,就读者自己看着办吧!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,098评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,213评论 2 380
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 149,960评论 0 336
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,519评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,512评论 5 364
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,533评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,914评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,574评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,804评论 1 296
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,563评论 2 319
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,644评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,350评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,933评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,908评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,146评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,847评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,361评论 2 342

推荐阅读更多精彩内容