I need to create a chat view like below image. if there are members more than 3, need to show number. But images need to retrieved from URL. i have done a research but can't find any example. here i have set one Image in a imageView.Can anyone help me?
ChatAdapter.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/chat_list_border"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:id="@+id/view_background"
android:padding="10dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="end|center"
android:gravity="end|center"
android:text="@string/delete"
android:textColor="@color/white"
android:textSize="15sp" />
</LinearLayout>
<LinearLayout
android:id="@+id/view_foreground"
android:padding="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="10sp"
android:orientation="horizontal">
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/chat_image"
android:layout_width="50sp"
android:layout_height="50sp"
android:layout_gravity="center"
android:layout_weight="0" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_weight="1"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/chat_name"
style="@style/defaultTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="@font/abhaya_libre_extra_bold"
android:textColor="@color/defaultTextColor"
android:textSize="16sp" />
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/chat_message"
style="@style/defaultTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:textColor="@color/defaultTextColor"
android:fontFamily="@font/abhaya_libre_semi_bold"
android:textSize="14sp" />
</LinearLayout>
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/chat_date"
style="@style/defaultTextStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_weight="0"
android:gravity="center"
android:text=""
android:textColor="@color/black"
android:textSize="14sp" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="0.5dp"
android:layout_marginStart="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp" />
</LinearLayout>
</FrameLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
ChatAdapter.java
public class ChatAdapter extends RecyclerView.Adapter<ChatAdapter.ViewHolder> {
Context context;
List<ChatList> chatLists;
public ChatAdapter(Context context, List<ChatList> chatLists) {
this.context = context;
this.chatLists = chatLists;
}
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.chat_adapter, null, false);
return new ViewHolder(view);
}
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
ChatList item = chatLists.get(position);
holder.name.setText(item.getName());
holder.message.setText(item.getMessage());
holder.date.setText(item.getDate());
Glide.with(context)
.load(item.getImage())
.fitCenter()
.diskCacheStrategy(DiskCacheStrategy.NONE)
.into(holder.image);
holder.itemView.setOnClickListener(view -> {
Intent intent = new Intent(context, ChatMessageActivity.class);
intent.putExtra("chatname", item.getName());
context.startActivity(intent);
});
}
public void removeItem(int position) {
chatLists.remove(position);
notifyItemRemoved(position);
}
public void restoreItem(ChatList item, int position) {
chatLists.add(position, item);
notifyItemInserted(position);
}
public List<ChatList> getData() {
return chatLists;
}
@Override
public int getItemCount() {
return chatLists.size();
}
public class ViewHolder extends RecyclerView.ViewHolder {
CircleImageView image;
AppCompatTextView name, message, date;
public LinearLayout forground, background;
public ViewHolder(@NonNull View itemView) {
super(itemView);
image = itemView.findViewById(R.id.chat_image);
name = itemView.findViewById(R.id.chat_name);
message = itemView.findViewById(R.id.chat_message);
date = itemView.findViewById(R.id.chat_date);
forground = itemView.findViewById(R.id.view_foreground);
background = itemView.findViewById(R.id.view_background);
}
}
}
ChatList.java
public class ChatList {
String name, message, date, image;
public ChatList(String name, String message, String date, String image) {
this.name = name;
this.message = message;
this.date = date;
this.image = image;
}
public String getName() {
return name;
}
public String getMessage() {
return message;
}
public String getDate() {
return date;
}
public String getImage() {
return image;
}
}
here is my chatListData
ChatList list = new ChatList("Ellen, Grandpa + 1", "Thanks for letting us know!", "Jan 04", "https://media.istockphoto.com/photos/senior-adult-male-laughing-portrait-he-is-90-years-old-picture-id155357459?k=6&m=155357459&s=612x612&w=0&h=E_uK43zNoAnt9ohSdYMbNgCyFJliuKIzTynduh7d-Ck=");
chatLists.add(list);
list = new ChatList("Ellen, Grandpa + 1", "Thanks for letting us know!", "Jan 04", "https://media.istockphoto.com/photos/senior-adult-male-laughing-portrait-he-is-90-years-old-picture-id155357459?k=6&m=155357459&s=612x612&w=0&h=E_uK43zNoAnt9ohSdYMbNgCyFJliuKIzTynduh7d-Ck=");
chatLists.add(list);
list = new ChatList("Ellen, Grandpa + 1", "Thanks for letting us know!", "Jan 04", "https://media.istockphoto.com/photos/senior-adult-male-laughing-portrait-he-is-90-years-old-picture-id155357459?k=6&m=155357459&s=612x612&w=0&h=E_uK43zNoAnt9ohSdYMbNgCyFJliuKIzTynduh7d-Ck=");
chatLists.add(list);
