Android仿微信气泡聊天界面设计

  微信的气泡聊天是仿iPhone自带短信而设计出来的,不过感觉还不错可以尝试一下仿着微信的气泡聊天做一个Demo,给大家分享一下!效果图如下:


  气泡聊天最终要的是素材,要用到9.png文件的素材,这样气泡会随着聊天内容的多少而改变气泡的大小且不失真。为了方便,我就直接在微信里面提取出来啦。


  聊天的内容是用ListView来显示的,将聊天的内容封装成一个ChatMsgEntity类的对象里面,然后交给自定义的ListView适配器将聊天内容显示出来。

  ChatMsgEntity.java比较简单,只是聊天的内容存储、设置和获取。

package com.example.school;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) {this.name = name;this.date = date;this.text = text;this.isComMeg = isComMsg;}
}

  显示ListView的适配器ChatMsgViewAdpater.java:

package com.example.school;import android.R.integer;
import android.content.Context;
import android.database.DataSetObserver;import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnLongClickListener;
import android.view.ViewGroup;import android.widget.BaseAdapter;
import android.widget.CheckBox;
import android.widget.LinearLayout;
import android.widget.TextView;import java.util.ArrayList;
import java.util.List;public class ChatMsgViewAdapter extends BaseAdapter {//ListView视图的内容由IMsgViewType决定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> data;private Context context;  private LayoutInflater mInflater;public ChatMsgViewAdapter(Context context, List<ChatMsgEntity> data) {this.context = context;this.data = data;mInflater = LayoutInflater.from(context);}//获取ListView的项个数public int getCount() {return data.size();}//获取项public Object getItem(int position) {return data.get(position);}//获取项的IDpublic long getItemId(int position) {return position;}//获取项的类型public int getItemViewType(int position) {// TODO Auto-generated method stubChatMsgEntity entity = data.get(position);if (entity.getMsgType()){return IMsgViewType.IMVT_COM_MSG;}else{return IMsgViewType.IMVT_TO_MSG;}}//获取项的类型数public int getViewTypeCount() {// TODO Auto-generated method stubreturn 2;}//获取Viewpublic View getView(int position, View convertView, ViewGroup parent) {ChatMsgEntity entity = data.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;}//通过ViewHolder显示项的内容static class ViewHolder { public TextView tvSendTime;public TextView tvUserName;public TextView tvContent;public boolean isComMsg = true;}}

  对方发来消息的显示布局chatting_item_msg_text_left.xml

<?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"><LinearLayoutandroid:layout_width="fill_parent"android:layout_height="wrap_content"android:orientation="vertical" android:gravity="center_horizontal"><TextViewandroid:id="@+id/tv_sendtime"android:layout_width="wrap_content"android:layout_height="wrap_content"style="@style/chat_text_date_style"/></LinearLayout><RelativeLayoutandroid: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:focusable="false" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:background="@drawable/mini_avatar_shadow"/><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>

  chatting_item_msg_text_right.xml和上面差不多,只是气泡和头像的方向在右边,就不贴代码了。

  

  主界面的布局chat.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:background="#f0f0e0" ><RelativeLayoutandroid:id="@+id/rl_layout" android:layout_width="fill_parent"android:layout_height="wrap_content"android:background="@drawable/title" ><Button android:id="@+id/btn_back" android:gravity="center_vertical" android:layout_marginLeft="5dp" android:paddingLeft="18dp" android:textSize="18.0sp" android:textColor="#ffffff"  android:background="@drawable/selector_btn_back" android:layout_width="70dp" android:layout_height="wrap_content" android:text="@string/back" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/school_title_name"android:layout_centerInParent="true"style="@style/my_txt"/><ImageView android:layout_width="wrap_content"android:layout_height="wrap_content"android:background="@drawable/campus_info"android:layout_centerVertical="true"android:layout_alignParentRight="true"android:layout_marginRight="15dp"/></RelativeLayout><RelativeLayoutandroid:id="@+id/rl_bottom"android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:background="@drawable/layout_bg1" ><Buttonandroid: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="@string/send" /><EditTextandroid: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/edittext1"android:layout_centerVertical="true"android:singleLine="true"android:textSize="18sp"/></RelativeLayout><ListViewandroid: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:layout_marginLeft="10.0dip" android:layout_marginTop="10.0dip" android:layout_marginRight="10.0dip"android:divider="@null"android:dividerHeight="5dp"android:scrollbars="none"android:cacheColorHint="#00000000"/>
</RelativeLayout>

  ChatActivity.java

package com.example.chat;import java.util.ArrayList;
import java.util.Calendar;
import java.util.List;import com.example.school.R;import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.KeyEvent;
import android.view.Menu;
import android.view.View;
import android.view.Window;
import android.view.View.OnClickListener;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ListView;
import android.widget.TextView;public class ChatActivity extends Activity implements OnClickListener {private Button mBtnSend;private Button mBtnBack;private EditText mEditTextContent;//聊天内容的适配器private ChatMsgViewAdapter mAdapter;private ListView mListView;//聊天的内容private List<ChatMsgEntity> mDataArrays = new ArrayList<ChatMsgEntity>();@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);// 去掉标题栏setContentView(R.layout.chat);initView();initData();}//初始化视图private void initView() {mListView = (ListView) findViewById(R.id.listview);mBtnBack = (Button) findViewById(R.id.btn_back);mBtnBack.setOnClickListener(this);mBtnSend = (Button) findViewById(R.id.btn_send);mBtnSend.setOnClickListener(this);mEditTextContent = (EditText) findViewById(R.id.et_sendmessage);}private String[] msgArray = new String[]{"  孩子们,要好好学习,天天向上!要好好听课,不要翘课!不要挂科,多拿奖学金!三等奖学金的争取拿二等,二等的争取拿一等,一等的争取拿励志!", "姚妈妈还有什么吩咐...", "还有,明天早上记得跑操啊,不来的就扣德育分!", "德育分是什么?扣了会怎么样?", "德育分会影响奖学金评比,严重的话,会影响毕业", "哇!学院那么不人道?","你要是你不听话,我当场让你不能毕业!", "姚妈妈,我知错了(- -我错在哪了...)"};private String[]dataArray = new String[]{"2012-09-01 18:00", "2012-09-01 18:10", "2012-09-01 18:11", "2012-09-01 18:20", "2012-09-01 18:30", "2012-09-01 18:35", "2012-09-01 18:40", "2012-09-01 18:50"};private final static int COUNT = 8;//初始化要显示的数据private 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("Shamoo");entity.setMsgType(false);}entity.setText(msgArray[i]);mDataArrays.add(entity);}mAdapter = new ChatMsgViewAdapter(this, mDataArrays);mListView.setAdapter(mAdapter);}public void onClick(View view) {// TODO Auto-generated method stubswitch(view.getId()) {case R.id.btn_back:back();break;case R.id.btn_send:send();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("");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));String day = String.valueOf(c.get(Calendar.DAY_OF_MONTH) + 1);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 boolean onKeyDown(int keyCode, KeyEvent event) {back();return true;}private void back() {finish();}
}


  谢谢大家的支持!以前一直要大家留邮箱发代码实在太麻烦了,所以Shamoo把代码上传到资源。链接:点击打开链接

  需要一分资源分,大家评论一下那一分就还回来了,别恨我,哈哈~~

  

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/53080.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

计算机系统大作业

摘 要 尽管hello程序非常简单&#xff0c;但是为了让它实现运行&#xff0c;系统的每个主要组成部分都需要协调工作&#xff0c;本篇论文就是解释说明在系统上执行hello程序时&#xff0c;系统发生了什么以及为什么会这样。 我们通过跟踪hello程序的生命周期开始系统讲解——…

程序人生-Hello’s P2P

计算机系统 大作业 题 目 程序人生-Hello’s P2P 专 业 未来技术 学   号 2021112807 班 级 21WL021 学 生 马铭杨 指 导 教 师 史先俊 …

Google reCAPTCHA ----------验证码

现有验证码的产品形态调研范围如下&#xff0c;基本涵盖了比较主流的验证码平台&#xff1a; Google reCAPTCHA极验阿里云腾讯云点触网易易盾螺丝帽FunCaptcha 产品背景 ‍‍reCAPTCHA起初是由CMU&#xff08;卡耐基梅隆大学&#xff09;设计&#xff0c;将OCR&#xff08;光…

关于captcha验证码演示

转载&#xff1a;https://blog.csdn.net/dayonglove2018/article/details/106612549 import com.wf.captcha.SpecCaptcha; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RequestMapping; import org.springfr…

使用reCAPTCHA实现验证码

文章目录 HTML代码JS代码Java代码项目开源地址参考资料 HTML代码 <!DOCTYPE html> <html><head><meta charset"utf-8"><title>登录</title><link rel"stylesheet" type"text/css" href"css/json-v…

手把手教你验证码检验的登录

在网站实际应用过程中&#xff0c;为了防止网站登录接口被机器人轻易地使用&#xff0c;产生一些没有意义的用户数据&#xff0c;所以&#xff0c;采用验证码进行一定程度上的拦截&#xff0c;当然&#xff0c;我们采用的还是一个数字与字母结合的图片验证码形式&#xff0c;后…

如何识别高级的验证码

http://sebug.net/paper/pst_WebZine/pst_WebZine_0x02/html/PSTZine_0x02_0x09.html Ph4nt0m Security TeamIssue 0x02, Phile #0x09 of 0x0A|---------------------------------------------------------------------------| |-----------------------[ 如何识别高级的验证码…

hcaptcha 我是人类验证码怎么跳过怎么验证自动识别

相信这个验证码很多人都见过&#xff0c;这个叫hcaptcha验证码 在网页上偶尔出现&#xff0c;提示需要你证明“我是人类” 这种验证码与谷歌的reCaptcha有异曲同工之处&#xff0c;但是其实hcaptcha与recaptcha是完全不同的产品&#xff0c;不是同一个公司出品的。 这种hcapt…

手把手教你识别FunCaptcha验证码

今天&#xff0c;我们将专注于FunCaptcha&#xff0c;这是一种独特而具有挑战性的CAPTCHA类型&#xff0c;在整个网络上越来越流行。我们将深入探讨FunCaptcha是什么&#xff0c;不同类型的FunCaptcha挑战&#xff0c;如何使用CapSolver解决它们等等。 什么是FunCaptcha&#…

基于openai chatgpt和embeddings制作私有知识库聊天机器人

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、原理、流程二、制作预料库三、制作问答功能总结 如果有问题可以联系我**&#xff1a;https://gitee.com/xiaoyuren/gpt3 前言 在当今信息爆炸的时代&#…

基于 Quivr 搭建个人知识库

目录 Quivr介绍 Quivr特性 Quivr演示 Demo with GPT3.5: Demo of the new version&#xff1a; Quivr实战 Quiv 使用的主要技术 Quiv 实践依赖 创建Supabase项目 部署Quiv项目 第一步&#xff1a;现在源码 第二步&#xff1a;设置环境变量 第三步&#xff1a;执行sql 第…

标书打印分册小技巧

标书打印出来后&#xff0c;一般都有很多本&#xff0c;去打印店胶装标书时&#xff0c;需要把每一本标书分出来&#xff0c;黑帽大师用便签纸就能方便的分出标书。 把便签纸贴在每本标书的最后一页上&#xff0c;这样就能方便的分出每一本了。

学校计算机维护投标书,信息化系统硬件及应用系统安全运维服务投标书范本

这是一份信息化系统硬件及应用系统安全运维服务投标书范本&#xff0c;含运维服务方案&#xff0c;word格式&#xff0c;可编辑&#xff0c;有需要的朋友可以参考学习。 信息化系统硬件及应用系统安全运维服务 本次服务范围为XX局信息化系统硬件及应用系统&#xff0c;各类软硬…

招投标小程序开发功能及源码

一般获取招投标信息的渠道主要有三种&#xff0c;一&#xff0c;来源于官方、正规的政府网站、公共资源交易中心等&#xff1b;二&#xff0c;能提供针对性的招投标信息平台&#xff1b;三是通过个人的人脉资源来获取项目信息。今天我们重点讲下招投标平台怎么运营的&#xff0…

python制作标书_爬取比比网中标标书,并保存为PDF格式文件

前言 本文的文字及图片来源于网络,仅供学习、交流使用,不具有任何商业用途,如有问题请及时联系我们以作处理。 以下文章来源于CSDN&#xff0c;作者嗨学编程 python开发环境 python 3.6 pycharm import requests import parsel import pdfkit import time 相关模块pip安装即可 …

python制作标书_Python爬取比比网中标标书并保存成PDF格式

前言 本文的文字及图片来源于网络,仅供学习、交流使用,不具有任何商业用途,如有问题请及时联系我们以作处理。 python开发环境 python 3.6 pycharm requests parsel pdfkit time 相关模块pip安装即可 目标网页分析 1、先从列表页中获取详情页的URL地址 是静态网站,可以直接请求…

第一次写标书

由于工作需要开始写起标书。前后大概花了五天时间。 经过自我学习和老师指导&#xff0c;知道了一件事情&#xff0c;不管做什么&#xff0c;其实都是能够有所学习的。 而学习&#xff0c;为了有所收获&#xff0c;需要用心再去体会每一个过程&#xff0c;并记录下来&#xf…

小程序投标书_快来学习招投标小技巧!中标率提高50%(建议收藏)

99%的投标人使用【建企同盟APP】都中标了&#xff01; 建企同盟APP 招标信息不遮挡 订阅推送零费用 从保证中标的因素来看&#xff0c;三个因素最为重要&#xff0c;首先是关系&#xff0c;其次是能力&#xff0c;最后才是价格。关系指与用户的关系&#xff0c;既有最终用户又包…

小程序投标书_程序员接私活常用哪些平台?

给大家推荐国内外几个接外包比较靠谱的平台&#xff0c;相对来说规模和专业性都还不错。 想要接外包或者积累行业人脉的小伙伴都可以收藏一波&#xff1a; 国外篇 如果打算接国外的软件外包&#xff0c;首先以下几点能力需要提前掌握&#xff1a; 基本的英语沟通能力(能够基本沟…

重磅:AI 的 “iPhone 时刻” 已经到来

大家好&#xff0c;我是校长。 上周英伟达 CEO 黄仁勋在 GTC 大会主题演讲火爆了全网。 一起来看看黄仁勋说了什么。 英伟达 CEO 黄仁勋在 GTC 大会主题演讲上开场时这么说&#xff1a; “近四十年来&#xff0c;摩尔定律一直是引领计算机行业动态发展的重要规律&#xff0c;而…