Create UI with FP, List of Objects


(fedyfausto) #1

Hello to all i just ask if anyone implement or create a List for some objects in the screen :smiley: for example list of Level o Objects for invenctory or ecc :frowning: i have no idea to start


(Zachary Lewis) #2

I believe the best way to do this is with a MVC paradigm.

Youā€™ll want a couple of classes: ListController and ListItemRenderer. The list will be composed of several ListItemRenderers which will be managed with the ListController.

If you have more questions, let me know and weā€™ll talk through it! Iā€™ve not created one of these in FlashPunk yet, so itā€™ll be good experience for both of us.


(fedyfausto) #3

and if we use the logic of camera? :slight_smile: for example we have an entity List with Viewport and a list of other Entities ok? Now when we create a list we give to the constructor the Height of List FOR VIEW and set it to viewport. Now i donā€™t know if we can create a Mask visible in a entity but if we use the viewport for Mask of View of list we can add and move the entities into the list (with Y cord) and view these ONLY into the viewport no? itā€™s a simple idea :3


(Zachary Lewis) #4

Now, do you want the list to be a part of the UI (like an RPGā€™s items menu), or do you want the list to exist ā€œin the worldā€? If you want it to sit on top of everything, you want to draw it to the same screen location every time.


(fedyfausto) #5

nono the list need to be an Entity :3 so i wanna that into the World class :stuck_out_tongue:


(Jacob Albano) #6

What about World.addList() and World.removeList() ?


(Zachary Lewis) #7

I think @fedyfausto is talking about an actual list of items, like a store list or skills list.


(fedyfausto) #8

yes zach :3 the only idea i think its the use of an Viewport for an object what contain the other objects listā€¦ and scroll them of Y cord if we press a button or otherā€¦


(JoshC) #9

Single entity and Graphiclist it up!


(Zachary Lewis) #10

Letā€™s entertain that idea for a moment. Keyboard selection is no problem, but how do we detect which item was clicked by the mouse? We would need a way to perform a hit test on each graphic. I suppose we could create a ListItemRenderer class that holds a Graphic and a Mask, then on adding children, we could add those to a Graphiclist and Masklist and run a hit check against the Entity's masks.

What do you think about that? Would individual Entitys be better than this solution?


(JoshC) #11

Ideally you could nest entities but I think this would be the simplest solution. The layout for your ListItemRender looks will determine the hit complexity, but most standard vertical or horizontal lists could just use a standard tile map picking approach to find the correct index when the parent is clicked \ hovered etc.


(JoshC) #12

Another thought for a large inventory (thinking grid-type thing) you may want to use a Canvas to reduce draw calls, and when you blit each icon you could store all the rects into an array for containsPoint collision, reduces the complexity of accounting for padding when calculating the correct position - at the cost of iterating a whole array every frame, but always optimize later. :smile:


(Wayne Makoto Sturdy) #13

I wouldnā€™t mind exploring this more. Should we continue this thread or start a new one more aptly named, like HUD?


(Zachary Lewis) #14

A new topic to discuss specific controls would be appropriate.

Iā€™d suggest you starting off with your high-level concept in the feedback category, and weā€™ll wax poetic there.