Making an infinitely long scroll list in Touchgfx

[Krautermann]

I would like to display the received SPI data on a scroll list container from TouchGFX. But the thing is, data are coming in at high rate, around 10,000 times in a second and each of these data need to be display on reach row of the table.

Is there a way to make an infinitely long table in Touchgfx? And also how do I make the table scrolls down automatically as data are coming?

[Mohammad MORADI ESFAHANIASL]

Hello @Krautermann 

Unfortunately, TouchGFX Designer doesn't have a list or a table for infinite amount of data. However, you can try to add items manually (in code) to a Scrollable Container. Or use a ScrollWheel Container with limited amount of data but you can update them to show the new values, and you can move the newest data to the end of list by using Selected Item Offset.

You can find more information about Scrollable Container or ScrollWheel here:

Scrollable Container: https://support.touchgfx.com/docs/development/ui-development/ui-components/containers/scrollable-container

ScrollWheel Container: https://support.touchgfx.com/docs/development/ui-development/ui-components/containers/scroll-wheel

Hope this helps you

[Krautermann]

Hi @Mohammad MORADI ESFAHANIASL 

I tried what you said with ScrollWheel Container but every time I use the Selected Item Offset function is called in my code, the screen freezes...Why is that?

I want to display the new value at the top of the table and shift the rest of the data downwards.

void Screen2View::scrollWheel1UpdateItem(CustomContainer1& item, int16_t itemIndex)
{
	item.setListWheel(itemIndex);
	MoveData();

}

void Screen2View::MoveData(void)
{
	scrollWheel1.setSelectedItemOffset(1);
}

void CustomContainer1::setListWheel(int item)
{
	switch(item)
	{
	case 0:
		RX_BufferArea.setWideTextAction(touchgfx::WIDE_TEXT_WORDWRAP);
		Unicode::strncpy(RX_BufferAreaBuffer, (char*)RX_Buffer_cpy, RX_BUFFERAREA_SIZE);
		RX_BufferArea.invalidate();
		break;
	default:
		break;
	}
}

[Mohammad MORADI ESFAHANIASL · Accepted solution]

The reason for that is probably because TouchGFX cannot draw all the elements. To fix it try to make your scrollWheel large enough that you can see as many elements as you have specified in the properties section. It doesn't matter if some parts of the ScrollWheel go beyond the screen, the important thing is to have enough elements available.

I apologize for misguiding you with the "Selected Item Offset". What I meant was to set it through the Designer, so the selected Item of the list is in the position you like. You don't need to change it every time in the code. Instead you can put the new information in one of the elements and set it as the selected item of the scrollwhell by using function "animateToItem". Then it would be placed at the position you specified with "Selected Item Offset"

I made a simple function to showcase what I mean:

void Screen1View::addNewInfoToScrollWheel()
{
    int indexOfitemAtTopOfTheList = scrollWheel.getSelectedItem();
    scrollWheel.animateToItem(indexOfitemAtTopOfTheList - 1);


    indexOfitemAtTopOfTheList = scrollWheel.getSelectedItem();
    scrollWheelListItems[indexOfitemAtTopOfTheList].updateInfo(newReceivedInformation);
}

[Krautermann]

Hi @Mohammad MORADI ESFAHANIASL 

Thank you for your reply. I am still trying to implement your suggested solution, but I am encountering errors. What is this "updateInfo" function? I cannot find such function in the documentation?

Did you mean scrollwheel1UpdateItem? Also what should be the input inside "newReceivedInformation"?