Android进阶之路 - 简单实现聊天功能

记得几年以前看到聊天功能时总是不得所以,现在回头一看,发现其实实现方式非常简单,故此记录一番 ~

        • 实现效果
        • 实现思想
        • 实现方式
          • 导入依赖
          • 创建model
          • 创建适配器
          • 使用场景

实现效果

一个入门级的Demo、只能满足基本需求,用于开阔自身思路 ~

实现思想

  • 一个垂直的list列表
  • 一个有tag的model
  • 通过tag区分用户、展示不同UI

实现方式

导入依赖

篇中用到的 RecyclerView、 BaseQuickAdapter 均需导入对应依赖 ~

build(Project)

allprojects {
    repositories {
        google()
        jcenter()
        maven { url "https://jitpack.io" }
    }
}

build(app)

implementation 'com.github.CymChad:BaseRecyclerViewAdapterHelper:2.9.35'
implementation 'com.android.support:recyclerview-v7:28.+'
创建model

思想: 一个有tag的model

TalkBean

package nkwl.com.chatdemo;

/**
 * @author MrLiu
 * @date 2019/12/23
 * desc
 */
public class TalkBean {
    private int tag;
    private String data;

    public TalkBean(int tag, String data) {
        this.tag = tag;
        this.data = data;
    }

    public int getTag() {
        return tag;
    }

    public void setTag(int tag) {
        this.tag = tag;
    }

    public String getData() {
        return data;
    }

    public void setData(String data) {
        this.data = data;
    }
}
创建适配器

思想:通过tag区分用户、展示不同UI

CustomAdapter

package nkwl.com.chatdemo;

import android.support.annotation.Nullable;
import android.view.View;
import android.widget.TextView;

import com.chad.library.adapter.base.BaseQuickAdapter;
import com.chad.library.adapter.base.BaseViewHolder;

import java.util.List;

/**
 * @author MrLiu
 * @date 2019/12/17
 * desc
 */
public class CustomAdapter extends BaseQuickAdapter<TalkBean, BaseViewHolder> {

    private List listData;

    public CustomAdapter(int layoutResId, @Nullable List data) {
        super(layoutResId, data);
        this.listData = data;
    }

    @Override
    protected void convert(BaseViewHolder helper, TalkBean item) {
        TextView left = helper.getView(R.id.tv_left);
        TextView right = helper.getView(R.id.tv_right);

        if (item.getTag() == 1) {
            left.setText("用户1:" + item.getData());
            left.setVisibility(View.VISIBLE);
            right.setVisibility(View.GONE);
        } else {
            right.setText("用户2:" + item.getData());
            right.setVisibility(View.VISIBLE);
            left.setVisibility(View.GONE);
        }
    }
}

item_layout


<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/tv_left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:padding="5dp"
        tools:text="左侧" />

    <TextView
        android:id="@+id/tv_right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:padding="5dp"
        tools:text="右侧" />
RelativeLayout>
使用场景

思想:一个垂直的list列表

MainActivity

package nkwl.com.chatdemo;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.text.TextUtils;
import android.view.View;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    private RecyclerView mRv;
    private TextView mSend1;
    private EditText mInput1;
    private TextView mSend2;
    private EditText mInput2;
    private List dataList;
    private CustomAdapter adapter;

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

        initViewAndData();
        onSendClick();
    }

    private void initViewAndData() {
        //找id
        mRv = findViewById(R.id.rv);
        mInput1 = findViewById(R.id.et_input1);
        mSend1 = findViewById(R.id.tv_send1);
        mInput2 = findViewById(R.id.et_input2);
        mSend2 = findViewById(R.id.tv_send2);

        //填数据
        dataList = new ArrayList<TalkBean>();
        dataList.add(new TalkBean(1, "Hi"));
        dataList.add(new TalkBean(2, "Hello"));
        dataList.add(new TalkBean(1, "Let's study together."));
        dataList.add(new TalkBean(2, "ok ~"));

        //去适配
        adapter = new CustomAdapter(R.layout.item_layout, dataList);
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
        mRv.setLayoutManager(layoutManager);
        mRv.setAdapter(adapter);
    }

    //用户1、用户2的输入事件
    private void onSendClick() {
        mSend1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                final String putData1 = mInput1.getText().toString().trim();
                Toast.makeText(MainActivity.this, "用户1:" + putData1, Toast.LENGTH_SHORT).show();
                if (!TextUtils.isEmpty(putData1)) {
                    dataList.add(new TalkBean(1, putData1));
                    adapter.notifyDataSetChanged();
                    mInput1.setText("");
                }
            }
        });

        mSend2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                final String putData2 = mInput2.getText().toString().trim();
                Toast.makeText(MainActivity.this, "用户2:" + putData2, Toast.LENGTH_SHORT).show();
                if (!TextUtils.isEmpty(putData2)) {
                    dataList.add(new TalkBean(2, putData2));
                    adapter.notifyDataSetChanged();
                    mInput2.setText("");
                }
            }
        });
    }
}

activity_main


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">


    <android.support.v7.widget.RecyclerView
        android:id="@+id/rv"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="#C7EDCC"
        android:paddingTop="25dp" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="35dp"
        android:background="#FFDEAD">

        <EditText
            android:id="@+id/et_input1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@null"
            android:hint="请输入聊天内容"
            android:padding="5dp"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/tv_send1"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:background="#f64"
            android:gravity="center"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:text="用户1:发送"
            android:textColor="#fff"
            android:textSize="12sp" />
    RelativeLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:background="#C7EDCC" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="35dp"
        android:background="#FFDEAD">

        <EditText
            android:id="@+id/et_input2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@null"
            android:hint="请输入聊天内容"
            android:padding="5dp"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/tv_send2"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:background="#f64"
            android:gravity="center"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:text="用户2:发送"
            android:textSize="12sp" />
    RelativeLayout>
LinearLayout>

你可能感兴趣的:(Android进阶之路,Android,聊天功能)