QQ聊天

QQ聊天主界面

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<LinearLayout
android:id="@+id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="QQ聊天"
android:textColor="#ffffff"
android:background="#0779DB"
android:textSize="20sp"
android:gravity="center"/>
</LinearLayout>
<ListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:divider="@null"
android:cacheColorHint="#00000000"
android:background="@drawable/listview_background">
</ListView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:gravity="center_vertical">
<ImageView
android:id="@+id/imageview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/dvb"/>
<Button
android:id="@+id/button_send_left"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@drawable/but"
android:text="发送"
android:layout_marginLeft="10dp"/>
<EditText
android:id="@+id/edittext"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="2"
android:hint="请输入内容"
android:background="@mipmap/et_box"
android:layout_margin="2dp"/>
<Button
android:id="@+id/button_send_righht"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@drawable/but"
android:text="发送"/>
</LinearLayout>
<GridView
android:id="@+id/girdview"
android:layout_width="match_parent"
android:layout_height="200dp"
android:numColumns="6">

</GridView>
</LinearLayout>

聊天人物

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/textview_time"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="星期五 14:20"
android:textColor="#000000"
android:gravity="center"
android:padding="10dp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/imageview_head"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/ic_launcher"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@+id/textview_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="营长"
android:textColor="#000000"
android:textSize="15dp"
android:padding="10dp"
android:background="@drawable/text_back" />
<TextView
android:id="@+id/textview_nickname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="昵称"
android:textColor="#000000"
android:textSize="15dp"
android:padding="10dp"/>
</LinearLayout>
<TextView
android:id="@+id/textview_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我是内容啊手机的萨克的凯撒的卡按时打卡时间的撒娇看得见啊大家撒娇的骄傲打手机点卡技术"
android:background="@mipmap/qq"
android:padding="10dp"
android:layout_marginRight="50dp"/>
</LinearLayout>
</LinearLayout>

</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/textview_time"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="星期五 14:20"
android:textColor="#000000"
android:gravity="center"
android:padding="10dp"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right">

<TextView
android:id="@+id/textview_nickname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="昵称"
android:textColor="#000000"
android:textSize="15dp"
android:padding="10dp"/>
<TextView
android:id="@+id/textview_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="营长"
android:textColor="#000000"
android:textSize="15dp"
android:padding="10dp"
android:background="@drawable/text_back" />
</LinearLayout>
<TextView
android:id="@+id/textview_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我是内容啊手机的手机点卡技术"
android:background="@mipmap/qq"
android:padding="10dp"
android:layout_marginLeft="50dp"/>
</LinearLayout>
<ImageView
android:id="@+id/imageview_head"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/ic_launcher"/>
</LinearLayout>

</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ImageView
android:id="@+id/imageview_expression"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/dja"
android:padding="10dp"/>

</LinearLayout>

用gridview添加表情

往gridview中添加表情图片

public class ExpressionAdapter extends BaseAdapter {
private LayoutInflater mInflater;
private int  [] mData={R.mipmap.dja,R.mipmap.djb,R.mipmap.dje,R.mipmap.djf,R.mipmap.djg,R.mipmap.djh,R.mipmap.dji,R.mipmap.djj,
R.mipmap.djk,R.mipmap.djl,R.mipmap.djm,R.mipmap.djn,R.mipmap.djo,R.mipmap.djp,R.mipmap.djq,R.mipmap.djr,
R.mipmap.djs,R.mipmap.djt,R.mipmap.dju,R.mipmap.djv,R.mipmap.djw,R.mipmap.djx,R.mipmap.djy,R.mipmap.djz,};

public ExpressionAdapter(LayoutInflater mInflater) {
this.mInflater = mInflater;
}

@Override
public int getCount() {
return mData.length;
}

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

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

@Override
public View getView(int position, View convertView, ViewGroup parent) {
viewHoder vh=null;
if (convertView==null){
convertView=  mInflater.inflate(R.layout.activity_expression,null);
vh=new viewHoder();
vh.imageView= (ImageView) convertView.findViewById(R.id.imageview_expression);
convertView.setTag(vh);
}
vh= (viewHoder) convertView.getTag();
vh.imageView.setImageResource(mData[position]);
return convertView;
}
class viewHoder{
ImageView imageView;
}
}

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<GridView
android:id="@+id/girdview_pop"
android:layout_width="match_parent"
android:layout_height="200dp"
android:numColumns="5"></GridView>

</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ImageView
android:id="@+id/imageview_expression"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/dja"
android:padding="10dp"/>

</LinearLayout>

主界面

public class Chat {
private  int img;
private String title;
private String nickname;
private long time;
private  String message;
private int type;
public Chat(){

}

public Chat(int img, String title, String nickname, long time, String message) {
this.img = img;
this.title = title;
this.nickname = nickname;
this.time = time;
this.message = message;
}

public int getType() {
return type;
}

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

public int getImg() {
return img;
}

public void setImg(int img) {
this.img = img;
}

public String getTitle() {
return title;
}

public void setTitle(String title) {
this.title = title;
}

public String getNickname() {
return nickname;
}

public void setNickname(String nickname) {
this.nickname = nickname;
}

public long getTime() {
return time;
}

public void setTime(long time) {
this.time = time;
}

public String getMessage() {
return message;
}

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

向主界面中添加元素

public class ChatAdapter extends BaseAdapter{
private LayoutInflater mInlater;
private List<Chat> mData;
private Html.ImageGetter imageGetter;
private SimpleDateFormat format;
public static final int MESSAGE_LEFT=0;
public static final int MESSAGE_RIGHT=1;
public static final int MAX_TYPE=2;

public ChatAdapter(LayoutInflater inflater,List<Chat> data,Html.ImageGetter imageGetter){
this.mInlater=inflater;
this.mData=data;
this.imageGetter=imageGetter;
format=new SimpleDateFormat("EEE HH:mm");

}

@Override
public int getViewTypeCount() {
return MAX_TYPE;
}

@Override
public int getItemViewType(int position) {
return mData.get(position).getType();
}

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

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

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

@Override
public View getView(int position, View convertView, ViewGroup parent) {
viewHoder vh=null;
viewHoderRight vhr=null;
int  type=getItemViewType(position);
if (convertView==null){
switch (type){
case MESSAGE_LEFT:
vh=new viewHoder();
convertView=mInlater.inflate(R.layout.activity_masege,null);
vh.imageView_head= (ImageView) convertView.findViewById(R.id.imageview_head);
vh.textView_title= (TextView) convertView.findViewById(R.id.textview_title);
vh.textView_nickname= (TextView) convertView.findViewById(R.id.textview_nickname);
vh.textView_message= (TextView) convertView.findViewById(R.id.textview_message);
vh.textView_time= (TextView) convertView.findViewById(R.id.textview_time);
convertView.setTag(vh);
break;
case MESSAGE_RIGHT:
vhr=new viewHoderRight();
convertView=mInlater.inflate(R.layout.activity_right,null);
vhr.imageView_head= (ImageView) convertView.findViewById(R.id.imageview_head);
vhr.textView_title= (TextView) convertView.findViewById(R.id.textview_title);
vhr.textView_nickname= (TextView) convertView.findViewById(R.id.textview_nickname);
vhr.textView_message= (TextView) convertView.findViewById(R.id.textview_message);
vhr.textView_time= (TextView) convertView.findViewById(R.id.textview_time);
convertView.setTag( vhr);
break;
default:
break;
}
}

Chat chat=mData.get(position);
switch (type){
case MESSAGE_LEFT :
vh= (viewHoder) convertView.getTag();
vh.imageView_head.setImageResource(chat.getImg());
vh.textView_title.setText(chat.getTitle());
vh.textView_nickname.setText(chat.getNickname());
Spanned spanned= Html.fromHtml(chat.getMessage(),imageGetter,null);
vh.textView_message.setText(spanned);
String time=format.format(chat.getTime());
vh.textView_time.setText(time);

break;
case MESSAGE_RIGHT:
vhr= (viewHoderRight) convertView.getTag();
vhr.imageView_head.setImageResource(chat.getImg());
vhr.textView_title.setText(chat.getTitle());
vhr.textView_nickname.setText(chat.getNickname());
Spanned spanned1= Html.fromHtml(chat.getMessage(),imageGetter,null);
vhr.textView_message.setText(spanned1);
String time1=format.format(chat.getTime());
vhr.textView_time.setText(time1);

break;
default:
break;

}
return convertView;
}
class viewHoder{
ImageView imageView_head;
TextView textView_title;
TextView textView_nickname;
TextView textView_message;
TextView textView_time;
}
class viewHoderRight{
ImageView imageView_head;
TextView textView_title;
TextView textView_nickname;
TextView textView_message;
TextView textView_time;
}
}

Mainactivity

public class MainActivity extends Activity implements View.OnClickListener {
private ListView mListview;
private EditText mEditText;
private Button mButton_send_Left;
private Button mButton_send_Right;
private LayoutInflater mInflater;
private List<Chat> mData=new ArrayList<>();
private ChatAdapter adapter;
private ImageView mImageView;
private Html.ImageGetter imageGetter;
private ExpressionAdapter adapter1;
private GridView mGridView;
private String [] data={"dja","djb","djc","djd","dje","djf","djg","djh","dji","djj","djk","djl","djm","djn","djo","djq","djr","djs",
"djt","dju","djv","djw","djx","djy","djz"};
private PopupWindow mPopupWindow;
private LinearLayout mLniear;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mPopupWindow=new PopupWindow(this);
View  viewPopup=getLayoutInflater().inflate(R.layout.activity_popupwindow,null);
mPopupWindow.setContentView(viewPopup);
mPopupWindow.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);
mPopupWindow.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);
//在默认情况下弹出的窗口不可定焦
mPopupWindow.setFocusable(true);
//mPopupWindow.setTouchable(true);
mGridView= (GridView)viewPopup.findViewById(R.id.girdview_pop);
mLniear= (LinearLayout) findViewById(R.id.linear);
//        mGridView= (GridView) findViewById(R.id.girdview);
mListview= (ListView) findViewById(R.id.listview);
mEditText= (EditText) findViewById(R.id.edittext);
mButton_send_Left= (Button) findViewById(R.id.button_send_left);
mButton_send_Right= (Button) findViewById(R.id.button_send_righht);
mImageView= (ImageView) findViewById(R.id.imageview);
mImageView.setOnClickListener(this);
mButton_send_Left.setOnClickListener(this);
mButton_send_Right.setOnClickListener(this);
imageGetter= new Html.ImageGetter() {
@Override
public Drawable getDrawable(String source) {
Drawable drawable=null;
if (source!=null){

Class clazz=R.mipmap.class;
try {
Field field=clazz.getDeclaredField(source);
int sourceId=field.getInt(clazz);
drawable=getResources().getDrawable(sourceId);
drawable.setBounds(0,0,drawable.getIntrinsicWidth(),drawable.getIntrinsicHeight());
} catch (NoSuchFieldException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
}
}else {
drawable = getResources().getDrawable(R.mipmap.ic_launcher);
drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
}
return drawable;
}
};
mInflater=getLayoutInflater();
adapter=new ChatAdapter(mInflater,mData,imageGetter);
mListview.setAdapter(adapter);
adapter1=new ExpressionAdapter(mInflater);
mGridView.setAdapter(adapter1);
mGridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Spanned spanned=Html.fromHtml("<img src='" + data[position] + "'/>",imageGetter,null);
mEditText.getText().insert(mEditText.getSelectionStart(),spanned);
}
});

}

@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.imageview:
//                           Spanned spanned=Html.fromHtml("<img src=''/>",imageGetter,null);
////                mEditText.getText().insert(mEditText.getSelectionStart(),spanned);
//                    if (mGridView.getVisibility() == View.VISIBLE) {
//                        mGridView.setVisibility(View.GONE);
//                    } else {
//                        mGridView.setVisibility(View.VISIBLE);
//                    }
mPopupWindow.showAsDropDown(mLniear);
break;
case R.id.button_send_left:
Chat chat=new Chat();
chat.setImg(R.mipmap.ic_launcher);
chat.setTitle("营长");
chat.setNickname("落叶");
chat.setType(ChatAdapter.MESSAGE_LEFT);
chat.setMessage(filterHtml(Html.toHtml(mEditText.getText())));
chat.setTime(System.currentTimeMillis());
mData.add(chat);
adapter.notifyDataSetChanged();
mListview.setSelection(mData.size()-1);
mEditText.setText("");
break;
case R.id.button_send_righht:
Chat chat1=new Chat();
chat1.setImg(R.mipmap.ic_launcher);
chat1.setTitle("营长");
chat1.setNickname("落叶");
chat1.setType(ChatAdapter.MESSAGE_RIGHT);
chat1.setMessage(filterHtml(Html.toHtml(mEditText.getText())));
chat1.setTime(System.currentTimeMillis());
mData.add(chat1);
adapter.notifyDataSetChanged();
mListview.setSelection(mData.size()-1);
mEditText.setText("");
default:
break;
}

}

private String filterHtml(String str) {
str = str.replaceAll("<(?!br|img)[^>]+>", "").trim();
return str;

}

}

设置主界面的背景颜色

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient android:startColor="#024EA2"
android:centerColor="#0F90ED"
android:endColor="#3DC2FA"
android:angle="270"/>
</shape>