Last week the forum member juliofabio sent this gorgeous looking video to the forum showing a variable size list component. This looks really stunning and shows off how much you can do with LWUIT when you put your mind to it.
What I'm not exactly sure about is why did he choose to use a List?
Why not container and components like I used in my recent Tree demo?
Why List? Even if we think of our data as a list it might not always be appropriate for a list component.
Specifically in this case the set of elements within the "list" seem to be predefined and small hence there is no advantage to using a model. In fact I would assume that writing that code using a model and renderer paradigm would be very unintuitive. This set will never reach a very large size so the advantages of a huge million element list won't be realized either. It seems from the demo that even list animations were disabled, this is something that can be acheived using containers though.
Using Container.replace() can allow for most of the special effects within this list and can provide even more impressive effects (such as 3d). Building something like that can be trivial without getting into all of the complexities related to the list component, so why would someone want such a list?
Perhaps if you could provide us with an example doing something similar with containers that would be great? For me I chose a list because I have over 400 rows or so in my app. Every row is going to have an image of around 4 to 9 KB at least and so a List looks like an attractive component since it loads only the visible cells (does the same rule apply with containers and every thing else?). Moreover using a ListCellRenderer is much more easier than adding controls in a container and then keeping track of states etc.
ReplyDeleteIn my case, the images have varying sizes so I can't use the List control as is. I've been working on extending it to do something similar since last night but haven't gotten too far yet.
An example from you Shai would be ULTIMATE :) Would help A LOT of us out there looking to use a List.
I doubt I would have time to write a sample before JavaOne with all the work. However, my tree sample in the previous post is pretty close and most of the ideas from there can be adapted to this.
ReplyDeleteLists are great and for your particular use case they seem to be pretty good.
...about Shai's "Something like that can be trivial":
ReplyDeleteFor the LWUIT creators, development/creation of any thing with LWUIT(extensions and new components) will be more easy/trivial (they know already all pitfalls and tricks/tips).
For the others who has to learn the LWUIT components/concepts on the fly, create things (software functionalities using LWUIT and legacy LCDUI migration),will not be so easy or some times trivial.
Julio, trivial is a relative concept. LWUIT like any other platform has a learning curve and lore. However, unlike LCDUI the implementation is the same for all devices and the source is available for study with plenty of examples (and forum information).
ReplyDeleteFurthermore, since LWUIT is lightweight (makes its own drawing) everything can be customized in the way you would normally expect (e.g. overriding paint).
So I do stand by my usage of the word trivial and its far more trivial to use than it was for us to develop ;-)
Hi! I need variable sized lists also. I have a large number of list elements and some of them have to display more information than the rest so I need them to be a little taller.
ReplyDeleteI have a custom cell renderer. I tried changing the preferred size for the larger elements but the List sets this size for *all* elements. I looked at your Tree posting but I don't see how it relates to this problem. I don't need any code, just a pointer in the right direction... thanks!
César
hi shai,
ReplyDeletei want to use containers instead of list but the problem that the list component has a photo that will be loaded by network connection and i can't start about 50 thread at the same time to load 50 photo, so i want to load the photos for the visible containers only like the list do, how can i do that? or which method i have to override to do that?
thanks
Thanks shai for replying to me, i have another problem with the list.
ReplyDeletewhen i add another focusable component with the list in the same form i get problems with the scrolling, for example i have a form and added to it a TextField to act as a filter then i added a list to the form.
first problem: when i scroll the list to the last element and press down, the scroll is hanging and i can't move the focus.
second problem: i have added action to the list to go to another form, when i choose an item and go to the second form and then press back to the first form, the scroll of the list hangs and i can't move the focus again.
any suggestion?
We use lists with other components in the form quite frequently so it should work without a problem.
ReplyDeleteI'm guessing you have a textfield and its cursor grabs the focus. Also list when used with other components in the form isn't "editable" by default and you need to press fire to start using it.
the textfield is just an example, any other focusable component has the same problem (focusable container, button, another list, ...) even the tabs have the same problem because the tab component is focusable, so when i add a tab to the form and add the list to the tab i get the same problem, and it is very confusing to the user to press the fire key to be able to navigate through the list.
ReplyDeletei think it is a problem with the list because some times the scroll doesn't hang and most of the time the scroll hangs.
After an action was performed on the list (fire key) you need to indicate to LWUIT that you are still interested in focus remaining on the list. Just invoke list.setHandlesInput(true)
ReplyDeletemany thanks, it works perfectly.
ReplyDeletei know that i ask too much but i don't have another solutions.
what about the first problem : when i scroll the list to the last element and press down, the scroll is hanging and i can't move the focus label.
i have one solution is to override the keyPressed for the form and checks for the down button and if it in the last index then keep the focus on the list, this works for one list but i have tabs and each one has list so it is not good solution, any suggestions?
i appreciate your help,
thanks,
Putting list.setHandlesInput(true) in the list renderer solves the second problem.
ReplyDeleteThanks,
Hi Shai,
ReplyDeleteHow do we integrate containers within a List so the items are variable in height?
I have a
'myRenderer extends Container implements ListCellRenderer'
I can change the Container height quite easily. but all the listitems have the height of the last containerheight set.
I can make the height large enough for all containers, but that's just ugly. If I let them all have their own height,then their are white spaces between each container, which is even uglier.
A pointer in the right direction would be greatly appreciated.