how to update background customcontainer

[JPabl.1]

Hi Touchgfx team!

I've this screen requirement 

I'm doing it with a custom container list as in the listLayout example. Currently, once I press the audio element, I'm able to move the "on" text to the left, and add the image. Now, I want to update the background color. I'm trying this but it doesn't do anything:

void CustomListElement::set_audio_element(int new_x, int new_y){
    settings_text.setXY(new_x, new_y);
    background.setColor(touchgfx::Color::getColorFromRGB(255, 255, 255));
    invalidate();
}

this is a method in the custom container. The 255 is just for reference

This is my view where I call the function 

void settingsView::listElementClicked(CustomListElement &element)
{
    // The button of the list element has been pressed

    switch (element.item_index)
    {
    case DATE_TIME_INDEX:
        go_to_date_and_time_screen();
        break;
    case STORAGE_INDEX:
        go_to_storage_screen();
        break;
    case ABOUT_INDEX:
        go_to_about_screen();
        break;
    case AUDIO_INDEX:
        audio_toggle_button.setVisible(true);
        settings_list_elements[AUDIO_INDEX].set_audio_element(190, 12);
        settings_list.invalidate();
        audio_toggle_button.invalidate();
        break;
    default:
        break;
    }
}

Thanks a lot in advance

[Mohammad MORADI ESFAHANIASL · Accepted solution]

Hello @JPabl.1,

It is difficult to figure out the problem since we don't know how your custom container is created and what the rest of your project is; however, one simple point that I can make is that is there any specific reason for not using the pressed element instead of finding the element by its index? I am asking this since you already have access to that element by the function's argument. I mean using something like:

void settingsView::listElementClicked(CustomListElement &element)
{
    // The button of the list element has been pressed

    switch (element.item_index)
    {
       ...
    case AUDIO_INDEX:
        audio_toggle_button.setVisible(true);
        element.set_audio_element(190, 12);
        audio_toggle_button.invalidate();
        break;
    default:
        break;
    }
}

 In addition, you don't need to invalidate the whole list if only one item/element has changed. You can simply invalidate your background when you changed the color. 

Keep in mind that using invalidate() on its own means invalidating the whole screen, and you only need to invalidate the background; therefore, the code should be like:

void CustomListElement::set_audio_element(int new_x, int new_y){
    settings_text.setXY(new_x, new_y);
    background.setColor(touchgfx::Color::getColorFromRGB(255, 255, 255));
    background.invalidate();
}

Let me know if this helps solve your issue.

[JPabl.1]

Thanks for the elemen tip!

The problem was that the button was on top of the background in the custom container, so I was updating the background but we couldn't see it