android 實作qq聊天對話界面效果

 效果圖：

chatting_item_from.xml

<?xml version="1.0" encoding="UTF-8"?>

<LinearLayout

 android:orientation="vertical"

 android:paddingLeft="6.0dip"

 android:paddingRight="6.0dip"

 android:layout_width="fill_parent"

 android:layout_height="wrap_content"

    <TextView

     android:id="@+id/chatting_time_tv"

     style="@style/ChattingUISplit" />

      <TextView

     android:id="@+id/chatting_content_itv"

     android:

     android:background="@drawable/chatfrom_bg"

     style="@style/ChattingUIText" />

</LinearLayout>

chatting_item_to.xml:

<LinearLayout android:orientation="vertical" android:paddingLeft="6.0dip" android:paddingRight="6.0dip" android:layout_width="fill_parent" android:layout_height="wrap_content"

    <LinearLayout

     android:orientation="horizontal"

     android:layout_width="fill_parent"

     android:layout_height="wrap_content">

        <TextView

         android:layout_width="wrap_content"

         android:layout_height="wrap_content"

         android:layout_weight="1.0" />

        <ImageView

         android:id="@+id/chatting_state_iv"

         android:layout_height="wrap_content" />

          <TextView

         android:

         android:id="@+id/chatting_content_itv"

         android:background="@drawable/chatto_bg"

         style="@style/ChattingUIText" />

    </LinearLayout>

chatting_title_bar.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout

  android:layout_width="fill_parent"

  android:layout_height="40dip" 

    android:orientation="horizontal"

    android:gravity="center_vertical"

 android:background="@drawable/mmtitle_bg">

 <TextView

  android:id="@+id/chatting_contact_name"

  android:layout_height="wrap_content"

  android:layout_width="180dip"

  android:textSize="18sp"

  android:ellipsize="end"

  android:background="@null"

  android:textColor="@color/white"

  android:gravity="left|center"

  android:paddingLeft="10dip"  

  android:text="測試使用者"

 />

  android:id="@+id/chatting_contact_status"

  android:layout_width="wrap_content"

  android:text="正在輸入..."

  android:textSize="16sp"

  android:layout_alignParentRight="true"

  android:layout_alignParentBottom="true"

  android:padding="3dip"

  android:layout_toRightOf="@id/chatting_contact_name"

  android:visibility="gone"

</RelativeLayout>

chatting.xml

 android:id="@+id/chat_root"

 android:focusable="false"

 android:focusableInTouchMode="false"

 android:background="@drawable/nav_page"

 android:layout_height="fill_parent"

 android:gravity="center_horizontal"

    <ListView

     android:id="@+id/chatting_history_lv"

     android:background="@null"

     android:scrollbars="vertical"

     android:layout_height="wrap_content"

     android:listSelector="@drawable/mm_chat_listitem"

     android:transcriptMode="alwaysScroll"

     android:cacheColorHint="#00000000"

     android:divider="@null"

     android:layout_weight="1.0" />

   <LinearLayout

     android:background="@drawable/txt_msg_bg"

     android:paddingRight="7.0dip"

         android:layout_gravity="center_vertical"

         android:id="@+id/sms_button_insert"

         android:paddingLeft="15.0dip"

         android:paddingTop="5.0dip"

         android:paddingRight="7.0dip"

         android:paddingBottom="5.0dip"

         android:src="@drawable/sms_insert" />

        <EditText

         android:textColorHint="@color/search_hint"

         android:id="@+id/text_editor"

         android:background="@drawable/sms_embeded_text_editor_bg"

         android:focusable="true"

         android:nextFocusRight="@+id/send_button"

         android:layout_width="0.0dip"

         android:layout_marginLeft="7.0dip"

         android:layout_marginTop="5.0dip"

         android:layout_marginRight="7.0dip"

         android:layout_marginBottom="5.0dip"

         android:minHeight="34.0dip"

         android:hint="輸入消息"

         android:maxLines="8"

         android:maxLength="2000"

         android:capitalize="sentences"

         android:layout_weight="1.0"

         android:inputType="textCapSentences|textAutoCorrect|textMultiLine|textShortMessage"

         android:imeOptions="actionSend|flagNoEnterAction" />

        <Button

         android:gravity="center"

         android:id="@+id/send_button"

         android:background="@drawable/sms_send_button_bg"

         android:paddingLeft="11.0dip"

         android:paddingRight="11.0dip"

         android:nextFocusLeft="@id/text_editor"

         />

     </LinearLayout>

實體類:

public class ChatMessage {

 public static final int MESSAGE_FROM = 0;

 public static final int MESSAGE_TO = 1;

 private int direction;

 private String content;

 public ChatMessage(int direction, String content) {

  super();

  this.direction = direction;

  this.content = content;

 }

 public int getDirection() {

  return direction;

 public void setDirection(int direction) {

 public void setContent(String content) {

 public CharSequence getContent() {

  return content;

}

adapter類：

import java.util.List;

import android.content.Context;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.BaseAdapter;

import android.widget.TextView;

public class ChattingAdapter extends BaseAdapter {

 protected static final String TAG = "ChattingAdapter";

 private Context context;

 private List<ChatMessage> chatMessages;

 public ChattingAdapter(Context context, List<ChatMessage> messages) {

  this.context = context;

  this.chatMessages = messages;

 public int getCount() {

  return chatMessages.size();

 public Object getItem(int position) {

  return chatMessages.get(position);

 public long getItemId(int position) {

  return position;

 public View getView(int position, View convertView, ViewGroup parent) {

  ViewHolder holder = null;

  ChatMessage message = chatMessages.get(position);

  if (convertView == null || (holder = (ViewHolder) convertView.getTag()).flag != message.getDirection()) {

   holder = new ViewHolder();

   if (message.getDirection() == ChatMessage.MESSAGE_FROM) {

    holder.flag = ChatMessage.MESSAGE_FROM;

    convertView = LayoutInflater.from(context).inflate(R.layout.chatting_item_from, null);

   } else {

    holder.flag = ChatMessage.MESSAGE_TO;

    convertView = LayoutInflater.from(context).inflate(R.layout.chatting_item_to, null);

   }

   holder.text = (TextView) convertView.findViewById(R.id.chatting_content_itv);

   convertView.setTag(holder);

  }

  holder.text.setText(message.getContent());

  return convertView;

//優化listview的Adapter

 static class ViewHolder {

  TextView text;

  int flag;

主activity類

import android.app.Activity;

import android.os.Bundle;

import android.view.Window;

import android.widget.Button;

import android.widget.EditText;

import android.widget.ListView;

public class MainActivity extends Activity {

 protected static final String TAG = "MainActivity";

 private ChattingAdapter chatHistoryAdapter;

 private List<ChatMessage> messages = new ArrayList<ChatMessage>();

 private ListView chatHistoryLv;

 private Button sendBtn;

 private EditText textEditor;

 //private ImageView sendImageIv;

 //private ImageView captureImageIv;

 //private View recording;

 //private PopupWindow menuWindow = null;

 @Override

 public void onCreate(Bundle savedInstanceState) {

  requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);

  super.onCreate(savedInstanceState);

  setContentView(R.layout.chatting);

  getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.chatting_title_bar);

  chatHistoryLv = (ListView) findViewById(R.id.chatting_history_lv);

  setAdapterForThis();

  sendBtn = (Button) findViewById(R.id.send_button);

  textEditor = (EditText) findViewById(R.id.text_editor);

  sendBtn.setOnClickListener(l);

 // 設定adapter

 private void setAdapterForThis() {

  initMessages();

  chatHistoryAdapter = new ChattingAdapter(this, messages);

  chatHistoryLv.setAdapter(chatHistoryAdapter);

 // 為listView添加資料

 private void initMessages() {

  messages.add(new ChatMessage(ChatMessage.MESSAGE_FROM, "hello"));

  messages.add(new ChatMessage(ChatMessage.MESSAGE_TO, "hello"));

  messages.add(new ChatMessage(ChatMessage.MESSAGE_FROM, "你好嗎？"));

  messages.add(new ChatMessage(ChatMessage.MESSAGE_TO, "非常好!"));

  messages.add(new ChatMessage(ChatMessage.MESSAGE_TO, "恩，好的，謝謝"));

 private View.OnClickListener l = new View.OnClickListener() {

  public void onClick(View v) {

   if (v.getId() == sendBtn.getId()) {

    String str = textEditor.getText().toString();

    String sendStr;

    if (str != null

      && (sendStr = str.trim().replaceAll("\r", "").replaceAll("\t", "").replaceAll("\n", "")

        .replaceAll("\f", "")) != "") {

     sendMessage(sendStr);

    }

    textEditor.setText("");

  // 模拟發送消息

  private void sendMessage(String sendStr) {

   messages.add(new ChatMessage(ChatMessage.MESSAGE_TO, sendStr));

   chatHistoryAdapter.notifyDataSetChanged();

 };