首页 > 代码库 > android 仿QQ气泡聊天界面
android 仿QQ气泡聊天界面
1.现在的QQ，微信等一些APP的聊天界面都是气泡聊天界面，左边是接收到的消息，右边是发送的消息，
这个效果其实就是一个ListView在加载它的Item的时候，分别用了不同的布局xml文件。
2.效果图(其中的聊天信息框是采用了.9.png的图片)：
3.对中间聊天的的listView进行说明：
左边Item的xml文件效果如下： 右边Item的xml文件效果如下：
4.在加载ListView当中重写getView()方法，通过判断消息传入类型，来使item加载哪一个xml文件：
自定义adapter代码如下：
1 public class ChatMsgViewAdapter extends BaseAdapter { 2 3 //ListView视图的内容由IMsgViewType决定 4 public static interface IMsgViewType 5 { 6 //对方发来的信息 7 int IMVT_COM_MSG = 0; 8 //自己发出的信息 9 int IMVT_TO_MSG = 1; 10 } 11 12 private static final String TAG = ChatMsgViewAdapter.class.getSimpleName(); 13 private List<ChatMsgEntity> data; 14 private Context context; 15 private LayoutInflater mInflater; 16 17 public ChatMsgViewAdapter(Context context, List<ChatMsgEntity> data) { 18 this.context = context; 19 this.data =http://www.mamicode.com/ data; 20 21 mInflater = LayoutInflater.from(context); 22 } 23 24 //获取ListView的项个数 25 public int getCount() { 26 return data.size(); 27 } 28 29 //获取项 30 public Object getItem(int position) { 31 return data.get(position); 32 } 33 34 //获取项的ID 35 public long getItemId(int position) { 36 return position; 37 } 38 39 //获取项的类型 40 public int getItemViewType(int position) { 41 // TODO Auto-generated method stub 42 ChatMsgEntity entity = data.get(position); 43 44 if (entity.getMsgType()) 45 { 46 return IMsgViewType.IMVT_COM_MSG; 47 }else{ 48 return IMsgViewType.IMVT_TO_MSG; 49 } 50 51 } 52 53 //获取项的类型数 54 public int getViewTypeCount() { 55 // TODO Auto-generated method stub 56 return 2; 57 } 58 59 //获取View 60 public View getView(int position, View convertView, ViewGroup parent) { 61 62 ChatMsgEntity entity = data.get(position); 63 boolean isComMsg = entity.getMsgType(); 64 65 ViewHolder viewHolder = null; 66 if (convertView == null) 67 { 68 if (isComMsg) 69 { 70 //如果是对方发来的消息，则显示的是左气泡 71 convertView = mInflater.inflate(R.layout.chatting_item_msg_text_left, null); 72 }else{ 73 //如果是自己发出的消息，则显示的是右气泡 74 convertView = mInflater.inflate(R.layout.chatting_item_msg_text_right, null); 75 } 76 77 viewHolder = new ViewHolder(); 78 viewHolder.tvSendTime = (TextView) convertView.findViewById(R.id.tv_sendtime); 79 viewHolder.tvUserName = (TextView) convertView.findViewById(R.id.tv_username); 80 viewHolder.tvContent = (TextView) convertView.findViewById(R.id.tv_chatcontent); 81 viewHolder.isComMsg = isComMsg; 82 83 convertView.setTag(viewHolder); 84 }else{ 85 viewHolder = (ViewHolder) convertView.getTag(); 86 } 87 viewHolder.tvSendTime.setText(entity.getDate()); 88 viewHolder.tvUserName.setText(entity.getName()); 89 viewHolder.tvContent.setText(entity.getText()); 90 91 return convertView; 92 } 93 94 //通过ViewHolder显示项的内容 95 static class ViewHolder { 96 public TextView tvSendTime; 97 public TextView tvUserName; 98 public TextView tvContent; 99 public boolean isComMsg = true;100 }101 102 }
5.在发送或则接收消息要添加更多的Item，如发送后添加item
1 ChatMsgEntity entity = new ChatMsgEntity();2 entity.setDate(getDate());3 entity.setName("");4 entity.setMsgType(false);5 entity.setText(contString);6 mDataArrays.add(entity);7 mAdapter.notifyDataSetChanged();8 mEditTextContent.setText("");9 mListView.setSelection(mListView.getCount() - 1);
对自定义的adpater引用的数据集的内容进行添加，然后通知adapter内容改变了，让它自己对界面进行修改。
核心内容就是上面的.
源码下载：下载
android 仿QQ气泡聊天界面
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。