2D Framework Integration (Really cool stuff!)

User Code & Projects tonegodgui
1

I’m finally starting to fully integrate the 2D framework into the GUI library… and… what the hell does that mean?

Well… how about a breakdown of what the 2D framework does first? This should make it a bit more apparent as to what you can do with it.

The framework is a port (of sorts) of LibGDX’s functionality in a JME friendly way. It allows you to:

Create AnimElements - AnimElements are a collection of quads (much like a particle emitter’s particle mesh) that you can manipulate on a per quad basis or as a whole.

You manipulate these Transformables by running TemporalActions (moving, scaling, rotating, altering texCoords over time) against them, or directly calling one of the Transformable methods for altering transforms.

You can set the parent linkage of the quads of an AnimElement to have a cascading effect. When altering one, it’s transform effects that of it’s children as well.

On the screen level, you can:

Create different AnimLayers to group like AnimElements in a particular ZOrder range

Use tonegodGUI Listeners to automatically add mouse/touch events to AnimElements and individual QuadData (this includes Mouse Left Down, Mouse Left Up, Mouse Right Down, Mouse Right Up, Mouse Wheel Down, Mouse Wheel Up, Mouse Focus, Mouse Lost Focus and all Android (hopefully iOS as well) touch events.

The card deck in the video is a single mesh:
[video]http://youtu.be/vkHdYz9VgLg[/video]

Limit ZOrder effect to AnimElement, QuadData, Both or None per AnimElement

Limit Mouse/Touch Movement to AnimElement or QuadData per AnimElement

Pretty much all interaction you need to build a game like Plants vs Zombies (good example of the types of animations you can produce with AnimElement), or Card Game, or, or, or… etc, etc in short order.

[video]http://www.youtube.com/watch?v=CENQKclzH7c[/video]

Here are some other things I have done while testing this, just to help better show off what you can do with it:

Level scoring for most mobile games: (makes use of the AnimManager for sequencing TemporalActions over a timeline)
[video]http://youtu.be/K1HOMK1wSaM[/video]

Image shaped 2D particle emission:
[video]http://youtu.be/pYCBP1dFGNE[/video]

Animated Bitmap Text
[video]http://youtu.be/t7MViMRzx34[/video]

Arcade-style games:
[video]http://youtu.be/jExqdsNl_0c[/video]

I’ll be adding some basics for how to use the 2D framework to this thread until I am able to finally start cleaning up/updating and expanding on the Wiki. Prior to the Screen level support, the framework was semi-limited in it’s application as you would have had to write all of the input handling yourself. So… I’m pretty excited about this addition!

On a related side note:
The technique I am using for reordering the mesh quads is a viable solution for particle emitter meshes as well. What the hell does THIS mean?? It means that, I’ll be able to update my particle emitter to properly sort the particles based on world position so using materials like Lighting.j3md, etc become a completely viable option without the need for AlphaAdditive blending to hide the fact the particles are not rendered in the correct depth order.

9 Likes
2

Eh… just a last note about this. I won’t be pushing this update til tomorrow or the next day. Once I do, the basic tutorial will appear here.

Cheers

3

Pretty sick. You need to get yo’self some mobile testers! (for iOS as well)

1 Like
4

Oh and by the way, I hope that doesn’t mean you’re gonna make your 2D framework rely on tonegodGUI to work. Mobile developers need to make a lot of tough choices to keep their code lean, so dependencies must be kept to a minimum.

Also, have you looked into 2D physics engines? The most popular ones:
https://code.google.com/p/jbox2d/
https://code.google.com/p/dyn4j/

5
@erlend_sh said: Oh and by the way, I hope that doesn't mean you're gonna make your 2D framework rely on tonegodGUI to work. Mobile developers need to make a lot of tough choices to keep their code lean, so dependencies must be kept to a minimum.

Also, have you looked into 2D physics engines? The most popular ones:
https://code.google.com/p/jbox2d/
https://code.google.com/p/dyn4j/

The 2D framework has always been part of tonegodGUI, just had no support from the Screen level (i.e. worked as a standalone that you had to write your own input handling for… this is still the case if you want to use it that way, however you lose the AnimManager which allows you to sequence actions over a timeline). tonegodGUI is a relatively small jar and works well on Android… actually… it works better than the 2D framework in the sense that the methods used to produce animations can be taxing on mobile device and it is a real balancing act ensuring that you don’t have to much going on at any given time.

The AnimElement’s underpinning mesh is careful to only update buffers that need to be and only do so when the buffer in question is flagged as needing an update… but if you are running 6 TemporalActions against each QuadData in each AnimElement at all times with a particle emitter following each AnimElement, you’ll likely bring the mobile device to it’s knees.

2D physics… you bet! One of the videos above is done with dyn4j. I’ll likely add support classes for this library in particular that mimic JME’s bullet support just to make it easier for people to integrate.

1 Like
6

Just thought of one other thing that the library handles for you, which is quite a pita. Z ordering for picking and rendering work quite differently when each object is part of a single mesh. This is all handled as part of the library, though would require you to implement it yourself otherwise. If your game does not require touch interaction, then you’re gtg with just using the 2D framework by its self, othewise, you’ll likely want to use it integrated.

7

Explanation of handling Z-Order for someone who wants to use this as a standalone (worth noting here, as it gets a bit confusing): Do note that quad level z-ordering is handled even if the framework is used as a standalone… but for explination purposes, I’ll expand n both:

Render order is handled in the order things are added (i.e. first added is first rendered)
Picking expects a proper z-order… sooo. how do you handle this?

Layers = back to front z-ordering
AnimElements = front to back z-order handling
QuadData = back to front z-order handling

Z position is not relative in this case. The z-order is exactly what you set it to (note, this means a change to AnimElement must be reflected in it’s child quads), so without handling this properly, QuadData from one AnimElement will render intermixed with another AnimElements QuadData. If z-ordering is not set properly, the rendered display will look correct, however picking will return collisions in the wrong (correct, actually) order.

When calling a method like bringAnimElementToFront, sendAnimElementToBack, bringQuadToFront or sendQuadToBack, there is a bit of a juggling act to ensure that this happens properly and also keep the z bounds from expending each time you reorder something. If not handled properly, eventually they will be outside of the 0.0-1.0 range (actually this needs to be an even smaller range to ensure you do not encroach on other UI components outside of the frameworks realm) and picking will just not work anymore.

If anyone is ever in need of a complete breakdown for how to handle this because they want to split out the framework, just give me a shout and I’ll walk you through it completely.

4 Likes
8

I really like this integration! will it lead to something like this : http://unity3d.com/pages/2d-power?gclid=CM-_8-_2m70CFYjLtAod5ykAEQ ? that would be definitely awesome!

9
@relucri said: I really like this integration! will it lead to something like this : http://unity3d.com/pages/2d-power?gclid=CM-_8-_2m70CFYjLtAod5ykAEQ ? that would be definitely awesome!
Actually I was hoping to do just that for gsoc. I´m still getting used to the tonegodGUI though. So far I´ve created a mockup with labels and menus........so along way to go yet.
10
@M0rky said: Actually I was hoping to do just that for gsoc. I´m still getting used to the tonegodGUI though. So far I´ve created a mockup with labels and menus........so along way to go yet.

If you are needing some help getting used to things, let me know. The docs are out of date still and the 2D framework documentation is non-existent atm.

11
@M0rky said: Actually I was hoping to do just that for gsoc. I´m still getting used to the tonegodGUI though. So far I´ve created a mockup with labels and menus........so along way to go yet.

Oh cool! good luck for GSOC then!!! :google:

12
If you are needing some help getting used to things, let me know. The docs are out of date still and the 2D framework documentation is non-existent atm.
It´s been smooth sailing so far. I´ve been following the test app which gives a good guide on how it works though I can´t get it to compile.
Oh cool! good luck for GSOC then!!!! :google:
Thank you!