1. 程式人生 > >詳細實現微信輸入框效果(textView自適應文字高度)

詳細實現微信輸入框效果(textView自適應文字高度)

前言

最近會不斷推出一些輪子,這次寫了一個控制元件,類似微信輸入框,評論View,隨著文字增加,textView自增長高度
如果喜歡我的文章,可以關注我微博:吖了個崢,也可以來小碼哥,瞭解下我們的iOS培訓課程。後續還會更新更多內容,有任何問題,歡迎簡書留言崢吖。。。

Demo效果:

11304825-2e8eefff9d5f895e

Demo演示:

1.新增底部View,到最底部

  • 1.1 底部View都是顯示到最下面,並且都是固定死的,採用Xib或者storyboard搭建
12304825-270694b49519db38

2.搭建底部View

13304825-985c5978e1576da0 14304825-045a8c5c88974908

3.拖線

  • 3.1 獲取底部View距離底部的約束,做鍵盤彈出效果,底部View隨著鍵盤彈出,而往上移動效果
16304825-13bc692ee35c4506 Objective-C
1234567891011121314151617181920 // 監聽鍵盤彈出[[NSNotificationCenterdefaultCenter] addObserver:self selector:@selector(keyboardWillChangeFrame:) name:UIKeyboardWillChangeFrameNotification object:nil];// 鍵盤彈出會呼叫-(void)keyboardWillChangeFrame:(NSNotification*)note{// 獲取鍵盤frame
CGRectendFrame=[note.userInfo[UIKeyboardFrameEndUserInfoKey] CGRectValue];// 獲取鍵盤彈出時長CGFloatduration=[note.userInfo[UIKeyboardAnimationDurationUserInfoKey] floatValue];// 修改底部檢視距離底部的間距_bottomCons.constant=_bottomCons.constant==0?endFrame.size.height:0;// 約束動畫[UIView animateWithDuration:duration animations:^{[self.view layoutIfNeeded];}];}
  • 3.2 獲取底部View高度的約束,當文字修改,去修改底部View整體高度
17304825-7ef6ae5f4f56e4b8
  • 3.3 獲取文字框輸入框
18304825-7e59346984fc7900

4.監聽文字輸入框,文字高度改變

  • 修改底部高度約束就好了
Objective-C
123456 // 監聽文字框文字高度改變_inputView.yz_textHeightChangeBlock=^(NSString*text,CGFloattextHeight){// 文字框文字高度改變會自動執行這個block,修改底部View的高度// 設定底部條的高度 = 文字高度 + textView距離上下間距高度(10 = 上(5)下(5)間距總和)_bottomHCons.constant=textHeight+10;};

原始碼

點選這下載原始碼