android: radio buttons inside radio buttons

Question

I am quite new to Android and this is my first application, so please correct if my question is not clear and I will gladly add more information about what I am trying to achieve. I have a radio group built dynamically. Inside this radio group I would like to have another radio group, depending on the radio button chosen from the first group. So, let's say I have an array list of items and for each item I have some sizes available (i.e: XS, S, L). If I check the radio button "XS", I would like to have another radio group with the available colors for the selected size, XS. The way I have built this is by creating a radio group and it's radio buttons dynamically. Inside the method onCheckedChanged(), I am calling the method createRadioButtonsForAvailableColors(). This one creates the radio buttons with the necessary colors for the checked size, but once I check another size in the upper radio group, the new colors available for this size are added to the colors shown for the size selected before. Thank you. Here is my on create method:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_show_product_details);

    sizesList = getSizes(getIDFromPreviousActivity());
    createRadioButtonsForAvailableSizes(sizesList);     
}

Here is my creation for the radio group containing the radio buttons with the available sizes:

// creates the radio buttons with the available sizes   
public void createRadioButtonsForAvailableSizes(ArrayList<String>  sizeList) {
    productDetailsLayout = (LinearLayout) findViewById(R.id.productDetailsLayout);
    RadioGroup rg = new RadioGroup(this);
    rg.setOrientation(RadioGroup.HORIZONTAL);


    int n = sizeList.size();
    final RadioButton[] rb = new RadioButton[n];
    for(int i=0; i< sizeList.size(); i++) {
        colorList = getColors(getIDFromPreviousActivity(),sizeList.get(i));

         rg.setOrientation(RadioGroup.HORIZONTAL);
         rb[i] = new RadioButton(this);
         rg.addView(rb[i]);
         rb[i].setText(sizesList.get(i).toString());
         rb[i].setId(getIDForRadioButton(sizesList.get(i).toString()));
         rb[i].setButtonDrawable(R.drawable.radiobuttonunchecked);
         rb[i].setOnCheckedChangeListener(this);

    }
    productDetailsLayout.addView(rg);
    productDetailsLayout.setPadding(50, 50, 50, 50);
}

Here is the creation of the colors (same as for the sizes):

// create radio buttons for available colors
public void createRadioButtonsForAvailableColors(ArrayList<String>  colorList) {

    Log.d("createRadioButtonsForAvailableColors","");
    productDetailsLayout = (LinearLayout) findViewById(R.id.productDetailsLayout);
    RadioGroup rg = new RadioGroup(this);
    rg.setOrientation(RadioGroup.HORIZONTAL);


    int n = colorList.size();
    final RadioButton[] rb = new RadioButton[n];
    for(int i=0; i< colorList.size(); i++) {
        Log.d("color"+i,colorList.get(i));
         rg.setOrientation(RadioGroup.HORIZONTAL);
         rb[i] = new RadioButton(this);
         rg.addView(rb[i]);
         rb[i].setText(colorList.get(i).toString());
         rb[i].setId(getIDForRadioButton(colorList.get(i).toString()));
         rb[i].setButtonDrawable(R.drawable.radiobuttonunchecked);

         rb[i].setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
                @Override public void onCheckedChanged(CompoundButton button, boolean isChecked) {
                    button.setButtonDrawable(isChecked ? R.drawable.radiobuttonchecked : R.drawable.radiobuttonunchecked);
                }
         });

    }
    productDetailsLayout.addView(rg);
    productDetailsLayout.setPadding(50, 50, 50, 50);
}

Here is my onCheckedChange method:

     @Override 
 public void onCheckedChanged(CompoundButton button, boolean isChecked) {
        button.setButtonDrawable(isChecked ? R.drawable.radiobuttonchecked : R.drawable.radiobuttonunchecked);
        String text = button.getText().toString();
        int productID = getIDFromPreviousActivity();
        ArrayList<String> colorList = getColors(productID, text);
        createRadioButtonsForAvailableColors(colorList);
    }

The inner group is created right, but upon checking one size in the first group, it builds the subgroup radio buttons normally. If I click one size, it shows the available colors. But, on changing the size checked, the buttons showing the colors of the now selected size are added to the buttons shown before for the previous size selected. How can I cancel the inner buttons created when I selected first time the size and show only the available colors for the currently selected size?

I think this is maybe not the right approach to build it. So, I have 2 questions:

1. Usually, what would be the best way to do this? Since my inner radio group depends on the radio button chosen from the first group, I assume the creation of the inner group should be called inside the onCheckedChange() method. Should I start another activity from here or can I do it all in one activity?
2. If my approach is correct, can you please tell me how to delete the inner radio buttons created, in case the radio button from the main group is changed?

Thank you

Answer 1

So, if I understood this, the problem comes when you change the value of the sizes radio button, meaning the colors don't disappear.

1. Well, Java is all about a lot of boilerplating, and there's not pretty much to say (I'd probably go for a similar way).

2. You could add this inside the createRadioButtonsForAvailableColors method, just before you start adding content:

productDetailsLayout.removeViews(0, productDetailsLayout.getChildCount());

RemoveViews will remove any amount of child views starting from a position (hence I amb passing it 0 and the total of children).