九:基於xmpp的聊天

       接着上一篇寫, 寫完這篇就可以聊天了。也期待了很久了。大笑

       start:

1、先看一下效果:



2、佈局很簡單,把聊天的內容放在了listView裏,activity_chat.xml,用的strings.xml就不貼了,因爲就有”發送“兩個字。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#ffffff"
    android:orientation="vertical" >

    <ListView
        android:id="@+id/lv_content"
        android:layout_width="match_parent"
        android:layout_height="414dp"
        android:background="#cccccc"
        android:cacheColorHint="@null"
        android:divider="@null"
        android:listSelector="@android:color/transparent"
        android:stackFromBottom="true" >
    </ListView>

    <RelativeLayout
        android:id="@+id/rl_bottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/btn_voice"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:background="@drawable/voice_bg" />

        <EditText
            android:id="@+id/et_sendContent"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toLeftOf="@+id/btn_sendMessage"
            android:layout_toRightOf="@+id/btn_voice"
            android:hint=""
            android:ems="10" >

            <requestFocus />
        </EditText>

        <Button
            android:id="@+id/btn_face"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:layout_alignBaseline="@+id/btn_sendMessage"
            android:layout_alignBottom="@+id/btn_sendMessage"
            android:layout_alignRight="@+id/et_sendContent"
            android:background="@drawable/face" />

        <Button
            android:id="@+id/btn_sendMessage"
            android:layout_width="45dp"
            android:layout_height="45dp"
            android:layout_alignParentRight="true"
            android:layout_alignTop="@+id/et_sendContent"
            android:text="@string/chat_sendMsg"
            android:textSize="10sp" />
    </RelativeLayout>

</LinearLayout>

3、聊天的java代碼:註釋很清楚,相信你明白的。得意

package org.hkby.lwx.activity;

import java.util.ArrayList;
import java.util.List;

import org.hkby.lwx.adapter.ChatAdapter;
import org.hkby.lwx.common.Msg;
import org.hkby.lwx.common.SystemTime;
import org.hkby.lwx.common.XmppTool;
import org.jivesoftware.smack.Chat;
import org.jivesoftware.smack.ChatManager;
import org.jivesoftware.smack.ChatManagerListener;
import org.jivesoftware.smack.MessageListener;
import org.jivesoftware.smack.XMPPException;
import org.jivesoftware.smack.packet.Message;

import android.app.Activity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.os.Handler;
import android.view.View;
import android.view.Window;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ListView;
/**
 * chat 
 * @author liaowuxing
 *
 */
public class ChatActivity extends Activity {
	private ChatAdapter adapter;
	private ListView lv_content;
	private Button btn_sendMessage;
	private EditText et_sendContent;
	private String friendName;
	private String account;
	// save message
	private List<Msg> listMsg = new ArrayList<Msg>();
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.activity_chat);
		//get the name of friend
		Intent intent = getIntent();
		Bundle bundle = intent.getBundleExtra("b_name");
		friendName = bundle.getString("name");
		//get the name of login user
		SharedPreferences sp = getSharedPreferences("username",
				Activity.MODE_PRIVATE);
		account = sp.getString("account", "");
		initView();
		chatClick();
	}

	public void initView() {
		lv_content = (ListView) this.findViewById(R.id.lv_content);
		et_sendContent = (EditText) this.findViewById(R.id.et_sendContent);
		btn_sendMessage = (Button) this.findViewById(R.id.btn_sendMessage);
		adapter = new ChatAdapter(listMsg, ChatActivity.this);
		lv_content.setAdapter(adapter);
	}

	public void chatClick() {
		// create chat
		final ChatManager cm = XmppTool.getConnection().getChatManager();
		// Listening to the chat messages from friends
		cm.addChatListener(new ChatManagerListener() {

			@Override
			public void chatCreated(Chat chat, boolean able) {
				chat.addMessageListener(new MessageListener() {
					@Override
					public void processMessage(Chat chat2, Message message) {
						android.os.Message m = handler.obtainMessage();
						m.obj = message;
						m.sendToTarget();
					}
				});
			}
		});
		//send chat message to friends
		btn_sendMessage.setOnClickListener(new OnClickListener() {
			@Override
			public void onClick(View arg0) {
				String content = et_sendContent.getText().toString();
				if (content.length() > 0) {
					Msg msg = new Msg(account, content, SystemTime.getDate(), "To");
					listMsg.add(msg);
					adapter.notifyDataSetChanged();
					try {
						Chat newchat = cm.createChat(friendName+"@"+XmppTool.getConnection().getServiceName(), null);
						newchat.sendMessage(content);
					} catch (XMPPException e) {
						e.printStackTrace();
					}
				}
				et_sendContent.setText("");
			}
		});
	}

	// Receives the message
	private Handler handler = new Handler() {
		public void handleMessage(android.os.Message msg) {
			Message m = new Message();
			m = (Message) msg.obj;
			String fromName = m.getFrom().toString().split("@")[0];
			Msg msg2 = new Msg(fromName, m.getBody().toString(), SystemTime.getDate(), "From");
			listMsg.add(msg2);
			adapter.notifyDataSetChanged();
		};
	};
}


4、我建了類Msg,用來存放聊天人的姓名,信息,時間,是來至好友的還是發給好友的。

package org.hkby.lwx.common;
/**
 * chat message
 * @author liaowuxing
 *
 */
public class Msg {
	public String username;
	public String msg;
	public String date;
	public String fromOrTo;

	public Msg(String username, String msg, String date, String fromOrTo) {
		this.username = username;
		this.msg = msg;
		this.date = date;
		this.fromOrTo = fromOrTo;
	}
}

5、獲取系統時間的類。

package org.hkby.lwx.common;

import java.text.SimpleDateFormat;
import java.util.Date;
/**
 * get system time
 * @author liaowuxing
 *
 */
public class SystemTime {
	private static SimpleDateFormat formatBuilder;

	public static String getDate(String format) {
		formatBuilder = new SimpleDateFormat(format);
		return formatBuilder.format(new Date());
	}

	public static String getDate() {
		return getDate("hh:mm:ss");
	}
}


6、listView的adapter代碼:

package org.hkby.lwx.adapter;

import java.util.List;

import org.hkby.lwx.activity.R;
import org.hkby.lwx.common.Msg;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;
/**
 * chat adapter
 * @author liaowuxing
 *
 */
public class ChatAdapter extends BaseAdapter {
	private List<Msg> listMsg;
	private LayoutInflater mInflater;
	private Context context;
	public ChatAdapter(List<Msg> listMsg,Context context) {
		super();
		this.context = context;
		this.listMsg = listMsg;
		mInflater = LayoutInflater.from(context);
	}

	@Override
	public int getCount() {
		if (listMsg.size() == 0) {
			return 0;
		}
		return listMsg.size();
	}

	@Override
	public Object getItem(int position) {
		return listMsg.get(position);
	}

	@Override
	public long getItemId(int position) {
		return position;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		if (listMsg.get(position).fromOrTo.equals("From")) {
			ViewHolder viewHolder = new ViewHolder();
			convertView = mInflater.inflate(R.layout.chat_from_item, null);
			viewHolder.tv_username = (TextView)convertView.findViewById(R.id.tv_fromUsername);
			viewHolder.tv_data = (TextView)convertView.findViewById(R.id.tv_fromDate);
			viewHolder.tv_msg = (TextView)convertView.findViewById(R.id.tv_fromMsg);
			convertView.setTag(viewHolder);
		}else {
			ViewHolder viewHolder = new ViewHolder();
			convertView = mInflater.inflate(R.layout.chat_to_item, null);
			viewHolder.tv_username = (TextView)convertView.findViewById(R.id.tv_toUsername);
			viewHolder.tv_data = (TextView)convertView.findViewById(R.id.tv_toDate);
			viewHolder.tv_msg = (TextView)convertView.findViewById(R.id.tv_toMsg);
			convertView.setTag(viewHolder);
		}
		ViewHolder vHolder = (ViewHolder)convertView.getTag();
		String username = listMsg.get(position).username;
		String date = listMsg.get(position).date;
		String msg = listMsg.get(position).msg;
		if (username != null) {
			vHolder.tv_username.setText(username);
		}else {
			vHolder.tv_username.setText("");
		}
		if (date != null) {
			vHolder.tv_data.setText(date);
		}else {
			vHolder.tv_data.setText("");
		}
		if (msg != null) {
			vHolder.tv_msg.setText(msg);
		}else {
			vHolder.tv_msg.setText("");
		}
		return convertView;
	}

	private class ViewHolder{
		private TextView tv_username;
		private TextView tv_data;
		private TextView tv_msg;
	}
}

7、由於聊天的內容,一左一右,需要兩個佈局,一個是來至好友的消息佈局,chart_from_item.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/tv_fromUsername"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="15.0dp"
            android:textColor="#FF666666"
            android:textSize="18sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/tv_fromDate"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10.0dp"
            android:textColor="#FF666666" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/incoming"
        android:paddingBottom="3.0dip"
        android:paddingLeft="15.0dip"
        android:paddingRight="10.0dip"
        android:paddingTop="3.0dip" >

        <TextView
            android:id="@+id/tv_fromMsg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#FF000000" />
    </LinearLayout>

</LinearLayout>

8、一個是發送給好友的消息佈局,chart_to_item.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
 <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/tv_toUsername"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textStyle="bold"
            android:textSize="18sp"
            android:textColor="#FF666666" />

        <TextView
            android:id="@+id/tv_toDate"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10.0dp"
            android:layout_marginRight="20.0dip"
            android:textColor="#FF666666" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:background="@drawable/outgoing"
        android:paddingBottom="3.0dip"
        android:paddingLeft="10.0dip"
        android:paddingRight="20.0dip"
        android:paddingTop="3.0dip" >

        <TextView
            android:id="@+id/tv_toMsg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#FF000000" />
    </LinearLayout>
   

</LinearLayout>

9、項目結構:



10、ok,聊天的完成了。






發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章