savedInstanceState changes colors based on previous user actions

Issue

I have three buttons and hichever button is selected first is marked with an X whilst the second button selected will be marked with an O and the last button is marked as X again.

If an X is marked then its colour is white, if it's a O then it is marked grey.

Now what I want to do is use the saved instance so that when I rotate the phone, the colours stay the same as they were. What is actually happening is that if I rotate the phone then which ever latest selection was made, all the text reverts to that colour.

So if I press for X and the O and rotate the phone, both X and O will be displayed as the grey colour which is O's colours.

If I then select the last X and rotate the phone, all the letters will be marked as a white colour which is X's colour.

I am unsure if it's the set colour that is causing it or that is remembers who's move it was previously and sets the colour according to that, my question is how to solve it so that all the letters keep their colour on rotation?

private boolean playerOneMove = true;

private Button[][] buttons = new Button[1][3];

private static final String TEXT_COLOR = "textColor";
    private String textColor;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main_player2);

        btnObj1 = findViewById(R.id.button_00);
        btnObj2 = findViewById(R.id.button_01);
        btnObj3 = findViewById(R.id.button_02);

if (savedInstanceState != null) {
           textColor = savedInstanceState.getString(TEXT_COLOR);

            if(btnObj1 != null) {
                btnObj1.setTextColor(Color.parseColor(textColor));
            }
            if (btnObj2 != null) {
                btnObj2.setTextColor(Color.parseColor(textColor));
            }
            if (btnObj3 != null) {
                btnObj3.setTextColor(Color.parseColor(textColor));
            }

        for (int i = 0; i < 1; i++) {
            for (int j = 0; j < 3; j++) {
                String buttonID = "button_" + i + j;
                int resID = getResources().getIdentifier(buttonID, "id", getPackageName());
                buttons[i][j] = findViewById(resID);
                buttons[i][j].setOnClickListener(this);
            }
        }
}

@Override
    public void onClick(View v) {

        if (!((Button) v).getText().toString().equals("")) {
            return;
        }

        if (playerOneMove) {
            ((Button) v).setText("X");
            textColor = "#e8e5e5";
            ((Button) v).setTextColor(Color.parseColor(textColor));
        } else {
            ((Button) v).setText("O");
            textColor = "#737374";
            ((Button) v).setTextColor(Color.parseColor(textColor));
        }
}

    @Override
    protected void onSaveInstanceState(Bundle outState) {
        super.onSaveInstanceState(outState);

        outState.putBoolean("playerOneMove", playerOneMove);
        outState.putString(TEXT_COLOR, textColor);

    }

    @Override
    protected void onRestoreInstanceState(Bundle savedInstanceState) { ;
        super.onRestoreInstanceState(savedInstanceState);


        playerOneMove = savedInstanceState.getBoolean("playerOneMove");
        textColor = savedInstanceState.getString(TEXT_COLOR);


    }

Solution

The behavior you see it's normal because you save a single textColor which will always be the one which was last set by the user. Instead you could simply iterate over the buttons array and save each button's text color:

@Override
protected void onSaveInstanceState(Bundle outState) {
    super.onSaveInstanceState(outState);
    for (int i = 0; i < 1; i++) {
        for (int j = 0; j < 3; j++) {
            String buttonID = "button_" + i + j;  
            Button btn = buttons[i][j];                
            outState.putCharSequence(buttonID, btn.getText());
        }
    }
}

Then in onCreate()(remove the onRestoreInstanceState() method) restore the button's state:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main_player2);
    int playerX = Color.parseColor("#e8e5e5");
    int playerO = Color.parseColor("#737374");
    for (int i = 0; i < 1; i++) {
        for (int j = 0; j < 3; j++) {
            String buttonID = "button_" + i + j;
            int resID = getResources().getIdentifier(buttonID, "id", getPackageName());
            buttons[i][j] = findViewById(resID);
            buttons[i][j].setOnClickListener(this);
            if (savedInstanceState != null) {
                 String btnState = savedInstanceState.getCharSequence(buttonID);
                 if (btnState.equals("X")) {
                     // this is player X
                     buttons[i][j].setTextColor(playerX);
                 } else if (btnState.equals("O")) {
                     // this is player O
                     buttons[i][j].setTextColor(playerO);
                 } else {
                     // unclicked btn, do you have another color? 
                 }
            }
        }
    } 

If you have a greater number of buttons, it may make more sense to group the buttons statuses in a list and save that instead of the individual buttons states.

Answered By - user