关键词：

需要全部代码请点赞关注收藏后评论区留言私信~~~

手机最开始用于通话，后来增加了短信功能，初步满足了人与人之间的沟通需求。然而短信只能发文字，于是出现了能够发图片的彩信，但不管短信还是彩信，资费都太贵了，令人惜墨如金。 后来移动公司推出飞信，它支持从电脑向手机免费发短信，因而风靡一时。 到了智能机时代，更懂用户的微信异军突起，只需耗费少数流量即可发送丰富的图文消息，由此打败了短信、彩信、飞信，成为人们最常用的社交App。

一、需求描述

聊天属于微信的基础功能，包括单人聊天和多人聊天：

（1）单人聊天简称私聊，用于一对一的聊天，聊天消息只发给对方；

（2）多人聊天简称群聊，用于多对多的聊天，该群的所有成员都会收到群消息。 聊天界面既能发送文本消息，也能发送图片消息，且对方消息靠左对齐，我方消息靠右对齐。

二、功能分析

即时通信有两个意思：

（1）第一个是通信，也就是传输消息，至少支持包含文字与图片在内的图文消息；

（2）第二个是即时，也叫实时，发出来的消息要马上送到对方那里； 即时通信的特性决定了它没法采用基于短连接的HTTP协议，而必须采用基于长连接的网络协议，比如Socket、MQTT、IMPP、XMPP等等。

即时通信工具用到的技术

1）底部标签栏：用于控制切换到哪个页面。

（2）列表控件：用于展示好友列表和群聊列表。

（3）输入对话框：用于个人信息页面修改用户昵称。

（4）圆角矩形图形：用户头像采用了圆角矩形裁剪。

（5）Socket通信：聊天消息实时传给对方，需要采取Socket通信与后端服务器交互。

（6）移动数据格式JSON：聊天的图文消息要封装为JSON格式。

下面代码各模块进行简介

（1）WeLoginActivity.java：这是仿微信聊天的登录页面。

（2）WeChatActivity.java：这是登录进去后的主界面（内含三个碎片页）。

（3）FriendListFragment.java：这是好友列表的碎片页。

（4）GroupListFragment.java：这是群聊列表的碎片页。

（5）MyInfoFragment.java：这是个人信息的碎片页。

（6）FriendChatActivity.java：这是单人聊天的私聊界面。

（7）GroupChatActivity.java：这是多人聊天的群聊界面。

三、效果展示

演示视频如下

仿微信的群聊和私聊

登录界面如下 输入名字即可登录

默认已经有三个群聊 用户也可以自己创建

 

可以在群聊里面发送文字和图片

 

 两人私聊的效果图 此处需要两部手机完成

群聊的效果图如下 同样需要多部手机才能完成 

 

 四、代码

部分代码如下 需要全部源码请点赞关注收藏后评论区留言私信~

package com.example.network;

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.view.WindowManager;
import android.widget.RadioButton;
import android.widget.RadioGroup;

import com.example.network.adapter.WeChatAdapter;

import io.socket.client.Socket;

public class WeChatActivity extends AppCompatActivity 
    private ViewPager vp_content; // 声明一个翻页视图对象
    private RadioGroup rg_tabbar; // 声明一个单选组对象
    private Socket mSocket; // 声明一个套接字对象

    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_we_chat);
        initView(); // 初始化视图
        mSocket = MainApplication.getInstance().getSocket();
        mSocket.connect(); // 建立Socket连接
    

    // 初始化视图
    private void initView() 
        vp_content = findViewById(R.id.vp_content);
        // 构建一个翻页适配器
        WeChatAdapter adapter = new WeChatAdapter(getSupportFragmentManager());
        vp_content.setAdapter(adapter); // 设置翻页视图的适配器
        // 给翻页视图添加页面变更监听器
        vp_content.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() 
            @Override
            public void onPageSelected(int position) 
                // 选中指定位置的单选按钮
                rg_tabbar.check(rg_tabbar.getChildAt(position).getId());
            
        );
        rg_tabbar = findViewById(R.id.rg_tabbar);
        // 设置单选组的选中监听器
        rg_tabbar.setOnCheckedChangeListener((group, checkedId) -> 
            for (int pos=0; pos<rg_tabbar.getChildCount(); pos++) 
                // 获得指定位置的单选按钮
                RadioButton tab = (RadioButton) rg_tabbar.getChildAt(pos);
                if (tab.getId() == checkedId)  // 正是当前选中的按钮
                    vp_content.setCurrentItem(pos); // 设置翻页视图显示第几页
                
            
        );
    

    @Override
    protected void onDestroy() 
        super.onDestroy();
        if (mSocket.connected())  // 已经连上Socket服务器
            mSocket.disconnect(); // 断开Socket连接
        
    

登录界面

package com.example.network;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.text.TextUtils;
import android.widget.EditText;
import android.widget.Toast;

import com.example.network.constant.NetConst;
import com.example.network.util.SocketUtil;

public class WeLoginActivity extends AppCompatActivity 
    private EditText et_name; // 声明一个编辑框对象

    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_we_login);
        et_name = findViewById(R.id.et_name);
        findViewById(R.id.btn_login).setOnClickListener(v -> doLogin());
        // 检查能否连上Socket服务器
        SocketUtil.checkSocketAvailable(this, NetConst.CHAT_IP, NetConst.CHAT_PORT);
    

    // 执行登录动作
    private void doLogin() 
        String name = et_name.getText().toString();
        if (TextUtils.isEmpty(name)) 
            Toast.makeText(this, "请输入您的微信昵称", Toast.LENGTH_SHORT).show();
            return;
        
        MainApplication.getInstance().wechatName = name;
        // 打开聊天界面
        startActivity(new Intent(this, WeChatActivity.class));
    

创作不易 觉得有帮助请点赞关注收藏~~~

flutter项目开发之仿微信的excel报表(代码片段)

Flutter仿微信excel功能前言在项目开发中，报表是一个很常见的功能，有利于使用者一眼能看出数据的趋势与规律，非常适合数量大，且种类繁多的数据查看与对比。虽然Flutter提供了Table，DataTable等相关的组件&#... 查看详情

android之仿微信支付密码输入框

            今天在项目中遇到一个类似微信支付的密码输入框的需求，具体的实现要求如下：下载地址在最后！  因为这样的一个控件主要实现的密码输入的功能，这大体上和Edittext相似，但不同于EditT... 查看详情

android初学之仿微信app门户界面设计(代码片段)

实验环境：在AndroidStudio中进行有关代码的编写和界面效果展示图标来源于阿里矢量图标库界面分析：点击底端相应区域，中间内容会进行相应切换（将对应的Fragment显示，其余的Fragment隐藏），下面展... 查看详情

android实战项目仿微信底部导航栏(代码片段)

仿微信底部导航栏要做一个类似微信底部导航栏要用到MaterialDesign系列之BottomNavigationView，找图片的话推荐一个很好用的网站https://www.iconfont.cn。实现效果:页面跳转，触摸图标颜色变化。顶部Toolbar设置，退出效果。项... 查看详情

android实战项目仿微信底部导航栏(代码片段)

仿微信底部导航栏要做一个类似微信底部导航栏要用到MaterialDesign系列之BottomNavigationView，找图片的话推荐一个很好用的网站https://www.iconfont.cn。实现效果:页面跳转，触摸图标颜色变化。顶部Toolbar设置，退出效果。项... 查看详情

android初学三之仿微信app实现对有recycleview的页面进行点击跳转设计(代码片段)

目录0实验环境1界面展示2功能说明3设计原理4核心代码4.1新建一个Activity类leimuActivity.java4.2在res/layout中增加一个布局配置文件leimu_tab.xml4.3修改AndroidManifest.xml,将leimuActivity添加进去4.4在res/values/strings中增加所用的字符串名称4.5修改... 查看详情

android初学二之仿微信app实现recyclerview控件的设计开发，实现点击事件及图片瀑布流(代码片段)

目录0实验环境1界面展示2功能说明3核心代码3.1实现RecyclerView控件的设计开发3.2添加了文字库assets3.3实现点击事件对item中的每个LinearLayout实现点击显示内容3.4实现顶部悬浮（吸顶），对每个LinearLayout进行分组，且... 查看详情

android实战项目仿微信底部导航栏(代码片段)

仿微信底部导航栏要做一个类似微信底部导航栏要用到MaterialDesign系列之BottomNavigationView，找图片的话推荐一个很好用的网站https://www.iconfont.cn。实现效果:页面跳转，触摸图标颜色变化。顶部Toolbar设置，退出效果。项... 查看详情

微信接龙最后一个人怎么删除

1.打开微信,点击进入要修改接龙的群聊。2.打开群接龙统计表。3.在群接龙统计页面点击右上角的三个点。4.在弹出的小框中点击删除接龙即可成功操作。参考技术A微信接龙最后一个人怎么删除第一种就是进入到微信页面，从屏... 查看详情

在 PHP 上使用 Ratchet 和 WebSockets 进行私人和群聊

】在PHP上使用Ratchet和WebSockets进行私人和群聊【英文标题】：PrivateandgroupchatsusingRatchetandWebSocketsonPHP【发布时间】：2016-12-1221:08:38【问题描述】：我的目标是制作一个带有私人和群聊选项的聊天应用程序。我更习惯于在PHP中使用Ra... 查看详情

一对一和群聊的更好方法nodejs Socket.io

】一对一和群聊的更好方法nodejsSocket.io【英文标题】：betterapproachforonetooneandgroupchatnodejsSocket.io【发布时间】：2018-04-0402:56:54【问题描述】：我在NodeJs的应用程序中使用socket.io和angular4实现一对一和群聊强>在客户端。我是socket.i... 查看详情

《androidapp开发进阶与项目实战》出版后记

　　《AndroidApp开发入门与项目实战》刚写完，我马上着手编写它的姊妹篇《AndroidApp开发进阶与项目实战》，因为开发入门一书比较基础，还需要一本讲解高级开发与新技术的进阶书籍。App开发入门与App开发进阶两本... 查看详情

《androidapp开发进阶与项目实战》出版后记

　　《AndroidApp开发入门与项目实战》刚写完，我马上着手编写它的姊妹篇《AndroidApp开发进阶与项目实战》，因为开发入门一书比较基础，还需要一本讲解高级开发与新技术的进阶书籍。App开发入门与App开发进阶两本... 查看详情

Django + Strophe + ejabberd - 附加和群聊的麻烦

】Django+Strophe+ejabberd-附加和群聊的麻烦【英文标题】：Django+Strophe+ejabberd-troubleswithattachandgroupchat【发布时间】：2013-04-1809:24:36【问题描述】：我尝试使用strophe+ejabberd来制作类似网络聊天的东西。我已经做了什么：当我登录网站... 查看详情

基于flask写的web_socket单聊和群聊(代码片段)

群聊 fromflaskimportFlask,request,render_templatefromgeventwebsocket.handlerimportWebSocketHandlerfromgevent.pywsgiimportWSGIServerfromgeventwebsocket.websocketimportWebSocketapp=Flask(__name__)use 查看详情

仿微信添加标签效果

...向微信看齐，微信就是我们的标杆，那我们今天也来仿一仿微信添加的标签功能。只能仿着做了，真是做不到微信的那种体验。甘拜下风。我们上篇学习了shape属性的用法，那我们今天就用shape来做下微信的标签功能。先看一下... 查看详情

《androidapp开发进阶与项目实战》资源下载和内容勘误

资源下载下面是《AndroidApp开发进阶与项目实战》一书用到的工具和代码资源：1、本书使用的AndroidStudio版本为4.2，最新的安装包可前往Android官网页面下载。2、本书提供所有示例源码的demo工程下载，源码（适配Andr... 查看详情

html5聊天案例|趣聊h5|仿微信界面聊天|红包|语音聊天|地图

之前有开发过一个h5微直播项目，当时里面也用到过聊天模块部分，今天就在之前聊天部分的基础上重新抽离模块，开发了这个h5趣聊项目，功能效果比较类似微信聊天界面。采用html5+css3+Zepto+swiper+wcPop+flex等技术融合开发，实现... 查看详情