環(huán)信 - 進階篇之自定義cell(一)

環(huán)信 - 進階篇之自定義cell(二)??

更新:(1)縮略圖寬度不夠導致定制cell內(nèi)控件擠壓 -2017.06.29

現(xiàn)在的即時通訊,普通的聊天越來越難以滿足變態(tài)的需求了,這里加個按鈕、這里加個時間、那里加個禁言、那里加個匿名私聊......

今天就給大家介紹下怎么對cell中的各種需求的定制處理

大家覺得滿意的請點個????

例:我就拿之前幫人解決的一個案例來講解方法及實現(xiàn),大家可以借鑒處理的過程及思路,如有不妥之處,請大家及時留言告知,謝謝。

效果圖

類型一:在現(xiàn)有會話cell上修改UI效果

類似于上面給出的截圖,我們有時候需要對環(huán)信官方給出的cell進行些許的調(diào)整。例如:項目中加入了不同于普通群聊或者聊天室的功能需求

話題聊天室

點擊話題聊天,大家加入聊天室,這里發(fā)出的各種就是不同于普通聊天,普通的聊天只需展示文字、地址、圖片等等,但是這里的需求是得加上時間、私聊按鈕,沒砍需求之前是還有點贊和取消贊的按鈕。

案例

我們在普通聊天的基礎上新建幾個cell,文字、語音、圖片、地圖等等,不能和原有的普通cell混合起來,因為需求有普通聊天。

定制cell


EaseBubbleView

直接把普通聊天cell中的代碼拷貝過來,再在此基礎上進行cell的UI自定義處理,就拿文字聊天時的處理情況為例:

1、拷貝復制原有普通聊天cell內(nèi)的代碼

2、把需要的新增的UI控件初始化

3、適配各類控件

4、傳值及賦值

5、新增按鈕點擊和本身cell的點擊效果處理(別和cell上的點擊效果混到一起)

6、耐心調(diào)整cell上UI效果

以上基本就是簡單的自定義cell步驟了,有基礎的小伙伴看下步驟應該就有思路了


類型二:類似于紅包和名片Cell的UI效果

通常在我們項目中,并不只有文字、圖片等等這些簡單的聊天內(nèi)容,有時候我們需要把自己的信息作為一張名片發(fā)給對方、發(fā)個紅包給好朋友、發(fā)一個項目中的一個模塊介紹給對方等等功能要求。

范例

我們就拿雷哥的這張假名片為例:????????????????????????

/*!

@method

@brief 新增一個新的功能按鈕

@discussion

@param image 按鈕圖片

@param highLightedImage 高亮圖片

@param title 按鈕標題

@result

*/

- (void)insertItemWithImage:(UIImage*)image

highlightedImage:(UIImage*)highLightedImage

title:(NSString*)title;

/*!

@method

@brief 修改功能按鈕圖片

@discussion

@param image 按鈕圖片

@param highLightedImage 高亮圖片

@param title 按鈕標題

@param index 按鈕索引

@result

*/

- (void)updateItemWithImage:(UIImage*)image

highlightedImage:(UIImage*)highLightedImage

title:(NSString*)title

atIndex:(NSInteger)index;

/*!

@method

@brief 根據(jù)索引刪除功能按鈕

@discussion

@param index 按鈕索引

@result

*/

- (void)removeItematIndex:(NSInteger)index;

新增的功能

因為我們不好去修改環(huán)信的會話類型

*? 消息體類型

typedef enum{

EMMessageBodyTypeText? = 1,? ? /*! \~chinese 文本類型 \~english Text */

EMMessageBodyTypeImage,? ? ? ? /*! \~chinese 圖片類型 \~english Image */

EMMessageBodyTypeVideo,? ? ? ? /*! \~chinese 視頻類型 \~english Video */

EMMessageBodyTypeLocation,? ? ? /*! \~chinese 位置類型 \~english Location */

EMMessageBodyTypeVoice,? ? ? ? /*! \~chinese 語音類型 \~english Voice */

EMMessageBodyTypeFile,? ? ? ? ? /*! \~chinese 文件類型 \~english File */

EMMessageBodyTypeCmd,? ? ? ? ? /*! \~chinese 命令類型 \~english Command */

}EMMessageBodyType;

如果環(huán)信把這個開放出來,或許我們就更加簡單了我們只需自己修改成自己對應的類型即可。但是這個目前就想想,所以我們可以在以上類型中找一個出來,在它的基礎上做些文章,變成我們想要的類型。

紅包和名片最像什么。。。。對,不就和圖片差不多嘛,不過小伙伴也不要以為只能拿圖片來做文章,其他的我們都可以拿來用,這里就拿文字類型來作為例子(原理都一樣)。

名片類型

這里我們只簡要介紹怎么根據(jù)會話類型來顯示名片,具體傳值等怎么做,有基礎的小伙伴應該都懂,不懂的小伙伴見文章底部。

1、我們需要在發(fā)送名片時,在拓展消息里面存一個名片的字段,這個字段可以被用來判斷是名片、紅包等等。

2、名片、紅包等等中內(nèi)容,同樣也存在拓展屬性中(這里不做過多介紹)

3、我們在展示自己的消息和接收到對方的消息時,在文字類型的基礎上再進一步判斷是什么類型,加載對應類型的視圖,如果是紅包就加載紅包的view,如果是名片就展示名片view......

加載不同類型的cell

好了,以上就是我們所要介紹的兩種不同類型cell的處理辦法。

以下是補充自定義cell時遇到的各種情況及處理:

1、cell上語音、圖片等原始點擊和新增按鈕點擊沖突處理:

注釋掉原有的點擊方法,把原有的點擊方法放到具體的控件上去,避免cell上多個控件點擊的沖突

重點:記得把氣泡上的點擊權限打開

_backgroundImageView.userInteractionEnabled = YES;

解決點擊沖突

2、cell上語音氣泡長度的改變,避免過段影響布局

我們只需把原有語音上的語音長度Label距語音圖片控件調(diào)大一點距離就能自動把語音類氣泡拉長。(其他類型一樣處理原理)

語音氣泡拉長

3、因新增控件導致在原有cell上高度的變化處理

/*! @method @brief 根據(jù)消息的內(nèi)容,獲取當前cell的高度 @discussion @param model? ? ? ? 消息對象model @result 返回cell高度 */

+ (CGFloat)cellHeightWithModel:(id)model

在原cell高度處理的情況下,根據(jù)各種類型的判斷進行cell高度的自適應。

cell高度處理

4、文字類型氣泡長度的處理

我暫時的處理方法:判斷輸入的文字長度,加入文字長度小于10,我會在后面自動補全5個空格,被動撐長氣泡的長度。

假如小伙伴們有更好的建議也可以留言

5、縮略圖寬度不夠導致定制cell內(nèi)控件擠壓

全局搜索kEMMessageImageSizeHeight這個字段,修改寬度即可。

6、。。。。。。

暫時沒有想到要公布出的處理方法,如果小伙伴們有遇到的問題,可以及時在下方留言,如果我遇到過并處理過的會及時更新處理方法,謝謝大家。

如果大家伙有自己的處理方法及見解也可以提出來,我會收錄下來并且著名出自來源。

(1)iOS 環(huán)信(3.1.5)快速集成單聊、群聊、視頻及語音通話-新手

(2)iOS 環(huán)信昵稱、頭像、群頭像、群名稱處理

(3)購物車的邏輯及處理

(4)iOS 下拉上劃導航欄變化處理詳解 + 頭視圖放大

(5)購物首頁類型界面原理及實現(xiàn) - 初稿

? 、、、、、、、、、、、、、、、、、、、

有問題或者不理解的可以找我 ------ qq:1804094055?


最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,908評論 6 541
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 99,324評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,018評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,675評論 1 317
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,417評論 6 412
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 55,783評論 1 329
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,779評論 3 446
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,960評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 49,522評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 41,267評論 3 358
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,471評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,009評論 5 363
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 44,698評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,099評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,386評論 1 294
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,204評論 3 398
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,436評論 2 378

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,718評論 25 708
  • ————獻給北方的冬天 難道我們不記得曾經(jīng)雪花兒蓋滿山坡難道我們不渴望在冰上自由的滑翔難道我們不難過鳥兒不再從我們...
    采漪閱讀 286評論 2 3
  • 你好,陌生人,這里是甘肅蘭州,現(xiàn)在是北京時間18:52,我正在公交上,不知怎么車上人很少。天還是很亮,窗外兩邊的風...
    1米半半閱讀 276評論 1 3
  • 你像暖陽,又像彎月。 你曾在陽光明媚的日子里,光芒萬丈,照亮了哀怨的心房。 又曾在華燈初上的夜色里,月光皎潔,安靜...
    6f3e65e086c5閱讀 526評論 0 1
  • 書摘 心得 按照作者的觀點,曾經(jīng)的自己也患過心理疾病。有一段時間,特別的特立獨行,還天真的以為這就是自己的個性。不...
    金黃的麥穗閱讀 547評論 1 0