How to update current view of viewpager?

Question

I'm performing on click on current button to change its background color and it is changing the next page button background basically I want when user clicks on any of 4 options of the question if it is correct change it to green otherwise red but it is changing the background of next page button and even if I'm clicking on option1 and showing toast to get text of that option it is showing the text of next page option1 what should I do help me please.

package com.app.apti.adapter;

import android.content.Context;
import android.support.design.widget.CoordinatorLayout;
import android.support.v4.view.PagerAdapter;
import android.text.Html;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.Toast;

import com.app.apti.R;
import com.app.apti.model.QuestionData;

import java.util.ArrayList;


public class QuestionViewPager extends PagerAdapter {


LinearLayout option1color,option2color,option3color,option4color;
TextView option1,option2,option3,option4,ques,questionno;
private Context context;
ArrayList<QuestionData> question;
LayoutInflater layoutInflater;
ImageView imageView;
String category;

public QuestionViewPager(Context context, ArrayList<QuestionData> 
question,String category)
{
    this.context=context;
    layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    this.question=question;
    this.category=category;
}

@Override
public int getCount() {
    if(question != null){
        return question.size();
    }
    return 0;
}

@Override
public boolean isViewFromObject(View view, Object object) {
    return view == ((LinearLayout) object);
}

@Override
public int getItemPosition(Object object) {
    return POSITION_NONE;
}

@Override
public Object instantiateItem(ViewGroup container, final int position) {
    View itemView = layoutInflater.inflate(R.layout.questionlayout, container, false);
    option1color=(LinearLayout)itemView.findViewWithId(R.id.color_option1);
    option2color=(LinearLayout)itemView.findViewById(R.id.color_option2);
    option3color=(LinearLayout)itemView.findViewById(R.id.color_option3);
    option4color=(LinearLayout)itemView.findViewById(R.id.color_option4);

    option1=(TextView)itemView.findViewById(R.id.option1);
    option2=(TextView)itemView.findViewById(R.id.option2);
    option3=(TextView)itemView.findViewById(R.id.option3);
    option4=(TextView)itemView.findViewById(R.id.option4);
    ques=(TextView)itemView.findViewById(R.id.ques);
    questionno=(TextView)itemView.findViewById(R.id.questionno);

    questionno.setText(position+1+"/"+getCount());
    ques.setText(Html.fromHtml(question.get(position).getQues()));
    option1.setText(Html.fromHtml(question.get(position).getOpt1()));
    option2.setText(Html.fromHtml(question.get(position).getOpt2()));
    option3.setText(Html.fromHtml(question.get(position).getOpt3()));
    option4.setText(Html.fromHtml(question.get(position).getOpt4()));

    option1color.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            notifyDataSetChanged();
            Toast.makeText(context,option1.getText().toString(),Toast.LENGTH_SHORT).show();
            if(question.get(position).getAns().equalsIgnoreCase(option1.getText().toString()))
            {

                option1color.setBackgroundResource(R.drawable.round_corner_green);
            }else
            {
                option1color.setBackgroundResource(R.drawable.round_corner_red);

            }
        }
    });
    option2color.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(question.get(position).getAns().equalsIgnoreCase(option2.getText().toString()))
            {
                option2color.setBackgroundResource(R.drawable.round_corner_green);
            }else
            {
                option2color.setBackgroundResource(R.drawable.round_corner_red);

            }
        }
    });
    option3color.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(question.get(position).getAns().equalsIgnoreCase(option3.getText().toString()))
            {
                option3color.setBackgroundResource(R.drawable.round_corner_green);
            }else
            {
                option3color.setBackgroundResource(R.drawable.round_corner_red);

            }
        }
    });
    option4color.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(question.get(position).getAns().equalsIgnoreCase(option4.getText().toString()))
            {
                option4color.setBackgroundResource(R.drawable.round_corner_green);
            }else
            {
                option4color.setBackgroundResource(R.drawable.round_corner_red);

            }
        }
    });

    container.addView(itemView);

    return itemView;
}

@Override
public void destroyItem(ViewGroup container, int position, Object object) {
    container.removeView((LinearLayout) object);
}



}

Answer 1

This happening because

LinearLayout option1color,option2color,option3color,option4color;
TextView option1,option2,option3,option4,ques,questionno;

are fields and their values will be set to the last values set in the last call of instantiateItem. So when the on click callback is called, they just get the last assigned values. Just make them local variable within the instantiateItem method body and you should be fine.

Full code:

package com.app.apti.adapter;

import android.content.Context;
import android.support.design.widget.CoordinatorLayout;
import android.support.v4.view.PagerAdapter;
import android.text.Html;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.Toast;

import com.app.apti.R;
import com.app.apti.model.QuestionData;

import java.util.ArrayList;


public class QuestionViewPager extends PagerAdapter {

private Context context;
ArrayList<QuestionData> question;
LayoutInflater layoutInflater;
ImageView imageView;
String category;

public QuestionViewPager(Context context, ArrayList<QuestionData> 
question,String category)
{
    this.context=context;
    layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    this.question=question;
    this.category=category;
}

@Override
public int getCount() {
    if(question != null){
        return question.size();
    }
    return 0;
}

@Override
public boolean isViewFromObject(View view, Object object) {
    return view == ((LinearLayout) object);
}

@Override
public int getItemPosition(Object object) {
    return POSITION_NONE;
}

@Override
public Object instantiateItem(ViewGroup container, final int position) {
    /* ALL LOCAL VARIABLES */
    LinearLayout option1color,option2color,option3color,option4color;
    TextView option1,option2,option3,option4,ques,questionno;

    View itemView = layoutInflater.inflate(R.layout.questionlayout, container, false);
    option1color=(LinearLayout)itemView.findViewWithTag(R.id.color_option1);
    option2color=(LinearLayout)itemView.findViewById(R.id.color_option2);
    option3color=(LinearLayout)itemView.findViewById(R.id.color_option3);
    option4color=(LinearLayout)itemView.findViewById(R.id.color_option4);

    option1=(TextView)itemView.findViewById(R.id.option1);
    option2=(TextView)itemView.findViewById(R.id.option2);
    option3=(TextView)itemView.findViewById(R.id.option3);
    option4=(TextView)itemView.findViewById(R.id.option4);
    ques=(TextView)itemView.findViewById(R.id.ques);
    questionno=(TextView)itemView.findViewById(R.id.questionno);

    questionno.setText(position+1+"/"+getCount());
    ques.setText(Html.fromHtml(question.get(position).getQues()));
    option1.setText(Html.fromHtml(question.get(position).getOpt1()));
    option2.setText(Html.fromHtml(question.get(position).getOpt2()));
    option3.setText(Html.fromHtml(question.get(position).getOpt3()));
    option4.setText(Html.fromHtml(question.get(position).getOpt4()));

    option1color.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Toast.makeText(context,option1.getText().toString(),Toast.LENGTH_SHORT).show();
            if(question.get(position).getAns().equalsIgnoreCase(option1.getText().toString()))
            {

                option1color.setBackgroundResource(R.drawable.round_corner_green);
            }else
            {
                option1color.setBackgroundResource(R.drawable.round_corner_red);

            }
        }
    });
    option2color.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(question.get(position).getAns().equalsIgnoreCase(option2.getText().toString()))
            {
                option2color.setBackgroundResource(R.drawable.round_corner_green);
            }else
            {
                option2color.setBackgroundResource(R.drawable.round_corner_red);

            }
        }
    });
    option3color.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(question.get(position).getAns().equalsIgnoreCase(option3.getText().toString()))
            {
                option3color.setBackgroundResource(R.drawable.round_corner_green);
            }else
            {
                option3color.setBackgroundResource(R.drawable.round_corner_red);

            }
        }
    });
    option4color.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(question.get(position).getAns().equalsIgnoreCase(option4.getText().toString()))
            {
                option4color.setBackgroundResource(R.drawable.round_corner_green);
            }else
            {
                option4color.setBackgroundResource(R.drawable.round_corner_red);

            }
        }
    });

    container.addView(itemView);

    return itemView;
}

@Override
public void destroyItem(ViewGroup container, int position, Object object) {
    container.removeView((LinearLayout) object);
}



}