android recyclerview模拟聊天界面

本文实例为大家分享了android recyclerview模拟聊天界面的具体代码,供大家参考,具体内容如下

效果图:

实现代码:

package com.itheima74.chatui;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
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;

/**
 * 聊天界面,使用recyclerview实现
 * 效果不好,发送的消息不能靠右对齐,
 * 不知何故,怎么弄都弄不好,请教!
 * 问题的解决:用Relativelayout代替linearlayout可以解决上述问题
 */
public class MainActivity extends AppCompatActivity {
 private RecyclerView recyclerview;
 private EditText et_input;
 private ArrayList<Msg> mMsgList;
 private MsgAdapter mMsgAdapter;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);

 initView();
 initData();
 initAdapter();
 }

 private void initAdapter() {
 mMsgAdapter = new MsgAdapter(mMsgList);
 recyclerview.setAdapter(mMsgAdapter);
 }

 /**
 * 初始化数据源
 */
 private void initData() {
 mMsgList = new ArrayList<>();
 mMsgList.add(new Msg("Hello!", Msg.TYPE_RECEIVE));
 mMsgList.add(new Msg("Hello! Who is that?", Msg.TYPE_SEND));
 mMsgList.add(new Msg("This is Jack,Nice to meet you!", Msg.TYPE_RECEIVE));
 }

 /**
 * 初始化控件
 */
 private void initView() {
 recyclerview = (RecyclerView) findViewById(R.id.recyclerview);
 et_input = (EditText) findViewById(R.id.et_input);
 Button bt_send = (Button) findViewById(R.id.bt_send);

 LinearLayoutManager layoutManager = new LinearLayoutManager(this);
 layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
 recyclerview.setLayoutManager(layoutManager);

 bt_send.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View v) {
  String content = et_input.getText().toString().trim();
  // 如果用户没有输入,则是一个空串""
  if (!content.isEmpty()) {
   mMsgList.add(new Msg(content, Msg.TYPE_SEND));
   // 通知数据适配器刷新界面
   mMsgAdapter.notifyDataSetChanged();
   // 定位到最后一行
   recyclerview.scrollToPosition(mMsgList.size() - 1);
   // 输入框置空
   et_input.setText("");
  }
  }
 });

 }
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:background="#d8e0e8"
 android:orientation="vertical">

 <android.support.v7.widget.RecyclerView
 android:id="@+id/recyclerview"
 android:layout_width="match_parent"
 android:layout_height="0dp"
 android:layout_weight="1" />

 <LinearLayout
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:orientation="horizontal">

 <EditText
  android:id="@+id/et_input"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_weight="1"
  android:hint="请输入要发送的内容" />

 <Button
  android:id="@+id/bt_send"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="发送" />
 </LinearLayout>

</LinearLayout>
package com.itheima74.chatui;

/**
 * Created by My on 2017/3/3.
 */

class Msg {
 static final int TYPE_RECEIVE = 1;
 static final int TYPE_SEND = 2;
 String content;
 int type;

 Msg(String content, int type) {
 this.content = content;
 this.type = type;
 }
}
package com.itheima74.chatui;

import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import java.util.ArrayList;

/**
 * Created by My on 2017/3/3.
 */

class MsgAdapter extends RecyclerView.Adapter<MsgAdapter.ViewHolder> {
 private ArrayList<Msg> mMsgList;

 MsgAdapter(ArrayList<Msg> mMsgList) {
 this.mMsgList = mMsgList;
 }

 @Override
 public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
 View view = View.inflate(parent.getContext(), R.layout.recyclerview_item, null);
 return new ViewHolder(view);
 }

 @Override
 public void onBindViewHolder(ViewHolder holder, int position) {
 Msg msg = mMsgList.get(position);
 if (msg.type == Msg.TYPE_RECEIVE) {
  holder.tv_receive.setVisibility(View.VISIBLE);
  holder.tv_send.setVisibility(View.GONE);
  holder.tv_receive.setText(msg.content);
 } else {
  holder.tv_send.setVisibility(View.VISIBLE);
  holder.tv_receive.setVisibility(View.GONE);
  holder.tv_send.setText(msg.content);
 }
 }

 @Override
 public int getItemCount() {
 return mMsgList.size();
 }

 static class ViewHolder extends RecyclerView.ViewHolder {
 private TextView tv_receive;
 private TextView tv_send;

 ViewHolder(View itemView) {
  super(itemView);
  tv_receive = (TextView) itemView.findViewById(R.id.tv_receive);
  tv_send = (TextView) itemView.findViewById(R.id.tv_send);
 }
 }
}

xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:padding="10dp">

 <TextView
 android:id="@+id/tv_receive"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:background="@drawable/message_left"
 android:gravity="center"
 android:text="who?"
 android:textSize="20sp" />

 <TextView
 android:id="@+id/tv_send"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignParentRight="true"
 android:layout_below="@id/tv_receive"
 android:background="@drawable/message_right"
 android:gravity="center"
 android:text="i am your father"
 android:textSize="20sp" />

</RelativeLayout>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • android仿微信聊天界面 语音录制功能

    本例为模仿微信聊天界面UI设计,文字发送以及语言录制UI. 1先看效果图: 第一:chat.xml设计 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" andro

  • Android仿QQ、微信聊天界面长按提示框效果

    先来看看效果图 如何使用 示例代码 PromptViewHelper pvHelper = new PromptViewHelper(mActivity); pvHelper.setPromptViewManager(new ChatPromptViewManager(mActivity)); pvHelper.addPrompt(holder.itemView.findViewById(R.id.textview_content)); 使用起来还是很简单的 首先new一个PromptViewH

  • Android利用RecyclerView编写聊天界面

    本文实例为大家分享了Android RecyclerView编写聊天界面的具体代码,供大家参考,具体内容如下 1.待会儿会用到RecyclerView,首先在app/build.gradle(注意有两个build.gradle,选择app下的那个)当中添加依赖库,如下: dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile 'com.android.support:appcompat-v7:24.2.1'

  • Android高仿微信聊天界面代码分享

    微信聊天现在非常火,是因其界面漂亮吗,哈哈,也许吧.微信每条消息都带有一个气泡,非常迷人,看起来感觉实现起来非常难,其实并不难.下面小编给大家分享实现代码. 先给大家展示下实现效果图: OK,下面我们来看一下整个小项目的主体结构: 下面是Activity的代码: package com.way.demo; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Date; import jav

  • Android编程实现泡泡聊天界面实例详解(附源码)

    本文实例讲述了Android编程实现泡泡聊天界面的方法.分享给大家供大家参考,具体如下: 昨天写了个界面,实现了Android泡泡聊天界面.运行结果如下,点击发送按钮,屏幕就显示Text的内容. 我也是在网上的一份源码的基础上更改的,整个泡泡界面的实现要点: (1)主界面其实就是一个List View (2)文字显示界面其实就使用了android:background="@drawable/incoming"这个东西.背景图片的格式是xxx.9.png,专门用来缩放的,不然显示效果非常

  • android Listview模拟聊天界面

    本文实例为大家分享了android Listview模拟聊天界面的具体代码,供大家参考,具体内容如下 代码: package com.example.test; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; im

  • Android仿微信语音聊天界面设计

    有段时间没有看视频了,昨天晚上抽了点空时间,又看了下鸿洋大神的视频教程,又抽时间写了个学习记录.代码和老师讲的基本一样,网上也有很多相同的博客.我只是在AndroidStudio环境下写的. --主界面代码-- public class MainActivity extends Activity { private ListView mListView; private ArrayAdapter<Recorder> mAdapter; private List<Recorder>

  • android recyclerview模拟聊天界面

    本文实例为大家分享了android recyclerview模拟聊天界面的具体代码,供大家参考,具体内容如下 效果图: 实现代码: package com.itheima74.chatui; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.LinearLayoutManager; import android.support.v7

  • Android ListView仿微信聊天界面

    Android ListView仿聊天界面效果图的具体代码,供大家参考,具体内容如下 1.首先页面总布局(ListView + LinearLayout(TextView+Button)) <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="

  • Android仿微信主界面的实现方法

    本文实例为大家分享了Android模仿微信主界面展示的具体代码,供大家参考,具体内容如下 先看一下效果图 实现的原理: ViewPager+FragmentPagerAdapter 主界面可分为三部分: top标题栏就是一个TextView 中间的ViewPager作为显示的容器,填充Fragment bottom是一个RadioGroup 这里为了布局的优化,将top和bottom抽取出来 ,然后用include将其导入主布局,如下 <LinearLayout xmlns:android=&quo

  • Android实现聊天界面

    本文实例为大家分享了Android实现聊天界面的具体代码,供大家参考,具体内容如下 文件目录 在app下的build.gradle中添加依赖库(RecyclerView) apply plugin: 'com.android.application' android { compileSdkVersion 24 buildToolsVersion "26.0.1" defaultConfig { applicationId "com.example.uibestpractic

随机推荐