天天看點

iOS開發之微信聊天工具欄的封裝

  微信大家基本上都用過,今天要做的就是微信的聊天工具條。聊天工具條還是比較複雜的,其中包括發送表情,發送文字,發送圖檔,發送聲音,拍照等等功能,下面給出發送錄音,文字,表情的代碼,其他的和這幾樣類似。還是那句話百字不如一圖,先來幾張效果圖吧。

iOS開發之微信聊天工具欄的封裝
iOS開發之微信聊天工具欄的封裝

  

  一:toolview預留的接口

    在封裝toolview中主要用到block回調,讀者可以根據自己的個人習慣來選擇是block回調,還是委托回調或者是目标動作回調(筆者更喜歡block回調),下面的代碼是toolview給調用者提供的接口

  二:初始化toolview中所需的控件

    1.為了更好的封裝我們的元件,在.h中預留接口,在toolview.m的延展中添加我們要使用的元件(私有屬性),延展代碼如下:

    2.接受相應的block回調,把block傳入toolview中,代碼如下: 

    3.控件的初始化,純代碼添加toolview中要用到的元件(配置設定記憶體,配置相應的屬性),因為是自定義元件的封裝,是以我們的storyboard就用不上啦,添加控件的代碼如下:

  4.給我們的控件添加相應的限制,為了适合不同的螢幕,是以自動布局是少不了的。當然啦給控件添加限制也必須是手寫代碼啦,添加限制的代碼如下:

    5.因為我們要發送錄音,是以對音頻部分的初始化是少不了的,以下代碼是對音頻的初始化

    6.添加鍵盤回收鍵done

 三.編寫控件的回調方法

    控件添加好以後下面要添加觸發控件要幹的事情:

    2.下面的代碼是檢測音量的變化,用于根據音量變化圖檔,代碼如下:

    3.輕擊輸入框時,切換到系統鍵盤,代碼如下:

    4.通過輸入框的文字多少改變toolview的高度,因為輸入框的限制是加在toolview上的,是以需要把輸入框的contentsize通過block傳到toolview的調用者上,讓toolview的父視圖來改變toolview的高度,進而sendtextview的高度也會随着改變的,下面的代碼是把contentsize交給父視圖:代碼如下:

    效果如下,文字多時textview的高度也會增大:

iOS開發之微信聊天工具欄的封裝

    5.點選最左邊的按鈕觸發的事件(切換文本輸入框和錄音按鈕),代碼如下:

    6.點選return發送文字(通過block回調傳入到父視圖上),代碼如下:

    7.錄音按鈕本身要做的事情(在longpress沒有被觸發時調用)代碼如下:

    8.調用表情鍵盤:

  以上就是toolview的所有封裝代碼,至于在controller中如何使用他來發送消息,如何定義聊天cell,如何處理錄音檔案,聊天時的氣泡是如何實作的等功能,在以後的部落格中會繼續講解,希望大家繼續關注。

繼續閱讀