Show a string in multiple TextViews in adapter

My App currently displays 4 options (which I want to make clickable) in a single TextView. At the moment, it looks like this (i.e. last message bubble): app picture

Instead of the above, I want to have those options as 4 separate TextViews, like in this example. I researched multiple solutions, but none of them worked for me, because I am using RecyclerView.Adapter. Here is the relevant part:

 case OPTION:

            String option = "";
            option = message.getMessage();
            for ( DialogNodeOutputOptionsElement r : message.getOptions() ){
                 option += r.getLabel()+"<br/>";
                ((ViewHolder) holder).message.setText(Html.fromHtml(option));
                // new TextView for next Option

The whole ChatAdapter looks like this:

    public class ChatAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {

    protected Activity activity;
    private int SELF = 100;
    private ArrayList<Message> messageArrayList;



    public ChatAdapter(ArrayList<Message> messageArrayList) {
        this.messageArrayList = messageArrayList;

    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View itemView;

        // view type is to identify where to render the chat message
        // left or right
        if (viewType == SELF) {
            // self message
            itemView = LayoutInflater.from(parent.getContext())
                    .inflate(R.layout.chat_item_self, parent, false);
        } else {
            // WatBot message
            itemView = LayoutInflater.from(parent.getContext())
                    .inflate(R.layout.chat_item_watson, parent, false);
        }


        return new ViewHolder(itemView);
    }

    @Override
    public int getItemViewType(int position) {
        Message message = messageArrayList.get(position);
        if (message.getId() != null && message.getId().equals("1")) {
            return SELF;
        }

        return position;
    }
    @Override
    public void onBindViewHolder(final RecyclerView.ViewHolder holder, int position) {
        Message message = messageArrayList.get(position);
        switch (message.type) {
            case TEXT:
                ((ViewHolder) holder).message.setText(Html.fromHtml(message.getMessage()+"<br/>"));

                    break;
            case IMAGE:
                ((ViewHolder) holder).message.setVisibility(View.GONE);
                ImageView iv = ((ViewHolder) holder).image;
                Glide
                        .with(iv.getContext())
                        .load(message.getUrl())
                        .into(iv);
                break;
            case OPTION:

                String option = "";
                option = message.getMessage();
                for ( DialogNodeOutputOptionsElement r : message.getOptions() ){
                     option += r.getLabel()+"<br/>";
                    ((ViewHolder) holder).message.setText(Html.fromHtml(option));
                    // new TextView for next Option



                }
                break;
            case PAUSE:break;
        }
    }

    @Override
    public int getItemCount() {
        return messageArrayList.size();
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        TextView message;
        ImageView image;

        public ViewHolder(View view) {
            super(view);
            message = (TextView) itemView.findViewById(R.id.message);
            image = (ImageView) itemView.findViewById(R.id.image);




            //TODO: Uncomment this if you want to use a custom Font
            
        }
    }


}

and the XML looks like this:

   <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linear"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <android.support.v7.widget.AppCompatImageView
        android:layout_width="54dp"
        android:layout_height="match_parent"
        android:layout_marginLeft="5dp"
        android:src="@mipmap/new_face" />


    <TextView
        android:id="@+id/message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:layout_marginRight="5dp"
        android:layout_marginBottom="10dp"
        android:autoLink="web"
        android:background="@drawable/bg_bubble_watbot"
        android:fontFamily="sans-serif"
        android:textColor="@android:color/black"
        android:textIsSelectable="true"
        android:textSize="14sp" />

    <ImageView
        android:id="@+id/image"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        />



</LinearLayout>

Contex Error

App picture after working code

Try following:

Inside your layout, add a container for your to-be-added TextViews:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/linear"... >

    <android.support.v7.widget.AppCompatImageView ... />

    <TextView ... />

    <LinearLayout android:id="@+id/optionsContainer"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:background="@drawable/bg_bubble_watbot"
                  android:orientation="vertical" />

    <ImageView .../>

</LinearLayout>

Then, update your ViewHolder to reference the container:

public class ViewHolder extends RecyclerView.ViewHolder {
    ...
    LinearLayout optionsContainer;

    public ViewHolder(View view) {
        super(view);
        ...
        optionsContainer = (LinearLayout) itemView.findViewById(R.id.optionsContainer);
    }
}

Then, in your OPTION case:

    TextView tv = ((ViewHolder) holder).message;
    tv.setVisibility(View.GONE));
    LinearLayout optionsContainer = ((ViewHolder) holder).optionsContainer;
    TextView messageTextView = createTextView(message.getMessage(), optionsContainer.getContext());
    for ( DialogNodeOutputOptionsElement r : message.getOptions() ) {
        // you should check if r.getLabel() really returns a HTML string
        // if not, you will have to enclose it with html tags to make it clickable later
        String option = r.getLabel();
        TextView optionTextView = createTextView(option, optionsContainer.getContext());
        // add the created textView to our container
        optionsContainer.addView(optionTextView);
    }

Implement the createTextView() function inside your adapter:

private TextView createTextView(String text, Context context) {
    TextView tv = new TextView(context);
    LinearLayout.LayoutParams params=new LinearLayout.LayoutParams
            ((int) LinearLayout.LayoutParams.WRAP_CONTENT,(int) LinearLayout.LayoutParams.WRAP_CONTENT);
    tv.setLayoutParams(params);
    tv.setTextSize((float) 15);
    tv.setText(text);
    int blueColor = Color.parseColor("#0000ff");
    // make text blue
    tv.setTextColor(blueColor);
    // make text underline
    tv.setPaintFlags(tv.getPaintFlags()| Paint.UNDERLINE_TEXT_FLAG);
    tv.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            Toast.makeText(context, "Link clicked", Toast.LENGTH_SHORT).show();
            // add here what the click should do
        }
    });
    return tv;
}