如何在循环器视图的两侧对发送和接收消息进行线程化消息视图



我正在用Firebase制作一个聊天应用程序,基本上该应用程序运行良好。我正在处理UI,它有一个问题,消息收件人或发件人是RecyclerView的一侧,我希望它两侧都是(右侧为发件人,左侧为收件人)我已经有两个XML文件用于消息收件人和发件人,所以我如何使用item_message_input.XML用于发件人,item_message.XML用于收件人(对不起,我不知道如何清楚地描述我的问题)。

这是我的代码:

主要活动.java

public class MainActivity extends AppCompatActivity
implements GoogleApiClient.OnConnectionFailedListener {
public static class MessageViewHolder extends RecyclerView.ViewHolder {
public TextView messageTextView;
public TextView messengerTextView;
public CircleImageView messengerImageView;
public MessageViewHolder(View v) {
super(v);
messageTextView = (TextView) itemView.findViewById(R.id.messageTextView);
messengerTextView = (TextView) itemView.findViewById(R.id.messengerTextView);
messengerImageView = (CircleImageView) itemView.findViewById(R.id.messengerImageView);
}
}
private static final String TAG = "MainActivity";
public static final String MESSAGES_CHILD = "messages";
private static final int REQUEST_INVITE = 1;
public static final int DEFAULT_MSG_LENGTH_LIMIT = 150;
public static final String ANONYMOUS = "anonymous";
private static final String MESSAGE_SENT_EVENT = "message_sent";
private String mUsername;
private String mPhotoUrl;
private SharedPreferences mSharedPreferences;
private GoogleApiClient mGoogleApiClient;
private Button mSendButton;
private RecyclerView mMessageRecyclerView;
private LinearLayoutManager mLinearLayoutManager;
private ProgressBar mProgressBar;
private EditText mMessageEditText;
// Firebase instance variables
private FirebaseAuth mFirebaseAuth;
private FirebaseUser mFirebaseUser;
private DatabaseReference mFirebaseDatabaseReference;
private FirebaseRecyclerAdapter<FriendlyMessage, MessageViewHolder> mFirebaseAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mSharedPreferences = PreferenceManager.getDefaultSharedPreferences(this);
// Set default username is anonymous.
mUsername = ANONYMOUS;
// Initialize FirebaseAuth
mFirebaseAuth = FirebaseAuth.getInstance();
mFirebaseUser = mFirebaseAuth.getCurrentUser();
if (mFirebaseUser == null) {
// Not signed in, launch the Sign In activity
startActivity(new Intent(this, SignInActivity.class));
finish();
return;
} else {
mUsername = mFirebaseUser.getDisplayName();
if (mFirebaseUser.getPhotoUrl() != null) {
mPhotoUrl = mFirebaseUser.getPhotoUrl().toString();
}
}
mGoogleApiClient = new GoogleApiClient.Builder(this)
.enableAutoManage(this /* FragmentActivity */, this /* OnConnectionFailedListener */)
.addApi(Auth.GOOGLE_SIGN_IN_API)
.build();
// Initialize ProgressBar and RecyclerView.
mProgressBar = (ProgressBar) findViewById(R.id.progressBar);
mMessageRecyclerView = (RecyclerView) findViewById(R.id.messageRecyclerView);
mLinearLayoutManager = new LinearLayoutManager(this);
mLinearLayoutManager.setStackFromEnd(true);
mMessageRecyclerView.setLayoutManager(mLinearLayoutManager);
// New child entries
mFirebaseDatabaseReference = FirebaseDatabase.getInstance().getReference();
mFirebaseAdapter = new FirebaseRecyclerAdapter<FriendlyMessage,
MessageViewHolder>(
FriendlyMessage.class,
R.layout.item_message,
MessageViewHolder.class,
mFirebaseDatabaseReference.child(MESSAGES_CHILD)) {
@Override
protected void populateViewHolder(MessageViewHolder viewHolder,
FriendlyMessage friendlyMessage, int position) {
mProgressBar.setVisibility(ProgressBar.INVISIBLE);
viewHolder.messengerTextView.setText(friendlyMessage.getName());
viewHolder.messageTextView.setText(friendlyMessage.getText());
if (friendlyMessage.getPhotoUrl() == null) {
viewHolder.messengerImageView
.setImageDrawable(ContextCompat
.getDrawable(MainActivity.this,
R.drawable.ic_account_circle_black_48dp));
} else {
Glide.with(MainActivity.this)
.load(friendlyMessage.getPhotoUrl())
.into(viewHolder.messengerImageView);
}
}
};
mFirebaseAdapter.registerAdapterDataObserver(new RecyclerView.AdapterDataObserver() {
@Override
public void onItemRangeInserted(int positionStart, int itemCount) {
super.onItemRangeInserted(positionStart, itemCount);
int friendlyMessageCount = mFirebaseAdapter.getItemCount();
int lastVisiblePosition =
mLinearLayoutManager.findLastCompletelyVisibleItemPosition();
// If the recycler view is initially being loaded or the
// user is at the bottom of the list, scroll to the bottom
// of the list to show the newly added message.
if (lastVisiblePosition == -1 ||
(positionStart >= (friendlyMessageCount - 1) &&
lastVisiblePosition == (positionStart - 1))) {
mMessageRecyclerView.scrollToPosition(positionStart);
}
}
});
mMessageRecyclerView.setLayoutManager(mLinearLayoutManager);
mMessageRecyclerView.setAdapter(mFirebaseAdapter);
mMessageEditText = (EditText) findViewById(R.id.messageEditText);
mMessageEditText.setFilters(new InputFilter[]{new InputFilter.LengthFilter(mSharedPreferences
.getInt(CodelabPreferences.FRIENDLY_MSG_LENGTH, DEFAULT_MSG_LENGTH_LIMIT))});
mMessageEditText.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
if (charSequence.toString().trim().length() > 0) {
mSendButton.setEnabled(true);
} else {
mSendButton.setEnabled(false);
}
}
@Override
public void afterTextChanged(Editable editable) {
}
});
mSendButton = (Button) findViewById(R.id.sendButton);
mSendButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
FriendlyMessage friendlyMessage = new
FriendlyMessage(mMessageEditText.getText().toString(), mUsername, mPhotoUrl);
mFirebaseDatabaseReference.child(MESSAGES_CHILD).push().setValue(friendlyMessage);
mMessageEditText.setText("");
}
});
}
@Override
public void onStart() {
super.onStart();
// Check if user is signed in.
// TODO: Add code to check if user is signed in.
}
@Override
public void onPause() {
super.onPause();
}
@Override
public void onResume() {
super.onResume();
}
@Override
public void onDestroy() {
super.onDestroy();
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main_menu, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.sign_out_menu:
mFirebaseAuth.signOut();
Auth.GoogleSignInApi.signOut(mGoogleApiClient);
mUsername = ANONYMOUS;
setResult(RESULT_OK);
finish();
startActivity(new Intent(this, SignInActivity.class));
return true;
default:
return super.onOptionsItemSelected(item);
}
}
@Override
public void onConnectionFailed(@NonNull ConnectionResult connectionResult) {
// An unresolvable error has occurred and Google APIs (including Sign-In) will not
// be available.
Log.d(TAG, "onConnectionFailed:" + connectionResult);
Toast.makeText(this, "Google Play Services error.", Toast.LENGTH_SHORT).show();
}

item_message.xml

<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/messengerImageView"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_gravity="top" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/msg_bubble_incoming">
<TextView
android:id="@+id/messageTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:padding="8dp"
android:textColor="#ffffff"
android:textSize="16sp" />
<TextView
android:id="@+id/messengerTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/messageTextView"
android:gravity="center_vertical"
android:paddingBottom="8dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:textAllCaps="true"
android:textColor="#a2ffffff"
android:textSize="10sp"
android:textStyle="bold" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>

item_message_input.xml

<?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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/msg_bubble_input"
android:layout_alignParentTop="true"
android:layout_toLeftOf="@+id/messengerImageView2"
android:layout_toStartOf="@+id/messengerImageView2">
<TextView
android:id="@+id/messageTextView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:padding="8dp"
android:textColor="#ffffff"
android:textSize="16sp" />
<TextView
android:id="@+id/messengerTextView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/messageTextView2"
android:gravity="center_vertical"
android:paddingBottom="8dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:textAllCaps="true"
android:textColor="#a2ffffff"
android:textSize="10sp"
android:textStyle="bold" />
</RelativeLayout>
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/messengerImageView2"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
</LinearLayout>

所以,在这种情况下,有可能让消息出现在RecyclerView的两侧吗?请帮帮我:(非常感谢!

在回收器视图中,您需要两个视图持有者。一个是SenderViewHolder,另一个是RecipientViewHolder。

在recyclerView的数据集中。每个元素(消息)都应该说明它是已发送的消息还是已接收的消息,根据类型,您可以膨胀并填充适当的viewHolder。

在发送方的xml中,设置android:gravity = "left",在接收方的xml中设置android:gravity = "right"

简而言之,您将有一个回收器视图,其中列出发送和接收的消息。发送和接收都有自己的viewholder。因此,对于这两个视图持有者,您将需要两个xml。

在视图持有者的xml中,为一个视图持有者设置android:gravity = "left",为另一个设置android:gravity = "left"。重力设置在第一个标记中。<LinearLayout>

在您的recyclerView适配器中执行以下操作:

ArrayList<Message> dataSet = new ArrayList<>(); // declare this as class level property.

首先,您必须在recyclerview适配器中覆盖getItemViewType()

@Override
public int getItemViewType(int position) {
if(dataset.get(position).getType == "sent") {
return 1;
} else {
return 2;
}
}

则覆盖onCreateViewHolder()

@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if(viewType = 1) {
View view = LayoutInflater.from(context).inflate(R.layout.sent_view_holder_layout, parent, false);
return new SentViewHolder(view);
} else {
LayoutInflater.from(context).inflate(R.layout.received_view_holder_layout, parent, false);
return new ReceivedViewHolder(view);
}
}

然后覆盖onBindViewHolder()

@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
if(dataSet.get(position).getType== "sent") {
populateSentViewHolder(holder, position);
} else {
populateReceivedViewHolder(holder, position);
}
}
private void populateSentViewHolder(RecyclerView.ViewHolder holder, int position) {
Message message = dataSet.get(position);
((SentViewHolder)holder).senderNameTextView.setText(message.getSender());
((SentViewHolder)holder).messageTextView.setText(message.getMessage());
}
private void populateReceivedViewHolder(RecyclerView.ViewHolder holder, int   position) {
Message message = dataSet.get(position);
((ReceivedViewHolder)holder).senderNameTextView.setText(message.getSender());
((ReceivedViewHolder)holder).messageTextView.setText(message.getMessage());
}

在populate方法中,用数据填充小部件。

如果你了解recyclerViews的工作原理,这个答案就足够了。

在FirebaseRecyclerAdapter中准备两个ViewType项目,第一个是发件人(右),第二个是收件人(左)。您还需要传递发件人用户名:

public class FirebaseRecyclerAdapter extends RecyclerView.Adapter {
...
//you can initialize sendername in constructor
public String mSenderName = "The Sender Name";
public static final int VT_SENDER = 0;
public static final int VT_RECIPIENT = 1;
...
@Override
public int getItemViewType(int position) {
if (((FriendlyMessage)mItems.get(position)).getUserName() == mSenderName)
return VT_SENDER;
else
return VT_RECIPIENT;
}
...
@Override
public MessageViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View v;        
switch (viewType) {
case VT_SENDER:
v = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_message_input, parent, false);
break;
case VT_RECIPIENT:
v = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_message, parent, false);
break;
}
return new MessageViewHolder(v);
}
...
}

最新更新