Android中使用RecylerView实现聊天框效果

从Android 5.0开始,谷歌公司推出了一个用于大量数据展示的新控件RecylerView,可以用来代替传统的ListView,更加强大和灵活。在上篇文章给大家介绍了Android RecylerView入门教程,大家可以点击查看详情。

效果图如下:(其中,聊天框背景图用9-patch图,可以内容自适应调节。利用AndroidStudio自带的功能制作就行了,图片->右键->create 9-patch file。

其中要注意的是:

1、将9-patch图保存到drawable目录下才管用。

2、要将背景图片处理一下,缩放到足够小,它会自动伸缩。)

1、activity_main.xml的代码如下:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_width="match_parent"
  android:layout_height="match_parent"
  xmlns:android="http://schemas.android.com/apk/res/android">
  <android.support.v7.widget.RecyclerView
    android:id="@+id/Main_rView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="50dp"></android.support.v7.widget.RecyclerView>
  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_alignParentBottom="true"
    android:padding="5dp"
    android:orientation="horizontal">
    <EditText
      android:id="@+id/Main_etContent"
      android:layout_width="0dp"
      android:layout_weight="1"
      android:layout_height="wrap_content"
      android:minLines="1"
      android:maxLines="3"
      android:hint="说点什么吧"
      android:textSize="14dp"/>
    <Button
      android:id="@+id/Main_btnSend"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textSize="14dp"
      android:text="Send"
      android:textAllCaps="false"/>
  </LinearLayout>
</RelativeLayout>

2、layout_item_content.xml的代码如下:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:padding="10dp"
  xmlns:android="http://schemas.android.com/apk/res/android">
  <LinearLayout
    android:id="@+id/Layout_Item_Content_lLayoutReceive"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="10dp"
    android:layout_alignParentLeft="true"
    android:background="@drawable/bg_chat2"
    android:orientation="vertical">
    <TextView
      android:id="@+id/Layout_Item_Content_tvContentReceive"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginBottom="10dp"
      android:text="内容内容内"
      android:textSize="14dp"/>
  </LinearLayout>
  <LinearLayout
    android:id="@+id/Layout_Item_Content_lLayoutSend"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="10dp"
    android:layout_alignParentRight="true"
    android:background="@drawable/bg_chat1"
    android:orientation="vertical">
    <TextView
      android:id="@+id/Layout_Item_Content_tvContentSend"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="内容"
      android:textSize="14dp"
      android:layout_marginTop="20dp"
      android:layout_marginLeft="5dp"
      android:layout_marginRight="5dp"
      />
  </LinearLayout>
</RelativeLayout>

3、RecyclerViewAdapter.java的代码如下:

package com.deepreality.recyclerviewdemo;
import android.content.Context;
import android.support.annotation.NonNull;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.TextView;
import java.util.List;
public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ViewHolder> {
  private Context mContext;
  private List<Tb_ChatContent> tbChatContentList;
  private Tb_ChatContent tb_chatContent;
  static class ViewHolder extends RecyclerView.ViewHolder {
    private LinearLayout lLayoutReceive, lLayoutSend;
    private TextView tvReceive, tvSend;
    public ViewHolder(View itemView) {
      super(itemView);
      lLayoutReceive = itemView.findViewById(R.id.Layout_Item_Content_lLayoutReceive);
      lLayoutSend = itemView.findViewById(R.id.Layout_Item_Content_lLayoutSend);
      tvReceive = itemView.findViewById(R.id.Layout_Item_Content_tvContentReceive);
      tvSend = itemView.findViewById(R.id.Layout_Item_Content_tvContentSend);
    }
  }
  public RecyclerViewAdapter(Context mContext, List<Tb_ChatContent> tbChatContentList) {
    this.mContext = mContext;
    this.tbChatContentList = tbChatContentList;
  }
  @NonNull
  @Override
  public RecyclerViewAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
    View view = LayoutInflater.from(mContext).inflate(R.layout.layout_item_content, parent, false);
    ViewHolder viewHolder = new ViewHolder(view);
    return viewHolder;
  }
  @Override
  public void onBindViewHolder(@NonNull RecyclerViewAdapter.ViewHolder holder, int position) {
    tb_chatContent = tbChatContentList.get(position);
    if (tb_chatContent.getType() == 0) {
      holder.lLayoutReceive.setVisibility(View.VISIBLE);
      holder.lLayoutSend.setVisibility(View.GONE);
      holder.tvReceive.setText(tb_chatContent.getContent());
    } else {
      holder.lLayoutReceive.setVisibility(View.GONE);
      holder.lLayoutSend.setVisibility(View.VISIBLE);
      holder.tvSend.setText(tb_chatContent.getContent());
    }
  }
  @Override
  public int getItemCount() {
    return tbChatContentList.size();
  }
}

4、MainActivity.java的代码如下:

package com.deepreality.recyclerviewdemo;
import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
  private Context mContext;
  private RecyclerView rViewChat;
  private EditText etContent;
  private Button btnSend;
  private List<Tb_ChatContent> tbChatContentList;
  private Tb_ChatContent tb_chatContent;
  private RecyclerViewAdapter recyclerViewAdapter;
  private String[] arrayContents = new String[]{"How are you", "Fine,Thank you.", "How are you"
      , "Fine,Thank you.", "How are you", "Fine,Thank you."};
  private int[] arrayTypes = new int[] {0, 1, 0, 1, 0, 1};
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    baseDataInit();
    bindViews();
    viewsAddListener();
    viewsDataInit();
  }
  private void baseDataInit() {
    mContext = this;
    tbChatContentList = new ArrayList<>();
  }
  private void bindViews() {
    rViewChat = findViewById(R.id.Main_rView);
    etContent = findViewById(R.id.Main_etContent);
    btnSend = findViewById(R.id.Main_btnSend);
  }
  private void viewsAddListener() {
    btnSend.setOnClickListener(this);
  }
  private void viewsDataInit() {
    rViewSetAdapter();
  }
  private void rViewSetAdapter() {
    for (int i = 0; i < arrayContents.length; i++) {
      tb_chatContent = new Tb_ChatContent(arrayContents[i], arrayTypes[i]);
      tbChatContentList.add(tb_chatContent);
    }
    //设置RecylerView的排列方式(线性,网格,瀑布流三种)
    LinearLayoutManager linearLayoutManager = new LinearLayoutManager(mContext);
    rViewChat.setLayoutManager(linearLayoutManager);
    //创建并绑定数据适配器
    recyclerViewAdapter = new RecyclerViewAdapter(mContext, tbChatContentList);
    rViewChat.setAdapter(recyclerViewAdapter);
  }
  @Override
  public void onClick(View v) {
    switch (v.getId()) {
      case R.id.Main_btnSend: {
        tb_chatContent = new Tb_ChatContent(etContent.getText().toString(), Tb_ChatContent.TYPE_SEND);
        tbChatContentList.add(tb_chatContent);
        //数据刷新
        recyclerViewAdapter.notifyDataSetChanged();
        //滑动到某一位置
        rViewChat.smoothScrollToPosition(tbChatContentList.size() - 1);
        break;
      }
      default:break;
    }
  }
}

总结

以上所述是小编给大家介绍的Android中使用RecylerView实现聊天框效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • Android RecylerView入门教程

    今年Google I/0大会,Google开放了两个全新的视图:RecyclerView和CardView.这篇文章会提供关于RecylerView的简介. RecylerView作为support-library发布出来,这对开发者来说绝对是个好消息.因为可以在更低的Android版本上使用这个新视图.下面我们看如何获取RecylerView.首先打开Android SDK Manager,然后更新Extras->Android Support Library即可. 然后在本地../sdk/e

  • Android中使用RecylerView实现聊天框效果

    从Android 5.0开始,谷歌公司推出了一个用于大量数据展示的新控件RecylerView,可以用来代替传统的ListView,更加强大和灵活.在上篇文章给大家介绍了Android RecylerView入门教程,大家可以点击查看详情. 效果图如下:(其中,聊天框背景图用9-patch图,可以内容自适应调节.利用AndroidStudio自带的功能制作就行了,图片->右键->create 9-patch file. 其中要注意的是: 1.将9-patch图保存到drawable目录下才管用

  • Android实现好看的微信聊天气泡效果

    目录 前言 代码实现 踩坑记录 总结 前言 在聊天类应用中,通常用气泡作为聊天内容的背景色,比如微信的聊天背景,别人发过来的是白色的气泡,自己发的是绿色的气泡. 上面这种是比较普通的,这篇我们玩点有趣的,让聊天气泡是渐变色的.可能很多人会觉得渐变很简单,给 Container 来个decoration或者使用 DecoratedBox,使用渐变填充色就可以了,比如下面这种效果: 这个感觉也太丑了,本篇我们来一个高级的 —— 整个聊天窗口的气泡颜色是渐变的,而且随着滚动还会变化!先看看实现的效果,

  • 浅析Android中常见三种弹框在项目中的应用

    一丶概述 弹框在Android项目中经常出现,常见的实现方法有三种:Dialog 弹框,Window弹框,Activity伪弹框.本文就说一说三种弹框的实现及在项目中的运用. 二丶演示图         图一为常见的三种弹框(文末上链接),图二为项目中用到的Activity伪弹框 三丶正文 1.Dialog弹框 先看一篇一篇文章: android 8种对话框(Dialog)使用方法汇总 Dialog是系统自带的弹框,然而常常因为UI不好看而遭嫌弃,常需要自定义 public class MyDi

  • Android中利用viewflipper动画切换屏幕效果

    整个项目的 package com.example.viewflipper; import android.R.integer; import android.app.Activity; import android.os.Bundle; import android.util.Log; import android.view.GestureDetector.OnDoubleTapListener; import android.view.Menu; import android.view.Me

  • Android中button点击后字体的变色效果

    button的点击效果无疑是非常简单的,以致于我懒到当UI告诉我说在点击的时候button字体的颜色也要随着背景改变的时候我毫不犹豫的告诉他让他切两个图过来,后来想想着实是不太靠谱,于是了解了一下如何添加button点击的字体颜色变化效果. 1.首先你要在你的color文件下加入几个你需要的色值,注意不同的是不是一般的color标签,而是drawable标签,就像这样: <drawable name="color_red">#fffa3d39</drawable>

  • Android 中基于TabLayout+ViewPager实现标签卡效果

    代码已经上传至Github:https://github.com/YanYoJun/ViewPagerDemo 先看效果 1.布局文件 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.andro

  • Android中 TeaScreenPopupWindow多类型筛选弹框功能的实例代码

    Github地址 YangsBryant/TeaScreenPopupWindow (Github排版比较好,建议进入这里查看详情,如果觉得好,点个star吧!) 引入module allprojects { repositories { google() jcenter() maven { url 'https://www.jitpack.io' } } } implementation 'com.github.YangsBryant:TeaScreenPopupWindow:1.0.2' 主

  • Android中使用itemdecoration实现时间线效果

    代码如下: // 时间线装饰器 public class TimeLineDecoration extends RecyclerView.ItemDecoration { private Paint mPaint; public TimeLineDecoration() { mPaint = new Paint(); mPaint.setStyle(Paint.Style.FILL); mPaint.setColor(Color.BLUE); mPaint.setStrokeWidth(5);

  • Android中FlowLayout组件实现瀑布流效果

    目录 FlowLayout实现关键步骤: 1.创建一个view继承自ViewGroup 2.重写并实现onMeasure方法 3.重写并实现onLayout方法 总结 纸上得来终觉浅,绝知此事要躬行. 动手实践是学习的最好的方式,对于自定义View来说,听和看只能是过一遍流程,能掌握个30%.40%就不错了,而且很快就会遗忘,想变成自己的东西必须动手来写几遍,细细体会其中的细节和系统API的奥秘.真谛. 进入主题,今天来手写一个瀑布流组件FlowLayout,温习下自定义view的流程和关键点,

  • Android文本视图TextView实现聊天室效果

    本文实例为大家分享了Android文本视图TextView实现聊天室的具体代码,供大家参考,具体内容如下 Math.random()生成随机数的范围是 0 到 1 之间的 日期时间格式new SimpleDateFormat("dd-MM-yyyy HH:mm:ss"); //年-月-日 时:分:秒  : HH大写24小时, String类的format()方法用于创建格式化的字符串以及连接多个字符串对象. MainActivity package com.example.junior

随机推荐