安卓实现左右布局聊天界面

先看效果图。是不是你们想要的。大概就是这样的效果Android 实现左右布局聊天界面好友左、自己右采用 RecyclerView 双布局 Item 实现结构清晰、可直接复用适配聊天气泡样式。一、整体思路两种 Item 布局item_msg_left.xml对方消息居左item_msg_right.xml自己消息居右消息实体类记录消息内容、发送者类型RecyclerView 适配器根据类型加载不同布局气泡背景自带圆角、区分左右样式二、1. 消息实体类 MsgBeanpublicclassMsgBean{// 消息文本privateStringcontent;// 0对方消息(左) 1自己消息(右)privateintmsgType;publicMsgBean(Stringcontent,intmsgType){this.contentcontent;this.msgTypemsgType;}// getter setterpublicStringgetContent(){returncontent;}publicintgetMsgType(){returnmsgType;}}三、2. 左边 Item 布局对方消息item_msg_left.xml?xml version1.0encodingutf-8?LinearLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:padding10dpandroid:gravityleftTextViewandroid:idid/tv_msgandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:padding10dpandroid:maxWidth250dpandroid:textColor#333333android:backgrounddrawable/bg_msg_left//LinearLayout右边 Item 布局自己消息item_msg_right.xml?xml version1.0encodingutf-8?LinearLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:padding10dpandroid:gravityrightTextViewandroid:idid/tv_msgandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:padding10dpandroid:maxWidth250dpandroid:textColor#FFFFFFandroid:backgrounddrawable/bg_msg_right//LinearLayout四、4. 气泡背景 drawablebg_msg_left.xml左侧灰色气泡?xml version1.0encodingutf-8?shape xmlns:androidhttp://schemas.android.com/apk/res/androidsolid android:color#E5E5E5/corners android:topLeftRadius5dpandroid:topRightRadius15dpandroid:bottomLeftRadius15dpandroid:bottomRightRadius15dp//shapebg_msg_right.xml右侧蓝色气泡?xml version1.0encodingutf-8?shape xmlns:androidhttp://schemas.android.com/apk/res/androidsolid android:color#0099FF/corners android:topLeftRadius15dpandroid:topRightRadius5dpandroid:bottomLeftRadius15dpandroid:bottomRightRadius15dp//shape五、5. RecyclerView 适配器 MsgAdapterimportandroid.view.LayoutInflater;importandroid.view.View;importandroid.view.ViewGroup;importandroid.widget.TextView;importandroidx.annotation.NonNull;importandroidx.recyclerview.widget.RecyclerView;importjava.util.List;publicclassMsgAdapterextendsRecyclerView.AdapterRecyclerView.ViewHolder{privatefinalListMsgBeanmsgList;// 区分两种布局类型privatestaticfinalintTYPE_LEFT0;privatestaticfinalintTYPE_RIGHT1;publicMsgAdapter(ListMsgBeanmsgList){this.msgListmsgList;}// 根据消息类型返回布局OverridepublicintgetItemViewType(intposition){returnmsgList.get(position).getMsgType();}NonNullOverridepublicRecyclerView.ViewHolderonCreateViewHolder(NonNullViewGroupparent,intviewType){if(viewTypeTYPE_LEFT){ViewviewLayoutInflater.from(parent.getContext()).inflate(R.layout.item_msg_left,parent,false);returnnewLeftHolder(view);}else{ViewviewLayoutInflater.from(parent.getContext()).inflate(R.layout.item_msg_right,parent,false);returnnewRightHolder(view);}}OverridepublicvoidonBindViewHolder(NonNullRecyclerView.ViewHolderholder,intposition){MsgBeanbeanmsgList.get(position);if(holderinstanceofLeftHolder){((LeftHolder)holder).tvMsg.setText(bean.getContent());}elseif(holderinstanceofRightHolder){((RightHolder)holder).tvMsg.setText(bean.getContent());}}OverridepublicintgetItemCount(){returnmsgList.size();}// 左边ViewHolderstaticclassLeftHolderextendsRecyclerView.ViewHolder{TextViewtvMsg;publicLeftHolder(NonNullViewitemView){super(itemView);tvMsgitemView.findViewById(R.id.tv_msg);}}// 右边ViewHolderstaticclassRightHolderextendsRecyclerView.ViewHolder{TextViewtvMsg;publicRightHolder(NonNullViewitemView){super(itemView);tvMsgitemView.findViewById(R.id.tv_msg);}}// 添加消息 自动滚动到底部publicvoidaddMsg(MsgBeanbean){msgList.add(bean);notifyItemInserted(msgList.size()-1);}}六、6. 主界面布局 activity_chat.xml?xml version1.0encodingutf-8?LinearLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:orientationvertical!--聊天列表--androidx.recyclerview.widget.RecyclerViewandroid:idid/recycler_chatandroid:layout_widthmatch_parentandroid:layout_height0dpandroid:layout_weight1/!--输入栏--LinearLayoutandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:orientationhorizontalandroid:padding8dpEditTextandroid:idid/et_inputandroid:layout_width0dpandroid:layout_heightwrap_contentandroid:layout_weight1android:hint输入消息/Buttonandroid:idid/btn_sendandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:text发送//LinearLayout/LinearLayout七、7. 聊天 Activity 逻辑 ChatActivity.javaimportandroid.os.Bundle;importandroid.view.View;importandroid.widget.Button;importandroid.widget.EditText;importandroidx.appcompat.app.AppCompatActivity;importandroidx.recyclerview.widget.LinearLayoutManager;importandroidx.recyclerview.widget.RecyclerView;importjava.util.ArrayList;importjava.util.List;publicclassChatActivityextendsAppCompatActivity{privateRecyclerViewrecyclerChat;privateEditTextetInput;privateMsgAdaptermsgAdapter;privateListMsgBeanmsgList;OverrideprotectedvoidonCreate(BundlesavedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.activity_chat);recyclerChatfindViewById(R.id.recycler_chat);etInputfindViewById(R.id.et_input);ButtonbtnSendfindViewById(R.id.btn_send);// 初始化列表msgListnewArrayList();msgAdapternewMsgAdapter(msgList);LinearLayoutManagerlayoutManagernewLinearLayoutManager(this);recyclerChat.setLayoutManager(layoutManager);recyclerChat.setAdapter(msgAdapter);// 模拟对方默认消息msgAdapter.addMsg(newMsgBean(你好呀,0));// 发送按钮点击btnSend.setOnClickListener(v-{StringcontentetInput.getText().toString().trim();if(!content.isEmpty()){// 添加自己消息右msgAdapter.addMsg(newMsgBean(content,1));etInput.setText();// 自动滚动到底部recyclerChat.scrollToPosition(msgAdapter.getItemCount()-1);}});}}效果说明1.好友消息左侧灰色气泡2.自己消息右侧蓝色气泡3.发送消息自动滚到底部4.消息最大宽度限制长文本自动换行八、软键盘弹出自动上移聊天列表安卓聊天界面必备默认情况下弹出输入法键盘时RecyclerView 聊天列表不会往上顶输入框会被键盘遮挡、最新消息被键盘盖住看不到。软键盘弹起 → 整个聊天布局自动上移最新消息自动显示在键盘上方不会被遮挡AndroidManifest.xml 配置最简单一行搞定找到你的 ChatActivity 对应的 activity 标签添加属性android:windowSoftInputModeadjustResize完整示例activityandroid:name.ChatActivityandroid:windowSoftInputModeadjustResize/activity