android - adding different layouts for every view in recyclerview

Question

I am making an android chat app. I have a recyclerview to show messages. i have two different layouts for messages, one for sent and one for received. my recyclerview doesnt throw any error but is doesnt show anything on the screen.

This is my adapter class :

public class ChatAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private List<Chat> items;

private final int USER = 1, CONTACT = 2;

// Provide a suitable constructor (depends on the kind of dataset)
public ChatAdapter(List<Chat> items) {
    this.items = items;
}

// Return the size of your dataset (invoked by the layout manager)
@Override
public int getItemCount() {
    return this.items.size();
}

@Override
public int getItemViewType(int position) {
    if(items.get(position).getType()==1)
        return USER;
    else
        return CONTACT;
}

@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
    RecyclerView.ViewHolder viewHolder;
    LayoutInflater inflater = LayoutInflater.from(viewGroup.getContext());
    switch (viewType){
        case USER:
            View v1 = inflater.inflate(R.layout.chat_item_user, viewGroup, false);
            viewHolder = new ViewHolder1(v1);
            break;
        default:
            View v2 = inflater.inflate(R.layout.chat_item_contact, viewGroup, false);
            viewHolder = new ViewHolder1(v2);

    }
    return viewHolder;
}

@Override
public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int position) {
    switch (viewHolder.getItemViewType()) {
        case USER:
            ViewHolder1 vh1 = (ViewHolder1) viewHolder;
            configureViewHolder1(vh1, position);
            break;
        default:
            ViewHolder2 vh2 = (ViewHolder2) viewHolder;
            configureViewHolder2(vh2, position);
            break;
    }
}
public void configureViewHolder1(ViewHolder1 viewHolder, int position){
    Chat chat = items.get(position);
    viewHolder.getTv().setText(chat.getMsg());
}
public void configureViewHolder2(ViewHolder2 viewHolder, int position){
    Chat chat = items.get(position);
    viewHolder.getTv().setText(chat.getMsg());
}

}

This is my Chat class:

public class Chat {
private int type;
private String msg;
private long time;
public Chat(int type,long time,String msg){this.type = type; this.msg = msg; this.time = time;}
public int getType(){return type;}
public void setType(int type){this.type = type;}
public String getMsg(){return msg;}
public void setMsg(String msg){this.msg = msg;}
public long getTime(){return time;}
public void setTime(long time){this.time = time;}
}

This my layout containing the recylcerview :

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ChatActivity">

<TextView
    android:id="@+id/textView3"
    android:layout_width="368dp"
    android:layout_height="59dp"
    android:layout_marginEnd="9dp"
    android:layout_marginStart="7dp"
    android:layout_marginTop="16dp"
    android:background="@android:color/holo_green_light"
    android:text="TextView"
    android:textSize="30sp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />


<android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="368dp"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:layout_height="394dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView3" />

<EditText
    android:id="@+id/editText8"
    android:layout_width="325dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="5dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="1dp"
    android:ems="10"
    android:inputType="textMultiLine"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toStartOf="@+id/imageButton"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/recyclerView" />

<ImageButton
    android:id="@+id/imageButton"
    android:layout_width="53dp"
    android:layout_height="54dp"
    android:scaleType="fitCenter"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/recyclerView"
    app:srcCompat="@drawable/logo_arrow" />

These are my two layouts:

a. chat_item_contact

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
    android:id="@+id/textView5"
    android:layout_width="323dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginEnd="16dp"
    android:layout_marginStart="45dp"
    android:layout_marginTop="16dp"
    android:background="@android:color/holo_green_light"
    android:paddingLeft="10dp"
    android:text="TextView"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

b. chat_item_user

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
    android:id="@+id/textView4"
    android:layout_width="329dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:layout_marginEnd="48dp"
    android:layout_marginStart="7dp"
    android:layout_marginTop="7dp"
    android:background="@android:color/holo_green_light"
    android:paddingLeft="10dp"
    android:text="TextView"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

Answer 1

I've done something similar, you should focus mostly on getItemViewType Here is how I do (also I suggest you to use RecyclerView instead of ListView)

@Override
public int getItemViewType(int position){
    if (/*your condition based on message received or sent*/) {
        return VIEW_MESSAGE_RECEIVED;
    }
    else {
        return VIEW_MESSAGE_SENT;
    }
}

After, you just check what getItemViewType has returned

@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    if (viewType == VIEW_MESSAGE_RECEIVED) {
        View view = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.chat_message_item_received, parent, false);

        return new ChatAdapter.MyViewHolder(view);
    }else {
        View eventDataView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.chat_message_item_sent, parent, false);

        return new ChatAdapter.MyViewHolder(view);
    }
}