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"
xmlns:android="http://schemas.android.com/apk/res/android">
<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:
<?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"
xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:id="@+id/chatting_time_tv"
style="@style/ChattingUISplit" />
<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_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:
android:id="@+id/chatting_content_itv"
android:background="@drawable/chatto_bg"
style="@style/ChattingUIText" />
</LinearLayout>
</LinearLayout>
chatting_title_bar.xml
<?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="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="测试用户"
/>
<TextView
android:id="@+id/chatting_contact_status"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="@null"
android:text="正在输入..."
android:textSize="16sp"
android:textColor="@color/white"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:padding="3dip"
android:layout_toRightOf="@id/chatting_contact_name"
android:visibility="gone"
/>
</RelativeLayout>
chatting.xml
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout
android:id="@+id/chat_root"
android:focusable="false"
android:focusableInTouchMode="false"
android:background="@drawable/nav_page"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<ListView
android:id="@+id/chatting_history_lv"
android:background="@null"
android:scrollbars="vertical"
android:layout_width="fill_parent"
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:orientation="horizontal"
android:background="@drawable/txt_msg_bg"
android:paddingRight="7.0dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
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:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/sms_insert" />
<EditText
android:textColorHint="@color/search_hint"
android:layout_gravity="center_vertical"
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_height="wrap_content"
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:
android:layout_weight="1.0"
android:inputType="textCapSentences|textAutoCorrect|textMultiLine|textShortMessage"
android:imeOptions="actionSend|flagNoEnterAction" />
<Button
android:gravity="center"
android:layout_gravity="center_vertical"
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"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</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) {
this.direction = direction;
}
public void setContent(String content) {
this.content = 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) {
super();
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.View;
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_FROM, "欢迎光临我的博客,http://hi.csdn.net/lyfi01"));
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();
}
};
}
转自:http://blog.sina.com.cn/s/blog_80723de80100vnxg.html
android 实现qq聊天对话界面效果的更多相关文章
- Android仿QQ复制昵称效果
本文同步自http://javaexception.com/archives/76 背景: 这几天做一个复制文本的需求,突然看到QQ上复制昵称跟QQ号的效果,觉得很不错,就想要模仿一波,办法比较简单粗 ...
- Android——仿QQ聊天撒花特效
实现这样的效果,你要知道贝塞尔曲线,何谓贝塞尔曲线?其实就是曲线,嘿嘿,关于曲线的概念大家可以去 Android绘图机制(二)——自定义View绘制形, 圆形, 三角形, 扇形, 椭圆, 曲线,文字和 ...
- 【HTML5】实现QQ聊天气泡效果
今天自己用 HTML/CSS 做了个类似QQ的聊天气泡,以下是效果图: 以下说下关键地方的样式设置.然后贴出html和css代码(不多). 步骤1:布局 消息採用div+float布局,每条消息用一个 ...
- Android仿QQ复制昵称效果2
本文同步自http://javaexception.com/archives/77 背景: 在上一篇文章中,给出了一种复制QQ效果的方案,今天就来讲讲换一种方式实现.主要依赖的是一个开源项目https ...
- Android特效专辑(六)——仿QQ聊天撒花特效,无形装逼,最为致命
Android特效专辑(六)--仿QQ聊天撒花特效,无形装逼,最为致命 我的关于特效的专辑已经在CSDN上申请了一个专栏--http://blog.csdn.net/column/details/li ...
- Android—简单的仿QQ聊天界面
最近仿照QQ聊天做了一个类似界面,先看下界面组成(画面不太美凑合凑合呗,,,,):
- Android 开发笔记___textview_聊天室效果
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...
- android采用MVP完整漫画APP、钉钉地图效果、功能完善的音乐播放器、仿QQ动态登录效果、触手app主页等源码
Android精选源码 一个可以上拉下滑的Ui效果,觉得好看可以学学 APP登陆页面适配 一款采用MVP的的完整漫画APP源码 android实现钉钉地图效果源码 一个使用单个文字生成壁纸图片的app ...
- reactnative实现qq聊天消息气泡拖拽消失效果
前言(可跳过) 我在开发自己的APP时遇到了一个类似于qq聊天消息气泡拖拽消息的需求,因为在网上没有找到相关的组件,所以自己动手实现了一下 需求:对聊天消息气泡拖拽到一定长度松开时该气泡会消失(可自行 ...
随机推荐
- Python环境右键定制
有时候,我们需要将py打包成exe.需要将ui转换成py.需要将py转换成pyc等等,命令行操作起来有点繁琐.所以做了这个教程: 1. py打包成exe 先安装cx_freeze,参照教程:http: ...
- 在Linux下使用sprintf代替atoi实现整型转化为char*
程序中需要用到将整型转化为char*类型,然后将两个char*类型的变量拼接.将整型转化为char*自然想到了itoa函数: 头文件:#include <stdio.h> char *it ...
- C#中List<T>是怎么存放元素的
Jeffrey Zhao在"你的字典里有多少元素?"一文中,提到了他在面试时问过的一个问题:List<T>是怎么存放元素?不幸的是,自己也回答不出来,只知道怎么用,却不 ...
- 初次使用SQL调优建议工具--SQL Tuning Advisor
在10g中,Oracle推出了自己的SQL优化辅助工具: SQL优化器(SQL Tuning Advisor :STA),它是新的DBMS_SQLTUNE包. 使用STA一定要保证优化器是CBO模式下 ...
- Coursera课程《Python数据结构》中课件
You can access the Google Drive containing all of the current and in-progress lecture slides for thi ...
- POJ 1270 Following Orders
Following Orders Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 4902 Accepted: 1982 ...
- 数学图形之Kuen Surface
Kuen Surface应该又是一个以数学家名字命名的曲面.本文将展示几种Kuen Surface的生成算法和切图,其中有的是标准的,有的只是相似.使用自己定义语法的脚本代码生成数学图形.相关软件参见 ...
- strtok()函数
strtok()这个函数大家都应该碰到过,但好像总有些问题, 这里着重讲下它 首先看下MSDN上的解释: char *strtok( char *strToken, const char *strDe ...
- go语言基础之二维数组
1.二维数组 示例: package main //必须有个main包 import "fmt" func main() { //有多少个[]就是多少维 //有多少个[]就用多少个 ...
- Android动画-补间(Tween)动画
Android动画的两种方式,其中帧动画上篇文章已经讲了,这次主要讲解的就是补间动画,补间动画就是动画业务场景中常用的旋转,平移,缩放,和渐变效果,帧动画是通过轮播动画实现动画效果,补间动画通过在两个 ...