码迷，mamicode.com
首页 > 微信 > 详细

类似微信的ChattingUi

时间：2015-06-09 20:06:52      阅读：364      评论：0      收藏：0      [点我收藏+]

标签：微信 adapter   getitemviewtype   oncreate   

技术分享

先看主页面布局

activity_imitate_weixin_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#f0f0e0" >


    <RelativeLayout
        android:id="@+id/rl_bottom"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@drawable/weixin_layout_bg1" >

        <Button
            android:id="@+id/btn_send"
            android:layout_width="60dp"
            android:layout_height="40dp"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:layout_marginRight="10dp"
            android:text="发送" />

        <EditText
            android:id="@+id/et_sendmessage"
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:layout_centerVertical="true"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_toLeftOf="@id/btn_send"
            android:background="@drawable/weixin_edittext1"
            android:singleLine="true"
            android:textSize="18sp" />
    </RelativeLayout>

    <ListView
        android:id="@+id/listview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_above="@id/rl_bottom"
        android:layout_marginLeft="10.0dip"
        android:layout_marginRight="10.0dip"
        android:layout_marginTop="10.0dip"
        android:cacheColorHint="#00000000"
        android:divider="@null"
        android:dividerHeight="5dp"
        android:scrollbars="none" />

</RelativeLayout>

再看入口WeixinChatDemoActivity

package com.example.weixindemo;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ListView;
/**
 * 仿微信主页面
 */
public class WeixinChatDemoActivity extends Activity implements OnClickListener {

	private Button mBtnSend;// 发送btn
	private EditText mEditTextContent;
	private ListView mListView;
	private ChatMsgViewAdapter mAdapter;// 消息视图的Adapter
	private List<ChatMsgEntity> mDataArrays = new ArrayList<ChatMsgEntity>();// 消息对象数组

	private final static int COUNT = 1;// 初始化数组总数

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_imitate_weixin_main);
		initView();
	}
	
	public void initView() {
		mListView = (ListView) findViewById(R.id.listview);
		mBtnSend = (Button) findViewById(R.id.btn_send);
		mEditTextContent = (EditText) findViewById(R.id.et_sendmessage);
		initData();// 初始化数据
		
		mBtnSend.setOnClickListener(this);
		mListView.setSelection(mAdapter.getCount() - 1);
	}

	
	/**
	 * 模拟加载消息历史，实际开发可以从数据库中读出
	 */
	public void initData() {
		for (int i = 0; i < COUNT; i++) {
			ChatMsgEntity entity = new ChatMsgEntity();
			entity.setDate("2012-09-22 18:00:02");
			if (i % 2 == 0) {
				entity.setName("他人");
				entity.setMsgType(true);// 收到的消息
			} else {
				entity.setName("本人");
				entity.setMsgType(false);// 自己发送的消息
			}
			entity.setMessage("今晚去网吧包夜吧？");
			mDataArrays.add(entity);
		}

		mAdapter = new ChatMsgViewAdapter(this, mDataArrays);
		mListView.setAdapter(mAdapter);
	}

	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case R.id.btn_send:// 发送按钮点击事件
			send();
			break;
		}
	}

	/**
	 * 发送消息
	 */
	private void send() {
		String contString = mEditTextContent.getText().toString();
		if (contString.length() > 0) {
			ChatMsgEntity entity = new ChatMsgEntity();
			entity.setName("本人");
			entity.setDate(getDate());
			entity.setMessage(contString);
			entity.setMsgType(false);

			mDataArrays.add(entity);
			mAdapter.notifyDataSetChanged();// 通知ListView，数据已发生改变

			mEditTextContent.setText("");// 清空编辑框数据

			mListView.setSelection(mListView.getCount() - 1);// 发送一条消息时，ListView显示选择最后一项
		}
	}

	/**
	 * 发送消息时，获取当前事件
	 * 
	 * @return 当前时间
	 */
	private String getDate() {
		SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd hh:mm:ss");
		return format.format(new Date());
	}

	
}

再看适配器

ChatMsgViewAdapter

package com.example.weixindemo;
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;
/**
 * 消息ListView的Adapter
 */
public class ChatMsgViewAdapter extends BaseAdapter {

	private List<ChatMsgEntity> coll;// 消息对象数组
	private LayoutInflater mInflater;

	public ChatMsgViewAdapter(Context context, List<ChatMsgEntity> coll) {
		this.coll = coll;
		mInflater = LayoutInflater.from(context);
	}

	/*****************************************************/
	//得到Item的类型，是对方发过来的消息，还是自己发送出去的
	public int getItemViewType(int position) {
		return coll.get(position).getMsgType()?1:0;
	}
	//Item类型的总数
	public int getViewTypeCount() {
		return 2;
	}
	/******************************************************/
	public int getCount() {
		return coll.size();
	}

	public Object getItem(int position) {
		return coll.get(position);
	}

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


	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.activity_imitate_weixin_chatting_item_msg_text_left, null);
			} else {
				convertView = mInflater.inflate(
						R.layout.activity_imitate_weixin_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.getMessage());
		return convertView;
	}

	static class ViewHolder {
		public TextView tvSendTime;
		public TextView tvUserName;
		public TextView tvContent;
		public boolean isComMsg = true;
	}

}

另外还辅助的bean类

ChatMsgEntity

package com.example.weixindemo;

/**
 * 一个消息的JavaBean
 */
public class ChatMsgEntity {
	private String name;//消息来自
	private String date;//消息日期
	private String message;//消息内容
	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 getMessage() {
		return message;
	}

	public void setMessage(String message) {
		this.message = message;
	}

	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.message = text;
		this.isComMeg = isComMsg;
	}

}

另外还有聊天界面本人、他人的布局文件

activity_imitate_weixin_chatting_item_msg_text_left.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    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:gravity="center_horizontal"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/tv_sendtime"
            style="@style/chat_text_date_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp" >

        <ImageView
            android:id="@+id/iv_userhead"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:background="@drawable/weixin_mini_avatar_shadow"
            android:focusable="false" />

        <TextView
            android:id="@+id/tv_chatcontent"
            style="@style/chat_content_date_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_toRightOf="@id/iv_userhead"
            android:background="@drawable/weixin_chatfrom_bg_normal" />

        <TextView
            android:id="@+id/tv_username"
            style="@style/chat_text_name_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_below="@id/iv_userhead"
            android:layout_toLeftOf="@id/tv_chatcontent" />
    </RelativeLayout>

</LinearLayout>

activity_imitate_weixin_chatting_item_msg_text_right.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    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:gravity="center_horizontal"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/tv_sendtime"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#bfbfbf"
            android:padding="2dp"
            android:textColor="#ffffff"
            android:textSize="12sp" />
    </LinearLayout>

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp" >

        <ImageView
            android:id="@+id/iv_userhead"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:background="@drawable/weixin_mini_avatar_shadow"
            android:focusable="false" />

        <TextView
            android:id="@+id/tv_chatcontent"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dp"
            android:layout_toLeftOf="@id/iv_userhead"
            android:background="@drawable/weixin_chatto_bg_normal"
            android:clickable="true"
            android:focusable="true"
            android:gravity="left|center"
            android:lineSpacingExtra="2dp"
            android:minHeight="50dp"
            android:textColor="#ff000000"
            android:textSize="15sp" />

        <TextView
            android:id="@+id/tv_username"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_below="@id/iv_userhead"
            android:layout_toRightOf="@id/tv_chatcontent"
            android:gravity="center"
            android:textColor="#818181"
            android:textSize="15sp" />
    </RelativeLayout>

</LinearLayout>


类似微信的ChattingUi

标签：微信 adapter   getitemviewtype   oncreate   

原文地址：http://blog.csdn.net/u013210620/article/details/46430003
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！