Android 开发即时聊天工具 YQ ：（七） 气泡聊天

首先看看效果：

 

实现方式还是listview自定义adapter，只不过用了两个布局文件，左边的一种布局，右边的一种布局，在消息实体类中添加一个变量，用来判断是发出的消息还是收到的消息，从而在adapter的getView()中，决定采用哪种布局。

 

chat_listview_item_left.xml

 

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="wrap_content"
 4     android:layout_height="wrap_content" >
 5     <ImageView
 6         android:id="@+id/avatar_chat_left"
 7         android:layout_width="wrap_content"
 8         android:layout_height="wrap_content"
 9         android:src="@drawable/avatar_default" />
10     <RelativeLayout 
11         android:id="@+id/rl_chat_left"
12         android:layout_width="wrap_content"
13         android:layout_height="wrap_content"
14         android:layout_toRightOf="@id/avatar_chat_left"
15         android:background="@drawable/chat_left">
16     <TextView
17         android:id="@+id/message_chat_left"
18         android:layout_width="wrap_content"
19         android:layout_height="wrap_content"
20         android:maxWidth="160dip"/>
21     </RelativeLayout>
22     <TextView
23         android:id="@+id/sendtime_chat_left"
24         android:layout_width="wrap_content"
25         android:layout_height="wrap_content"
26         android:layout_toRightOf="@id/avatar_chat_left"
27         android:layout_below="@id/rl_chat_left"
28         android:textSize="10sp" />
29 </RelativeLayout>

 

chat_listview_item_right.xml

 

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="wrap_content"
 4     android:layout_height="wrap_content" >
 5     <ImageView
 6         android:id="@+id/avatar_chat_right"
 7         android:layout_width="wrap_content"
 8         android:layout_height="wrap_content"
 9         android:layout_alignParentRight="true"
10         android:layout_alignParentTop="true"
11         android:src="@drawable/avatar_default" />
12     <RelativeLayout
13         android:id="@+id/rl_chat_right"
14         android:layout_width="wrap_content"
15         android:layout_height="wrap_content"
16         android:layout_toLeftOf="@+id/avatar_chat_right"
17         android:background="@drawable/chat_right" >
18     <TextView
19         android:id="@+id/message_chat_right"
20         android:layout_width="wrap_content"
21         android:layout_height="wrap_content"
22         android:maxWidth="160dip" />
23     </RelativeLayout>
24     <TextView
25         android:id="@+id/sendtime_chat_right"
26         android:layout_width="wrap_content"
27         android:layout_height="wrap_content"
28         android:layout_below="@id/rl_chat_right"
29         android:layout_toLeftOf="@+id/avatar_chat_right"
30         android:textSize="10sp"/>
31 </RelativeLayout>

 

在adapter中判断消息是发出的还是收到的：

1         if(ce.isLeft()){
2             convertView = inflater.inflate(R.layout.chat_listview_item_left, null);
3             
4         }else{
5             convertView=inflater.inflate(R.layout.chat_listview_item_right, null);
6 
7         }

 

谢谢大家支持！欢迎一起学习交流！

 

posted @ 2013-01-26 11:42  王世桢  阅读(222)  评论(0)  编辑  收藏  举报