使用ivx连接组件实现私聊模型的经验总结

在一些案例中我们需要实现应用之间的数据即时共享，比如聊天室或者需要互动的多人游戏等。在ivx中我们是通过连接组件实现这种多个设备之间的信息传递功能的，今天结合一个私聊模型来讲一讲连接组件的具体使用方法。

一.连接
首先简单介绍一下连接组件，我们在对象树里选中前台即可添加一个连接，可以看到它只有一个属性就是它的SID码，这也是它的唯一标识。


1.用户
登录连接的每个用户可以设置自己的用户ID、昵称和头像，登录成功后会收到一个CID码作为该用户的唯一标识。同时，连接组件也可以监听到用户的加入和离开并返回实时结果。

2.房间
用户可以创建房间，但是需要填写房间ID，而且此ID会作为房间的唯一标识，在加入、退出、关闭房间和发送房间消息时都需要指明房间ID。

3.发送和接收消息
用户可以发送个人、房间和全局三种消息，发送个人消息时必须指明接收用户的CID码，而发送房间/全局消息会发送给当前房间/连接内的每一位用户（包括发送者自己）。此外，连接中可以一次发送多条消息，每条消息用不同的消息名称加以区分。

在接收消息时可以得到参数“消息内容”，它是包含整条消息的集合，我们可以在后面添加上发送消息时填入的名称作为后缀选取其中的某一条，此外我们还可以获取发送者的CID、用户ID、昵称和头像。


二.私聊模型
1.数据
在这个模型中共有五个参数，通用变量“我的信息”和“选中好友”分别用于存放当前用户和正在对话的好友的CID、昵称和头像；对象数组“好友列表”则用来存放全部好友信息，而且加了一个字段“红点”用来判断是否有未读消息，而对象数组“当前消息列表”和“总消息列表”则分别存放正在对话的好友消息记录和所有好友的消息记录，可以看到它俩的结构是一致的，其中布尔值字段“我的消息”为1说明这条消息是当前用户发给对方的，反之说明是由对方发送的。


2.前台
在前台初始化时我们会获取当前在线用户列表并赋值给“好友列表”，下图中可以看到调试记录里的打印结果，序号为0的元素里面就是之前已经登录的一个用户的信息，序号为1的元素其实就是当前用户，不过由于当前用户还没完成登记，所以暂时只分配了一个CID。（即连接获取在线用户列表时会获取用户自己和没有进行登记的用户）


3.登记页面
登记页面中我们可以上传头像、输入昵称，点击chat按钮就会在连接中进行登记，登记成功后会把当前用户的CID、头像和昵称保存在“我的信息”中，然后使用连接组件发送一条全局消息，包含“类型”，“昵称”和“头像”三部分内容。对应要给连接添加收全局消息的事件，并且当接收到的全局消息的“类型”值为“新用户”时，在“好友列表”中添加一条数据，包括直接获取的发送者CID和“消息内容”中的“头像”与“昵称”。


4.聊天页面
聊天页面可以分为四部分：左侧放置的是当前用户的头像，图片组件已经与“我的信息”进行了数据绑定；中间是联系人列表；右上方是正在对话好友的消息列表；右下方则用来输入并发送消息。


其中联系人列表是依据“好友列表”循环创建的，for容器下添加了两个if容器用来分别将当前用户自己和没有昵称的用户筛除，当用户点击选中一个好友时会将该好友的信息存到“选中好友”中，并且从“总消息列表”中将与该好友的对话记录筛选输出到“当前消息列表”。


联系人列表中还用绝对定位容器做了一个红点的展示效果，它的可见属性进行了数据绑定，只有在当前数据的“红点”为1时可见，这部分的逻辑是当连接收到一条个人消息会先将该消息存入“总消息列表”，然后判断消息来源的CID是否为正在对话的“选中好友”，如果是就将该消息再添加到“当前消息列表”；如果不是就从“好友列表”中找到该CID对应的好友，把“红点”字段置1，使该好友在列表中显示红点，标记有消息未读。


前面已经说过选中一个好友后会从“总消息列表”中将与该好友的对话记录筛选输出到“当前消息列表”，右上方就是根据“当前消息列表”循环创建展示出聊天记录的，而且这里if容器会通过每条消息中字段“我的消息”的值选择不同的展示效果。

最后是点击右下方的send按钮，这里连接会通过“选中好友”中的CID确认发送对象，将输入内容发送给对方后，我们需要在“总消息列表”和“当前消息列表”中都添加这条消息的记录，而且将“我的消息”这一字段设置为1。

总结
连接的使用中，首先要注意的就是事件的对应，案例中有通过连接发送消息的动作，那么就要在连接中添加对应的接收消息的事件，否则通讯就是没有意义的。还有就是连接中无论发送个人消息还是房间消息都需要唯一标识，所以要设置好案例中数据的字段结构，尽量清晰明了。