Android-類qq功能（一）

一、最近的Android項目中，有需要類似qq的聊天功能，包括消息、聯繫人、聊天。在學習了一段時間Android之後，便開始了開發。原型是這樣的。

消息：

聯繫人：

聊天頁面：

二、首先先實現消息和聯繫人，因爲這兩個極其類似，所以放到一起。

實現思路是這樣的：消息和聯繫人放在同一個佈局下，然後通過tabhost來切換頁面，兩個tab分別顯示不同的listview，具體的消息和聯繫人的item佈局分別用來填充兩個listview。首先建立一個主activity和三個佈局分別是主layout和消息item的layout和聯繫人item的layout：

1.首先message_main主佈局代碼:

	<?xml version="1.0" encoding="utf-8"?>
	 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:orientation="vertical" >
	    
	
	<TextView android:layout_width="fill_parent"
	    android:layout_height="30dp"
	    android:text="消息"
	    android:textColor="#ffffff"
	    android:background="#333D3A"
	    android:gravity="center"/>
	
	<View android:layout_width="match_parent" android:layout_height="5dip"  
	
	    android:background="#31B5E5" />  
	
	<TabHost android:id="@android:id/tabhost"
		android:layout_width="fill_parent"
		android:layout_height="wrap_content"
		android:layout_gravity="center_vertical"
		
		>
		<LinearLayout android:orientation="vertical"
		    android:layout_width="fill_parent"
		    android:layout_height="fill_parent" 
		    >
		    <TabWidget android:id="@android:id/tabs"
		        android:layout_width="fill_parent"
		        android:layout_height="wrap_content"></TabWidget>
		    <FrameLayout android:id="@android:id/tabcontent"
		        android:layout_width="fill_parent"
		        android:layout_height="fill_parent">
		      
		            
		            <!-- 消息listview -->
		        <ListView android:id="@+id/message_list"
		            android:layout_width="match_parent"
		            android:layout_height="match_parent"/>
		            
		       <!-- 聯繫人listview -->
			    <ListView 
		        android:id="@+id/relation_list"
		        android:layout_width="match_parent"
		        android:layout_height="match_parent"/> 
		        
		    </FrameLayout>
		</LinearLayout>    
	</TabHost>
	</LinearLayout> 

2.消息item的佈局：

	<?xml version="1.0" encoding="utf-8"?>
	<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:background="#efefef">
	
	    <!-- 頭像 -->
	   <ImageView android:id="@+id/mm_photo"
	        android:layout_height="70dip"
	        android:layout_width="70dip"
	        android:layout_margin="5dip"/>
	    
	<!-- 暱稱 -->
	    <TextView android:id="@+id/mm_name"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:padding="5dip"
	        android:layout_toRightOf="@id/mm_photo"
	        android:layout_alignTop="@id/mm_photo"
	        android:text="萌萌的小學生"
	        android:textSize="8pt"
	        android:textStyle="bold"
	        android:maxLength="7"/>
	
	    <!-- 個性簽名 -->
	    <TextView android:id="@+id/mm_sign"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:padding="5dip"
	        android:layout_toRightOf="@id/mm_photo"
	        android:layout_alignBottom="@id/mm_photo"
	        android:text="萌萌噠"
	        android:textColor="#888888"/>
	    
	<!-- 消息日期 -->
	    <TextView
	        android:id="@+id/mm_date"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:layout_alignTop="@+id/mm_photo"
	        android:layout_alignParentRight="true" 
	        android:layout_marginRight="5pt"
	        android:text="11月3日"/>
	
	    
	    <!-- 顯示多少未讀消息 -->
	    <TextView android:id="@+id/mm_count"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:background="#FF0000"
	        android:text="3"
	        android:textStyle="bold"
	        android:textColor="#FFFFFF"
	        android:layout_marginRight="5pt"
	        android:layout_marginTop="8pt"
	        android:layout_alignParentRight="true" 
	        android:layout_below="@id/mm_date"/>
	</RelativeLayout>

3.聯繫人item的佈局：

	<?xml version="1.0" encoding="utf-8"?>
	<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:background="#efefef" >    
	    <!-- 頭像 -->
	    <ImageView 
	        android:id="@+id/ct_photo"
	        android:layout_height="70dip"
	        android:layout_width="70dip"
	        android:layout_margin="5dip"
	        />
	<!-- 暱稱 -->
	    <TextView 
	        android:id="@+id/ct_name"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:padding="5dip"
	        android:layout_toRightOf="@id/ct_photo"
	        android:layout_alignTop="@id/ct_photo"
	        android:text="萌萌的小學生"
	        android:textSize="8pt"
	        android:textStyle="bold"
	        android:maxLength="7"/>   
	<!-- 個性簽名 -->
	    <TextView 
	        android:id="@+id/ct_sign"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:padding="5dip"
	        android:layout_toRightOf="@id/ct_photo"
	        android:layout_alignBottom="@id/ct_photo"
	        android:text="萌萌噠~"
	        android:textColor="#888888"/>
	   </RelativeLayout>

到這裏，消息和聯繫人頁面的佈局就完成了。接下來就是後臺代碼的編寫了。