码迷,mamicode.com
首页 > 其他好文 > 详细

聊天ListView

时间:2017-11-12 14:09:09      阅读:169      评论:0      收藏:0      [点我收藏+]

标签:black   system   base   height   amp   and   encoding   else   rate   

我们知道,在微信或者QQ聊天的时候,会出现至少两种布局,即收到的消息和自己发送的消息,这种效果可以用listView来实现。类似于下面这样的界面。

技术分享

主要在Adapter的getView()里面下笔。

package com.example.chatting.chatting.adapter;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import com.example.chatting.chatting.R;
import com.example.chatting.chatting.bean.Chat;

import org.w3c.dom.Text;

import java.util.List;

/**
 * Created by Administrator on 2017/11/9.
 */
public class ChattingAdapter extends BaseAdapter{

    private List<Chat> list;
    private LayoutInflater inflater;
    private Context mContext;
//    private Drawable mDefaultHeadImage;

    public ChattingAdapter(List<Chat> list, Context context){
        this.list = list;
        inflater = LayoutInflater.from(context);
        mContext = context;
//        mDefaultHeadImage = mContext.getResources().getDrawable(R.drawable.image_head);
    }

    @Override
    public int getCount() {
        return list.size();
    }

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

    @Override
    public long getItemId(int position) {
        return position;
    }
    @Override
    public int getItemViewType(int position) {
        return list.get(position).getType();
    }

//一定得重写该方法,否则只会出现一种布局 @Override
public int getViewTypeCount() { // TODO Auto-generated method stub return 2; } @Override public View getView(int position, View convertView, ViewGroup parent) { Chat chat = (Chat) getItem(position); int type = getItemViewType(position); ViewHolder viewHolder; if(convertView == null){ if(type == 0) { // 我说的消息 System.out.println("****type0"); viewHolder = new ViewHolder(); convertView = inflater.inflate(R.layout.list_chat_out, null); viewHolder.tvName = (TextView)convertView.findViewById(R.id.tv_name_out); viewHolder.tvMsg = (TextView)convertView.findViewById(R.id.tv_msg_out); viewHolder.headImage = (ImageView)convertView.findViewById(R.id.image_head_out); }else{ System.out.println("****type1"); viewHolder = new ViewHolder(); convertView = inflater.inflate(R.layout.list_chat_in, null); viewHolder.tvName = (TextView)convertView.findViewById(R.id.tv_name_in); viewHolder.tvMsg = (TextView)convertView.findViewById(R.id.tv_msg_in); viewHolder.headImage = (ImageView)convertView.findViewById(R.id.image_head_in); } convertView.setTag(viewHolder); }else{ viewHolder = (ViewHolder)convertView.getTag(); } viewHolder.tvName.setText(chat.getNickName()); viewHolder.tvMsg.setText(chat.getMessage()); return convertView; } private class ViewHolder{ public TextView tvName, tvMsg; public ImageView headImage; } }

  通过

  @Override

    public int getItemViewType(int position) {

        return list.get(position).getType();
    }

来决定实例化哪个布局,

通过
@Override
    public int getViewTypeCount() {
        // TODO Auto-generated method stub
        return 2;
    }
来决定布局的类型个数。

chat为封装聊天内容的java类:
package com.example.chatting.chatting.bean;

import java.io.Serializable;

/**
 * Created by Administrator on 2017/11/9.
 */
public class Chat implements Serializable{
    private String message;
    private int type;
    private String NickName;
    private String imgURL;

    public String getMessage() {
        return message;
    }

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

    public int getType() {
        return type;
    }

    public void setType(int type) {
        this.type = type;
    }

    public String getNickName() {
        return NickName;
    }

    public void setNickName(String nickName) {
        NickName = nickName;
    }

    public String getImgURL() {
        return imgURL;
    }

    public void setImgURL(String imgURL) {
        this.imgURL = imgURL;
    }
}

 

 接下来是两个布局的代码:
1、
list_chat_out:发送消息的布局

<?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:minHeight="80dp" >
        
      <ImageView
          android:id="@+id/image_head_out"
          android:layout_width="45dp"
          android:layout_height="45dp"
          android:src="@mipmap/me_press"
          android:layout_alignParentRight="true"/>
       
      <TextView
        android:id="@+id/tv_name_out"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@id/image_head_out"
        android:layout_alignTop="@id/image_head_out"
        android:layout_marginRight="5dp"
        android:textColor="@color/colorTheme"
        android:textSize="14sp"
        android:text="name"/>
      
      <LinearLayout 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:minHeight="40dp"
        android:layout_toLeftOf="@id/image_head_out"
        android:layout_below="@id/tv_name_out"
        android:layout_marginRight="10dp"
        android:background="@color/colorTheme"
        android:gravity="center_vertical">
        <TextView
            android:id="@+id/tv_msg_out"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:textColor="@color/colorBlack"
            android:textSize="18sp"
            android:text="content"/>
       </LinearLayout>

</RelativeLayout>
2、list_chat_in:接收消息的布局
<?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:minHeight="80dp" >
        
      <ImageView
        android:id="@+id/image_head_in"
        android:layout_width="45dp"
        android:layout_height="45dp"
          android:src="@mipmap/me_press"
          />
       
      <TextView
          android:id="@+id/tv_name_in"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/image_head_in"
        android:layout_alignTop="@id/image_head_in"
        android:layout_marginLeft="5dp"
        android:textColor="@color/colorTheme"
        android:textSize="14sp"
        android:text="name"/>
      
      <LinearLayout 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:minHeight="40dp"
        android:layout_toRightOf="@id/image_head_in"
        android:layout_below="@id/tv_name_in"
        android:layout_marginLeft="10dp"
        android:background="@color/colorGray"
        android:gravity="center_vertical">
        <TextView
            android:id="@+id/tv_msg_in"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="15dp"
            android:layout_marginLeft="15dp"
            android:textColor="@color/colorBlack"
            android:textSize="18sp"
            android:text="content"/>
       </LinearLayout>

</RelativeLayout>

 

 

 

 

聊天ListView

标签:black   system   base   height   amp   and   encoding   else   rate   

原文地址:http://www.cnblogs.com/tangZH/p/7821432.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!