android comment écrire une interface de chat simple

Utilisez RecyclerView pour implémenter une interface de chat simple.
Préparez:

需要两张.9.png的图片来作为聊天气泡的背景图。
需要一张图片作为聊天背景图。

Écrivez une description de l'image ici

1. Créez d'abord un fichier de mise en page pour l'interface utilisateur principale, qui nécessite un RecyclerView, un bouton ENVOYER et une zone de saisie Edtitext.
2. Créez un fichier de mise en page de l'adaptateur RecyclerView pour fournir deux bulles à gauche et à droite.
3. Chargez chaque message envoyé dans le sous-élément RecyclerView et actualisez l'affichage chaque fois que les données sont mises à jour en définissant un écouteur.

Pour l'utilisation de RecyclerView, veuillez vérifier:
http://blog.csdn.net/q296264785/article/details/53581608

Code de mise en page de l'interface utilisateur principale et rendus
Écrivez une description de l'image ici

Rendu de la disposition de l'adaptateur

Écrivez une description de l'image ici

Classe d'activité:

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.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;

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

public class MainActivity extends AppCompatActivity {
    private RecyclerView recyclerView;
    private List<Msg> list = new ArrayList<>();
    private TextView sendText;
    private MyAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        sendText = (TextView) findViewById(R.id.send_text);
        recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(linearLayoutManager);
        list.add(new Msg("你好!",0));//启动之前先加载两条数据
        list.add(new Msg("Hello!",1));
        adapter = new MyAdapter(list);
        recyclerView.setAdapter(adapter);
        findViewById(R.id.send).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                String text_data = sendText.getText().toString();
                    list.add(new Msg(text_data, 1));
                    adapter.notifyItemInserted(list.size() - 1); // 当有新消息时,刷新RecyclerView中的显示
                    recyclerView.scrollToPosition(list.size() - 1); // 将RecyclerView定位到最后一行
                    sendText.setText("");
            }
        });
    }
    }

Classe de message Msg:

public class Msg {//消息类,每发送一次消息就实例化一个本类,保存消息的内容以及标志位(标志位来确定是发送还是接收)
    private String str_data = null;
    private int flag = 0;

    public Msg(String str_data, int flag) {
        this.flag = flag;
        this.str_data = str_data;
    }

    public int getFlag() {
        return flag;
    }

    public String getStr_data() {
        return str_data;
    }
}

Adaptateur:

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.ArrayList;
import java.util.List;

import static com.example.administrator.class_chatscreen.R.layout.right_layout;

/**
 * Created by Administrator on 2016/12/13 0013.
 */

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {
    private List<Msg> list = new ArrayList<>();

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(right_layout, parent, false);
        ViewHolder holder = new ViewHolder(view);
        return holder;
    }

    public MyAdapter(List<Msg> str_data) {
        this.list = str_data;
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        Msg msg = list.get(position);
        if (msg.getFlag() == 1){//发送消息时,关闭左边的消息气泡,在右边显示
            holder.right_layout.setVisibility(View.VISIBLE);
            holder.left_layout.setVisibility(View.GONE);
            holder.rightTextView.setText(msg.getStr_data());
        }else if (msg.getFlag() == 0){//接收消息时,关闭右边的消息气泡,在左边显示
            holder.right_layout.setVisibility(View.GONE);
            holder.left_layout.setVisibility(View.VISIBLE);
            holder.leftTextView.setText(msg.getStr_data());
        }
    }

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

    public class ViewHolder extends RecyclerView.ViewHolder {
        TextView leftTextView;
        TextView rightTextView;
        LinearLayout left_layout;
        LinearLayout right_layout;
        public ViewHolder(View itemView) {//控件和UI关联
            super(itemView);
            left_layout = (LinearLayout)itemView.findViewById(R.id.left);
            right_layout = (LinearLayout)itemView.findViewById(R.id.right);
            leftTextView = (TextView) itemView.findViewById(R.id.textViewleft);
            rightTextView = (TextView) itemView.findViewById(R.id.textViewright);
        }
    }
}

Disposition de l'interface utilisateur:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/bb"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context="com.example.administrator.class_chatscreen.MainActivity">

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


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

        <EditText
            android:layout_width="0sp"
            android:layout_weight="8"
            android:layout_height="wrap_content"
            android:inputType="textPersonName"
            android:hint="Type something here"
            android:ems="10"
            android:id="@+id/send_text" />

        <Button
            android:text="Send"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/send" />
    </LinearLayout>
</LinearLayout>

Disposition des bulles de message (adaptateur)

<?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="wrap_content"
    android:orientation="vertical">

    <LinearLayout
        android:id="@+id/left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left"
        android:background="@drawable/message_left"
        android:gravity="center_vertical">

        <TextView
            android:id="@+id/textViewleft"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="16sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:gravity="center_vertical"
        android:background="@drawable/message_right">

        <TextView
            android:id="@+id/textViewright"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="5sp"
            android:paddingRight="10sp"
            android:textColor="#2828ff"
            android:textSize="16sp" />
    </LinearLayout>
</LinearLayout>
Publié 34 articles originaux · J'aime 10 · Visites 30 000+

Je suppose que tu aimes

Origine blog.csdn.net/q296264785/article/details/53633731
conseillé
Classement