Updating text list

[BjornLindholm]

Hello,

I want to create a updating list for my project that adds new text to an area on the screen(preferably scrollable as there can be many texts). I have read around a lot but I cant seem to figure out how to add new text areas with wildcards to a container. I also want to be able to change the different texts and remove them during runtime. What is the best way to solve this problem?

Please see attached image for a very rudimentary chart off how I want the UI to look.

Regards,

Björn

[Mohammad MORADI ESFAHANIASL · Accepted solution]

Hello @BjornLindholm ,

I have previously made a simple project similar to what you are looking for, and I will share it here so you can draw inspiration from it. 
The difference is that the new items are added to the bottom of the list, however, the list automatically scrolls down to show the new item. 
Keep in mind that you need to place your texts in a custom container to be able to add them dynamically to your scrollable container, and be aware of the memory management due to using new() function in C++.

Good luck,

[BjornLindholm]

Hello @Mohammad MORADI ESFAHANIASL ,

I have trouble opening the project i get an error (see attached image). Any tips on how to get it working?

 

[Mohammad MORADI ESFAHANIASL]

Is it possible for you to use or switch to TouchGFX 4.24.0? 

[ferro]

Hi @Mohammad MORADI ESFAHANIASL 

In you example, why do you insert new instance of an item for any new text ?

    ItemContainer* newItem = new ItemContainer();

I am confused. Is not the whole point of the scrollable container to hold only as many scroll item as to span the container's height (lets say 10 items) and then update 'only' texts in those items ? Or does ScrollableContainer work in a different way than ScrollList  ? Could not ScrollList be used instead ?

With your implementation (size of ItemContainer is ~ 200 bytes) the memory resources can be exhausted pretty quickly e.g. trying to display/scroll through large list of texts.

Regards,

[JTP1]

Hello Bjorn

I suggest you to try listLayout and ScrollList examples first

And also read the documentation of those

https://support.touchgfx.com/docs/development/ui-development/ui-components/containers/list-layout

https://support.touchgfx.com/docs/development/ui-development/ui-components/containers/scroll-list

I think based on these you will be able to build system you need.

Br JTP

[Mohammad MORADI ESFAHANIASL]

Hello @ferro ,

I'm sorry for my lack of explanation about the use case of this example. 
I made this example for a specific use case where we needed to show the newest data that has been received and keep the previous ones. Plus, it needed to show the newest data, that's why I do the scrolling to show that. And, the data doesn't necessarily need to be a text, it could be a custom container.

Otherwise, you are absolutely correct about this approach being horrible for memory and could have been done much simpler and cleaner. The issue with Scroll List would be handling the possible different types of elements (custom containers), and that's the main difference between Scrollable Container and Scroll List, plus the predefined size of the Scroll List.

I hope I have cleared the confusion.