Несколько типов представлений в Recycler View установлены неправильно

Question

У меня есть список из двух массивов, и я хочу установить адаптер так, чтобы он выглядел так, как показано ниже. Но когда я настраиваю адаптер, я получаю вид, как второй экран. Это мой код адаптера:

public class ItemArrayAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
final int VIEW_TYPE_MESSAGE = 0;
final int VIEW_TYPE_IMAGE = 1;
private static final String TAG = "ItemArrayAdapter";
Context context;
ArrayList<BeforLoginDao.Article> mArticleList;
ArrayList<BeforLoginDao.Quiz> mQuizList;
int i=0;

public ItemArrayAdapter(Context context,ArrayList<BeforLoginDao.Quiz> mQuizList, ArrayList<BeforLoginDao.Article> mArticleList ){
    this.context = context;
    this.mArticleList = mArticleList;
    this.mQuizList = mQuizList;
}

@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType){
    View itemView;
    if(viewType == VIEW_TYPE_MESSAGE){
        itemView= LayoutInflater.from(parent.getContext()).inflate(R.layout.article_layout,parent,false);
        return new ArticleViewHolder(itemView);
    }
    else if(viewType == VIEW_TYPE_IMAGE){
        itemView= LayoutInflater.from(parent.getContext()).inflate(R.layout.quiz,parent,false);
        return new QuizViewHolder(itemView);
    }

    return null;
}

@Override
public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int position){
    Log.e(TAG, "onBindViewHolder: " +position);
    if(viewHolder instanceof ArticleViewHolder){
        ((ArticleViewHolder) viewHolder).populate(mArticleList.get(position));
    }
    else if(viewHolder instanceof QuizViewHolder){
        ((QuizViewHolder) viewHolder).populate(mQuizList.get(position - mArticleList.size()));
    }
}

@Override
public int getItemCount(){
    return mArticleList.size() + mQuizList.size();
}

@Override
public int getItemViewType(int position){
    Log.e(TAG, "getItemViewType: " +position );
    if(position < mArticleList.size()){
        return VIEW_TYPE_MESSAGE;
    }

    if(position - mArticleList.size() < mQuizList.size()){
        return VIEW_TYPE_IMAGE;
    }

    return -1;
}

public class ArticleViewHolder extends RecyclerView.ViewHolder {
    public TextView mTitle, mTag1, mTag2  ;
    ImageView mImageView;
    public ArticleViewHolder(View itemView) {
        super(itemView);
        mTitle =  itemView.findViewById(R.id.tv_article_title);
        mTag1 = itemView.findViewById(R.id.tv_article_tag1);
        mTag2 = itemView.findViewById(R.id.tv_article_tag2);
        mImageView=itemView.findViewById(R.id.img_article);
    }

    public void populate(BeforLoginDao.Article chatWrapper){
       mTitle.setText(chatWrapper.articleTitle.toString());
       mTag1.setText(chatWrapper.subtag1);
       mTag2.setText(chatWrapper.subtag2);

    }
}

public class QuizViewHolder extends RecyclerView.ViewHolder {
    public TextView tvQuizTitle, tvQuizTag1, tvQuizTag2 ;
    public QuizViewHolder(View itemView) {
        super(itemView);

        tvQuizTitle =  itemView.findViewById(R.id.tv_quiz_title);
        tvQuizTag1 =itemView.findViewById(R.id.tv_quiz_tag1);
        tvQuizTag2=itemView.findViewWithTag(R.id.tv_quiz_tag2);



    }

    public void populate(BeforLoginDao.Quiz imageDataWrapper){
        Log.e(TAG, "ViewHolderTwo: " +imageDataWrapper.toString()  );
      tvQuizTitle.setText(imageDataWrapper.quizTitle);
      tvQuizTag1.setText(imageDataWrapper.quiz_subtag1);
    }
}

}

Чтобы решить эту ошибку, я также проверил много решений на SO. Ссылка: введите описание ссылки здесь

Ниже показан первый и второй экран. Скрин тот, который мне нужен, скрин второй, который я получаю.