我的应用有一个包含recyclerview的聊天活动。此recyclerview包含两个项目,用于显示用户收到的消息以及用户发送的消息。
用户收到的消息正在按预期从Recyclerview的左侧对齐,但用户发送的消息未按预期从Recyclerview的右侧对齐。
这就是现在的样子: 蓝色消息是收到的消息,灰色消息是发送的消息。
我如何看待ui: 我希望灰色消息从屏幕右侧对齐,如下图所示。
CODE
activity.java文件:
public class IMActivity extends AppCompatActivity{
private RecyclerView recyclerView;
private ImAdapter imAdapter;
private List<ChatMsg> chatMsgList = new ArrayList<>();
Socket mSocket;
EditText etIM;
ImageButton ibSend;
String otherUserName;
List<Msg> msgList;
DBAct db;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_im);
Toolbar toolbar = (Toolbar)findViewById(R.id.imlist_toolbar);
setSupportActionBar(toolbar);
etIM = (EditText)findViewById(R.id.et_im);
recyclerView = (RecyclerView)findViewById(R.id.rv_im);
imAdapter = new ImAdapter(chatMsgList);
LinearLayoutManager layoutManager = new LinearLayoutManager(getApplicationContext());
layoutManager.setStackFromEnd(true);
recyclerView.setLayoutManager(layoutManager);
recyclerView.setAdapter(imAdapter);
db = new DBAct(IMActivity.this,otherUserName);
msgList = db.getAllMessages();
db.close();
prepareChatData();
}
private void prepareChatData() {
for (int i=0; i<msgList.size(); i++) {
ChatMsg chatMsg = new ChatMsg(msgList.get(i).getMessage(),msgList.get(i).getOther());
chatMsgList.add(chatMsg);
}
imAdapter.notifyDataSetChanged();
}
}
适配器类文件:
public class ImAdapter extends RecyclerView.Adapter <RecyclerView.ViewHolder> {
private List<ChatMsg> chatMsgList = new ArrayList<ChatMsg>();
final int VIEW_TYPE_USER = 1;
final int VIEW_TYPE_OTHER = 0;
public ImAdapter(List<ChatMsg> chatMsgList){
this.chatMsgList = chatMsgList;
}
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if (viewType==VIEW_TYPE_USER){
View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_chat_msg_user,parent,false);
return new ImUserViewHolder(itemView);
}else {
View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_chat_msg_other,parent,false);
return new ImOtherViewHolder(itemView);
}
}
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
if (holder.getItemViewType()==VIEW_TYPE_USER){
ChatMsg chatMsg = chatMsgList.get(position);
ImUserViewHolder imUserViewHolder = (ImUserViewHolder)holder;
imUserViewHolder.msg.setText(chatMsg.getMsg());
}else {
ChatMsg chatMsg = chatMsgList.get(position);
ImOtherViewHolder imOtherViewHolder = (ImOtherViewHolder) holder;
imOtherViewHolder.msg.setText(chatMsg.getMsg());
}
}
@Override
public int getItemViewType(int position) {
ChatMsg chatMsg = chatMsgList.get(position);
if (chatMsg.getOther().equals("true")){
return VIEW_TYPE_OTHER;
}else {
return VIEW_TYPE_USER;
}
}
@Override
public int getItemCount() {
return chatMsgList.size();
}
public class ImOtherViewHolder extends RecyclerView.ViewHolder{
public TextView msg;
public ImOtherViewHolder(View itemView) {
super(itemView);
msg = (TextView)itemView.findViewById(R.id.tv_chat_msg_other);
}
}
public class ImUserViewHolder extends RecyclerView.ViewHolder{
public TextView msg;
public ImUserViewHolder(View itemView) {
super(itemView);
msg = (TextView)itemView.findViewById(R.id.tv_chat_msg_user);
}
}
}
活动layout.xml文件:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_im"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.abdralabs.talksee.IMActivity"
android:weightSum="10">
<android.support.design.widget.AppBarLayout
android:id="@+id/im_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/im_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/title">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/rv_im"
android:layout_width="match_parent"
android:layout_height="0dp"
android:scrollbars="vertical"
android:layout_weight="8.7"/>
<RelativeLayout
android:id="@+id/rl_im"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="12dp"
android:orientation="vertical"
android:layout_weight="1.3">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<EditText
android:id="@+id/et_im"
android:layout_width="290dp"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Enter message..."
android:inputType="textPersonName">
</EditText>
<android.support.v7.widget.AppCompatImageButton
android:id="@+id/ib_cam_send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/ic_menu_camera"
android:layout_gravity="end|center_vertical"/>
</FrameLayout>
<ImageButton
android:id="@+id/ib_send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:contentDescription="send"
app:srcCompat="@android:drawable/ic_menu_send" />
</RelativeLayout>
</LinearLayout>
收到的消息的xml布局(蓝色消息):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/bg_im_chat_msg_other"
android:paddingBottom="10dp"
android:paddingTop="10dp"
android:paddingLeft="5dp"
android:paddingRight="5dp">
<TextView
android:id="@+id/tv_chat_msg_other"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="this is other"
android:textSize="16dp"
android:layout_alignParentTop="true"
android:textColor="@color/black"/>
<TextView
android:id="@+id/tv_time_chat_msg_other"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="00:00"
android:textSize="11dp"
android:layout_alignLeft="@+id/tv_chat_msg_other"
android:layout_alignStart="@+id/tv_chat_msg_other"
android:layout_below="@+id/tv_chat_msg_other"/>
</RelativeLayout>
发送的消息的xml布局(灰色消息):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="10dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="10dp"
android:background="@drawable/bg_im_chat_msg_user"
android:gravity="right">
<TextView
android:id="@+id/tv_chat_msg_user"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="this is me"
android:background="@drawable/bg_im_chat_msg_user"
android:textColor="@color/black"
android:textSize="16dp"
android:layout_alignParentTop="true" />
<TextView
android:id="@+id/tv_time_chat_msg_user"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="00:00"
android:textSize="11dp"
android:layout_alignLeft="@+id/tv_chat_msg_user"
android:layout_alignStart="@+id/tv_chat_msg_user"
android:layout_below="@+id/tv_chat_msg_user" />
</RelativeLayout>
我已经设置了相对布局的android:gravity =“right”,以便灰色消息将向右对齐,但显然这不起作用。我甚至尝试设置android:layout_gravity =“right”,但结果仍然相同。 有人可以指出我做错了吗?
答案 0 :(得分:2)
例如,您可以将RelativeLayout
包裹在FrameLayout
的灰色消息布局中,并将android:gravity="right"
更改为android:layout_gravity="right"
。
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/bg_im_chat_msg_user"
android:layout_gravity="right"
android:paddingBottom="10dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="10dp">
<TextView
android:id="@+id/tv_chat_msg_user"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="@drawable/bg_im_chat_msg_user"
android:text="this is me"
android:textColor="@color/black"
android:textSize="16dp"/>
<TextView
android:id="@+id/tv_time_chat_msg_user"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/tv_chat_msg_user"
android:layout_alignStart="@+id/tv_chat_msg_user"
android:layout_below="@+id/tv_chat_msg_user"
android:text="00:00"
android:textSize="11dp"/>
</RelativeLayout>
</FrameLayout>
您还可以在另一个RelativeLayout
中扭曲RelativeLayout
,然后从android:gravit="right"
更改为android:layout_alignParentRight="true"
。