仿微信-界面动画(9)--ListView有不同类别Item

这次主要讲述的是如何实现微信聊天界面~
难点~不同种类的Item的组合
实现效果如下：

只是简单的界面设计，因此~无法实现真正的对话~切对话内容是源代码中明确写出的，这里主要是讲解的是不同Item的ListView的实现；

涉及到了，chatmsg实体，适配器等等~

根据类型的不同~分为两种R.layout.chatting_item_msg_text_left和R.layout.chatting_item_msg_text_right

示意图如下：


效果显而易见，看代码吧~

ChatActivity源码

package cn.buaa.myweixin;import java.util.ArrayList;import java.util.Calendar;import java.util.List;import android.app.Activity;import android.content.Intent;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.view.WindowManager;import android.widget.Button;import android.widget.EditText;import android.widget.ListView;public class ChatActivity extends Activity implements OnClickListener{    /** Called when the activity is first created. */    private Button mBtnSend;    private Button mBtnBack;    private EditText mEditTextContent;    private ListView mListView;    private ChatMsgViewAdapter mAdapter;    private List<ChatMsgEntity> mDataArrays = new ArrayList<ChatMsgEntity>();    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.chat_xiaohei);        //启动activity时不自动弹出软键盘        getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN);         initView();        initData();    }    public void initView()    {        mListView = (ListView) findViewById(R.id.listview);        mBtnSend = (Button) findViewById(R.id.btn_send);        mBtnSend.setOnClickListener(this);        mBtnBack = (Button) findViewById(R.id.btn_back);        mBtnBack.setOnClickListener(this);        mEditTextContent = (EditText) findViewById(R.id.et_sendmessage);    }    private String[]msgArray = new String[]{"你好啊，我是小黑，你呢？", "我是人马，很高兴认识你", "我也是", "一起玩会游戏？",                                             "可以啊，但是我好久没玩了，可能比较坑", "没事啊，我也有点不会玩的",                                            "不解释，哈哈哈哈", "gogogo~~~",};    private String[]dataArray = new String[]{"2016-09-01 18:00", "2016-09-01 18:10",                                             "2016-09-01 18:11", "2016-09-01 18:20",                                             "2016-09-01 18:30", "2016-09-01 18:35",                                             "2016-09-01 18:40", "2016-09-01 18:50"};     private final static int COUNT = 8;    public void initData()    {        for(int i = 0; i < COUNT; i++)        {            ChatMsgEntity entity = new ChatMsgEntity();            entity.setDate(dataArray[i]);            if (i % 2 == 0)            {                entity.setName("小黑");                entity.setMsgType(true);            }else{                entity.setName("人马");                entity.setMsgType(false);            }            entity.setText(msgArray[i]);            mDataArrays.add(entity);        }        mAdapter = new ChatMsgViewAdapter(this, mDataArrays);        mListView.setAdapter(mAdapter);    }    @Override    public void onClick(View v) {        // TODO Auto-generated method stub        switch(v.getId())        {        case R.id.btn_send:            send();            break;        case R.id.btn_back:            finish();            break;        }    }    private void send()    {        String contString = mEditTextContent.getText().toString();        if (contString.length() > 0)        {            ChatMsgEntity entity = new ChatMsgEntity();            entity.setDate(getDate());            entity.setName("人马");      //我是人马，都是以人马的口吻进行的发送            entity.setMsgType(false);            entity.setText(contString);            mDataArrays.add(entity);            mAdapter.notifyDataSetChanged(); //提示适配器更新            mEditTextContent.setText(""); //清空editText            mListView.setSelection(mListView.getCount() - 1);        }    }    private String getDate() {        Calendar c = Calendar.getInstance();        String year = String.valueOf(c.get(Calendar.YEAR));        String month = String.valueOf(c.get(Calendar.MONTH) + 1);        String day = String.valueOf(c.get(Calendar.DAY_OF_MONTH));        String hour = String.valueOf(c.get(Calendar.HOUR_OF_DAY));        String mins = String.valueOf(c.get(Calendar.MINUTE));        StringBuffer sbBuffer = new StringBuffer();        sbBuffer.append(year + "-" + month + "-" + day + " " + hour + ":" + mins);         return sbBuffer.toString();    }    public void head_xiaohei(View v) {     //标题栏 返回按钮        Intent intent = new Intent (ChatActivity.this,InfoXiaohei.class);                   startActivity(intent);        } }

ChatMsgViewAdapter源码

package cn.buaa.myweixin;import android.content.Context;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.TextView;import java.util.List;public class ChatMsgViewAdapter extends BaseAdapter {    public static interface IMsgViewType    {        int IMVT_COM_MSG = 0;        int IMVT_TO_MSG = 1;    }    private static final String TAG = ChatMsgViewAdapter.class.getSimpleName();    private List<ChatMsgEntity> coll;    private Context ctx;    private LayoutInflater mInflater;    public ChatMsgViewAdapter(Context context, List<ChatMsgEntity> coll) {        ctx = context;        this.coll = coll;        mInflater = LayoutInflater.from(context);    }    @Override    public int getCount() {        return coll.size();    }    @Override    public Object getItem(int position) {        return coll.get(position);    }    @Override    public long getItemId(int position) {        return position;    }    @Override    public int getItemViewType(int position) {        // TODO Auto-generated method stub        ChatMsgEntity entity = coll.get(position);        if (entity.getMsgType())        {            return IMsgViewType.IMVT_COM_MSG;        }else{            return IMsgViewType.IMVT_TO_MSG;        }    }    @Override    public int getViewTypeCount() {        // TODO Auto-generated method stub        return 2;    }    @Override    public View getView(int position, View convertView, ViewGroup parent) {        ChatMsgEntity entity = coll.get(position);        boolean isComMsg = entity.getMsgType();        ViewHolder viewHolder = null;           if (convertView == null)        {              if (isComMsg)              {                  convertView = mInflater.inflate(R.layout.chatting_item_msg_text_left, null);              }else{                  convertView = mInflater.inflate(R.layout.chatting_item_msg_text_right, null);              }              viewHolder = new ViewHolder();              viewHolder.tvSendTime = (TextView) convertView.findViewById(R.id.tv_sendtime);              viewHolder.tvUserName = (TextView) convertView.findViewById(R.id.tv_username);              viewHolder.tvContent = (TextView) convertView.findViewById(R.id.tv_chatcontent);              viewHolder.isComMsg = isComMsg;              convertView.setTag(viewHolder);        }else{            viewHolder = (ViewHolder) convertView.getTag();        }        viewHolder.tvSendTime.setText(entity.getDate());        viewHolder.tvUserName.setText(entity.getName());        viewHolder.tvContent.setText(entity.getText());        return convertView;    }    static class ViewHolder {         public TextView tvSendTime;        public TextView tvUserName;        public TextView tvContent;        public boolean isComMsg = true;    }}

ChatMsgEntity源码

package cn.buaa.myweixin;public class ChatMsgEntity {    private static final String TAG = ChatMsgEntity.class.getSimpleName();    private String name;    private String date;    private String text;    private boolean isComMeg = true;    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;    }    public String getDate() {        return date;    }    public void setDate(String date) {        this.date = date;    }    public String getText() {        return text;    }    public void setText(String text) {        this.text = text;    }    public boolean getMsgType() {        return isComMeg;    }    public void setMsgType(boolean isComMsg) {        isComMeg = isComMsg;    }    public ChatMsgEntity() {    }    public ChatMsgEntity(String name, String date, String text, boolean isComMsg) {        super();        this.name = name;        this.date = date;        this.text = text;        this.isComMeg = isComMsg;    }}

R.layout.chatting_item_msg_text_left

<?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="wrap_content"        android:orientation="vertical"        android:padding="6dp">        <LinearLayout            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:orientation="vertical"             android:gravity="center_horizontal">            <TextView                android:id="@+id/tv_sendtime"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                style="@style/chat_text_date_style"/>        </LinearLayout>        <RelativeLayout            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:layout_marginTop="5dp"            android:layout_marginLeft="5dp" >                <ImageView                    android:id="@+id/iv_userhead"                    android:layout_width="52dp"                   android:layout_height="52dp"                   android:clickable="true"                   android:onClick="head_xiaohei"                   android:layout_alignParentLeft="true"                    android:layout_alignParentTop="true"                    android:background="@drawable/xiaohei"/>                <TextView                 android:id="@+id/tv_chatcontent"                 android:layout_toRightOf="@id/iv_userhead"                android:layout_marginLeft="10dp"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:background="@drawable/chatfrom_bg"                 style="@style/chat_content_date_style"/>                   <TextView                 android:id="@+id/tv_username"                 android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_below="@id/iv_userhead"                android:layout_alignParentLeft="true"                android:layout_toLeftOf="@id/tv_chatcontent"                style="@style/chat_text_name_style"/>        </RelativeLayout></LinearLayout>

R.layout.chatting_item_msg_text_right

<?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="wrap_content"        android:orientation="vertical"        android:padding="6dp" >        <LinearLayout            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:orientation="vertical"             android:gravity="center_horizontal">            <TextView            android:id="@+id/tv_sendtime"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:padding="2dp"            android:textColor="#ffffff"            android:textSize="12sp"            android:background="#bfbfbf"/>        </LinearLayout>        <RelativeLayout            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:layout_marginTop="5dp"            android:layout_marginRight="5dp" >               <ImageView                android:id="@+id/iv_userhead"                android:layout_width="52dp"               android:layout_height="52dp"               android:focusable="false"                android:layout_alignParentRight="true"                android:layout_alignParentTop="true"                android:background="@drawable/renma"/>                <TextView                 android:id="@+id/tv_chatcontent"                 android:layout_toLeftOf="@id/iv_userhead"                android:layout_marginRight="10dp"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:background="@drawable/chatto_bg"                 android:textSize="15sp"                android:textColor="#ff000000"                android:gravity="left|center"                android:minHeight="50dp"                 android:lineSpacingExtra="2dp"                android:clickable="true"                android:focusable="true"/>                   <TextView                 android:id="@+id/tv_username"                 android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_below="@id/iv_userhead"                android:layout_alignParentRight="true"                android:layout_toRightOf="@id/tv_chatcontent"                android:textSize="15sp"                android:gravity="center"                android:textColor="#818181"/>        </RelativeLayout></LinearLayout>

R.layout.chat_xiaohei

<?xml version="1.0" encoding="utf-8"?><RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"  android:layout_width="fill_parent"  android:layout_height="fill_parent"  android:background="@drawable/chat_bg_default" >    <RelativeLayout         android:id="@+id/rl_layout"            android:layout_width="fill_parent"            android:layout_height="45dp"            android:background="@drawable/title_bar"            android:gravity="center_vertical"  >             <Button            android:id="@+id/btn_back"            android:layout_width="70dp"            android:layout_height="wrap_content"            android:layout_centerVertical="true"            android:text="返回"            android:textSize="14sp"            android:textColor="#fff"            android:onClick="chat_back"            android:background="@drawable/title_btn_back"            />                <TextView                android:layout_width="wrap_content"                 android:layout_height="wrap_content"                 android:text="小黑"                android:layout_centerInParent="true"                android:textSize="20sp"                     android:textColor="#ffffff" />             <ImageButton                 android:id="@+id/right_btn"                android:layout_width="67dp"                 android:layout_height="wrap_content"                android:layout_alignParentRight="true"                 android:layout_centerVertical="true"                android:layout_marginRight="5dp"                android:src="@drawable/mm_title_btn_contact_normal"                android:background="@drawable/title_btn_right"                />              </RelativeLayout>   <RelativeLayout        android:id="@+id/rl_bottom"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:background="@drawable/chat_footer_bg" >        <Button        android:id="@+id/btn_send"        android:layout_width="60dp"        android:layout_height="40dp"        android:layout_alignParentRight="true"        android:layout_marginRight="10dp"        android:layout_centerVertical="true"        android:text="发送"        android:background="@drawable/chat_send_btn" />        <EditText        android:id="@+id/et_sendmessage"        android:layout_width="fill_parent"        android:layout_height="40dp"        android:layout_toLeftOf="@id/btn_send"        android:layout_marginLeft="10dp"        android:layout_marginRight="10dp"        android:background="@drawable/login_edit_normal"        android:layout_centerVertical="true"        android:singleLine="true"        android:textSize="18sp"/>    </RelativeLayout>    <ListView    android:id="@+id/listview"    android:layout_below="@id/rl_layout"    android:layout_above="@id/rl_bottom"    android:layout_width="fill_parent"    android:layout_height="fill_parent"        android:divider="@null"    android:dividerHeight="5dp"    android:stackFromBottom="true"    android:scrollbarStyle="outsideOverlay"     android:cacheColorHint="#0000"/></RelativeLayout>

直接上代码了，看了之前的实例的小伙伴们应该都看的很清楚啦~就不赘述了~，谢谢~