Migrating from 7.5 to 8.1 - Table Cell Colours

Description

I have a table. In 7.5 you could colour the cells. I would like to do the same in 8.1

What MCU/Processor/Board and compiler are you using?

Simulator

What LVGL version are you using?

8.1

What do you want to achieve?

I would like to colour the text values of the cells

What have you tried so far?

Reviewing the docs

Code to reproduce

In 7.5 I did have:

    printf("Set Colours\n");
    lv_color_t lvcolourACE = LV_COLOR_MAKE(0xF7,0x34,0x34);
    lv_obj_set_style_text_color(sensorTable, lvcolourACE, LV_TABLE_PART_CELL2);
    lv_obj_set_style_text_color(sensorTable, lv_palette_main(LV_PALETTE_LIME), LV_TABLE_PART_CELL3);
    lv_obj_set_style_text_color(sensorTable, lv_palette_main(LV_PALETTE_CYAN), LV_TABLE_PART_CELL4);

    if(strcmp("green", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_PART_CELL3;
    }
    if(strcmp("red", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_PART_CELL2;
    }
    if(strcmp("blue", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_PART_CELL4;
    }

    lv_table_set_cell_type(sensorTable, arraypos, 1, outCol);

Screenshot and/or video

N/A

In v8 it’s a little bit more complicated but much more versatile.

See this example: Table (lv_table) — LVGL documentation

That looks like it will work when initially rendering the table.
How can i set the colour on the fly IE cell by cell?

This is what I used to have:
image

Thanks!

You add custom control flags like here to indicate whether the text should be red or green.

Or in the event based on the current column and row, you can see its value and the text_color accordingly.

Ah, thats going to be painful.
I’ll have to think how I can do that given I want to colour it based on the temp (thats now a string with the degree symbol)…

LV_TABLE_CELL_CTRL_CUSTOM_1/2/3/4 can be used similarly to the STYLE_1/2/3/4 in lvgl v7.

Sorry, I’m not sure I understand

This is what I had:

    if(strcmp("green", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_PART_CELL3;
    }
    if(strcmp("red", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_PART_CELL2;
    }
    if(strcmp("blue", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_PART_CELL4;
    }

lv_table_set_cell_type(sensorTable, arraypos, 1, outCol);

I’m not sure how that fits. Can you expand?

Thanks!
Alex

In the event:


        if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_1)) {
            dsc->label_dsc->color = lv_color_hex(0xff0000);
        }
        else if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_2)) {
            dsc->label_dsc->color = lv_color_hex(0x00ff00);
        }

On the table:

    lv_table_add_cell_ctrl(table, 1, 0, LV_TABLE_CELL_CTRL_CUSTOM_1);
    lv_table_add_cell_ctrl(table, 1, 1, LV_TABLE_CELL_CTRL_CUSTOM_2);

Result
image

Sorry, I must be doing something stupid.

I have:

    lv_obj_add_event_cb(sensorTable, draw_part_event_cb, LV_EVENT_DRAW_PART_BEGIN, NULL);
    lv_obj_add_event_cb(sensorTable, change_event_cb, LV_EVENT_VALUE_CHANGED, NULL);

static void change_event_cb(lv_event_t * e)
{
    lv_obj_t * obj = lv_event_get_target(e);
    lv_obj_draw_part_dsc_t * dsc = lv_event_get_draw_part_dsc(e);
    uint16_t col;
    uint16_t row;
    lv_table_get_selected_cell(obj, &row, &col);
    if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_1)) {
        dsc->label_dsc->color = lv_color_hex(0x00ff00);
    }
    else if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_2)) {
        dsc->label_dsc->color = lv_color_hex(0xff0000);
    }
    else if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_3)) {
        dsc->label_dsc->color = lv_color_hex(0xff0000);
    }
}
    int outCol = 0;

    if(strcmp("green", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_CELL_CTRL_CUSTOM_1;
    }
    if(strcmp("red", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_CELL_CTRL_CUSTOM_2;
    }
    if(strcmp("blue", json_object_get_string(colour_struct)) == 0)
    {
    	outCol = LV_TABLE_CELL_CTRL_CUSTOM_3;
    }
	lv_table_add_cell_ctrl(sensorTable, arraypos, 1, outCol);

what am i doing wrong?

Thanks
Alex

Ive out some extra prints in and I dont think the callback is being called:

    lv_obj_add_event_cb(sensorTable, change_event_cb, LV_EVENT_VALUE_CHANGED, NULL);

static void change_event_cb(lv_event_t * e)
{
    printf("Change event callback called\n");
    lv_obj_t * obj = lv_event_get_target(e);
    lv_obj_draw_part_dsc_t * dsc = lv_event_get_draw_part_dsc(e);
    uint16_t col;
    uint16_t row;
    lv_table_get_selected_cell(obj, &row, &col);
    if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_1)) {
        printf("Set colour 1\n");
        dsc->label_dsc->color = lv_color_hex(0x00ff00);
    }
    else if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_2)) {
        printf("Set colour 2\n");
        dsc->label_dsc->color = lv_color_hex(0xff0000);
    }
    else if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_3)) {
        printf("Set colour 3\n");
        dsc->label_dsc->color = lv_color_hex(0xff0000);
    }
}

Ok, starting to make some progress.

The callback doesnt get called when the cell is updated by:
lv_table_set_cell_value(sensorTable, arraypos, 1, buffer);
via
lv_obj_add_event_cb(sensorTable, change_event_cb, LV_EVENT_VALUE_CHANGED, NULL);

It does get called when a cell is clicked.

However, when a cell is clicked it fails with:


Any input would be appreciated.

Thanks!

@kisvegabor any ideas?

Thanks!

I figured it out. I was using dsc in the wrong place.

Working c:

    lv_obj_add_event_cb(sensorTable, draw_part_event_cb, LV_EVENT_DRAW_PART_BEGIN, NULL);
static void draw_part_event_cb(lv_event_t * e)
{
    lv_obj_t * obj = lv_event_get_target(e);
    lv_obj_draw_part_dsc_t * dsc = lv_event_get_param(e);
    /*If the cells are drawn...*/
    if(dsc->part == LV_PART_ITEMS) {
        uint32_t row = dsc->id /  lv_table_get_col_cnt(obj);
        uint32_t col = dsc->id - row * lv_table_get_col_cnt(obj);

        /*In the first column align the texts to the right*/
        if(col == 1 || col == 2) {
            dsc->label_dsc->align = LV_TEXT_ALIGN_RIGHT;
        }
        if(col == 3) {
            dsc->label_dsc->align = LV_TEXT_ALIGN_CENTER;
        }

        if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_1)) {
            //Green
            printf("Set colour 1\n");
            dsc->label_dsc->color = lv_palette_main(LV_PALETTE_LIME);
        }
        else if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_2)) {
            //Red
            printf("Set colour 2\n");
            dsc->label_dsc->color = lv_palette_main(LV_PALETTE_RED);
        }
        else if(lv_table_has_cell_ctrl(obj, row, col, LV_TABLE_CELL_CTRL_CUSTOM_3)) {
            //Blue
            printf("Set colour 3\n");
            dsc->label_dsc->color = lv_palette_main(LV_PALETTE_CYAN);
        }
        
    }
    
}
int outCol = 0;

if(strcmp("green", json_object_get_string(colour_struct)) == 0)
{
	outCol = LV_TABLE_CELL_CTRL_CUSTOM_1;
}
if(strcmp("red", json_object_get_string(colour_struct)) == 0)
{
	outCol = LV_TABLE_CELL_CTRL_CUSTOM_2;
}
if(strcmp("blue", json_object_get_string(colour_struct)) == 0)
{
	outCol = LV_TABLE_CELL_CTRL_CUSTOM_3;
}

lv_table_add_cell_ctrl(sensorTable, arraypos, 1, outCol);

lv_table_set_cell_value(sensorTable, arraypos, 1, buffer);