layim即時通訊完整實例
接觸 LayIM 已有一段時間了，UI簡潔美觀，相信吸引了不少學者，下面分享一下在整合該框架的時候遇到過的一些問題。
一、系統演示
1.1 聊天窗體主界面演示
1.2 模擬兩人在線聊天（點擊圖片查看演示視頻）
1.3 在線演示
在線演示，點擊進入系統
到這裡，若是您想要的，接下來聽我娓娓道來
二、開發工具
開發軟件：JDK7.0、MyEclipse 2014
開發語言：Java、HTML、Javascript
數據庫：MySQL5.6
服務器：Tomcat7.0
三、系統介紹
本系統採用了 B/S 體系結構，以 MySql 作為數據庫管理數據，以 JSP 作為前端開發語音，採用當前最流行的 SSM 框架（Spring+SpringMVC+MyBatis），標準的 MVC 模式，將整個系統劃分為表現層，controller 層，service 層，dao 層四層，完美整合即時聊天通訊於後台管理系統當中。
本系統在前端框架 LayIM 的基礎上整合了一套完整的即時聊天功能，包含一對一聊天以及多對多群聊，往着美觀大氣用戶體驗高的方針，把分組、好友、群聊完美完整地呈現於主窗體。
主窗體：個性化簽名、快速搜索、消息盒子、查找好友查找群組（添加好友、加入群組）、更換皮膚等功能
分組：添加分組、重命名、刪除分組、刷新好友列表
好友：發送即時聊天、查看好友資料、查看好友聊天記錄、移動好友分組、刪除好友
群組：發送群聊信息、查看群組資料、查看群組聊天記錄、修改群組圖標、創建群組、解散群組、退出群組、刷新群組列表、添加群成員、踢除群成員
聊天：支持常見的文本、表情、圖片聊天，還支持發送文件、分享音樂視頻，發送代碼等功能
四、功能介紹
下面詳細介紹主要功能使用與實現：
4.1 整合右鍵菜單
聊天主窗體最可觀的操作方式莫過於右鍵菜單，本系統整合幾大右鍵功能，分別是右鍵友好、右鍵分組、右鍵群組、右鍵好友界面的空白地方、右鍵群組界面的空白地方（如下圖）。
| 右鍵友好 | 右鍵分組 | 右鍵群組 |
 |
 |
 |
即時通訊聊天系統：`整合右鍵菜單`教程，點擊進入
4.2 添加好友、加入群組
聊天系統添加好友為最重要功能，本系統在主窗體底部中間「+」號按鈕整合查找好友查找群組功能，如下圖。
查找界面可根據姓名、手機號或職位進行搜索，找到目標點擊「+好友」按鈕，系統將推送一條消息到對方的消息盒子，待對方驗證通過後，申請添加好友便成功，加入群組也是同理。
即時通訊聊天系統：`添加好友進入群組`教程，點擊進入
4.3 查看更多聊天記錄
查看好友的聊天記錄、查看群組的聊天記錄，是即時通訊不可或缺的功能，本系統在好友的右鍵菜單中整合了該功能，好友聊天界面也整合了便捷入口，查看記錄界面如下圖：
即時通訊聊天系統：`查看更多聊天記錄`教程，點擊進入
4.4 綁定未讀消息數量
在您離線的時候，您的好友發送消息給你，當您登錄系統時，避免未能及時查看，應當綁定未讀數量於好友末尾，並高亮顯示，如下圖，對未讀消息一目了然！
即時通訊聊天系統：`綁定未讀消息數量`教程，點擊進入
4.5 移動好友分組
為了容易管理和查找好友，本系統整理了移動好友功能，比如將您們都喜歡的楊冪小姐姐移動到女神分組，如下圖，下次找女神聊天就簡單多了。
即時通訊聊天系統：`移動好友分組`教程，點擊進入
4.6 刷新好友列表
右鍵分組或右鍵好友窗體空白地方時，右鍵菜單綁定刷新好友列表，重新綁定即可，看是簡單，其中暗藏玄機，值得關注！
即時通訊聊天系統：`刷新好友列表`教程，點擊進入
4.7 邀請好友加入群組
打開群組成員，在成員列表前面綁定添加群成員與刪除群成員圖標（如下左圖），點擊添加群成員圖標，彈出添加群員界面（如下右圖）。
| 群成員 | 加入好友 |
 |
 |
即時通訊聊天系統：`邀請好友加入群組`教程，點擊進入
4.8 修改群組頭像
右鍵群組時，右鍵菜單綁定修改群圖標。本系統基於Croppe插件，實現HTML5裁剪圖片並上傳功能，支持部門裁剪左右旋轉，先來看看效果圖：
即時通訊聊天系統：`修改群組頭像`教程，點擊進入
4.9 整合WebSocket即時通訊
WebSocket使得客戶端和服務器之間的數據交換變得更加簡單，允許服務端主動向客戶端推送數據，是聊天系統即時通訊的良藥，本教程介紹兩個整合版本：
即時通訊聊天系統：`Java原生整合WebSocket通訊`教程，點擊進入
即時通訊聊天系統：`Spring完美整合WebSocket通訊`教程，點擊進入
Socket發送長消息（如圖片16進制），有時會自動斷開服務器連接，附上對策：
即時通訊聊天系統：`調整WebSocket緩衝區大小`教程，點擊進入
創作不容易，若對您有幫助，歡迎收藏，記得`賞個好評`。
