Grinning Lizard Awesomeness

Coming into c++ from a web-centric world such as the Flash one, the range of Open Source projects has been sometimes a bit bewildering. What I mean by this is, the Flash ecosystem is quite tightly focused, yes theres a diverse range of applications, but really we are all doing the same thing, visually appealing animated stuff. Me for games mainly, you for websites (for example). C and C++ are used in far wider range of applications, from Operating Systems, Door Bells (!), to humble (and not so humble) games.

The Open source projects reflects well this diversity, and while excellent many packages are quite large and cover many different use cases.

A couple of really tight game focused packages come from wonderful Lee Thomason over at Grinning Lizard. Ive been using both of these in the game im currently working on in my spare time. Lee works on the Flash Player codebase for Adobe, so it would be probably be fair to say he has ‘mad skillz’ in c++ :)

TinyXML – is a really simple XML parser. Compared to many projects out there its really simple to get working. Probably lacks many deep features you would need for roling out an international banking transaction system, but for loading and parsing my simple game level configs its perfect. Apparently TinyXML2, which i havnt looked at yet, is even more stripped back and leightweight.

Micropather – Is a A* path finding implementation. Again was really simple to get working in my game. And (so far) works perfectly for my simple needs.

Cheers Lee! Id like to of said thanks in person, but you dont have any working email addresses on your site. If i find one, Ill send you a copy of my game as soon as its ready :)

Using Transparent JQueryMobile on top of OpenGLES

Using Marmalade 6.0, we now have the ability to serve HTML directly from the device.  This raises the serious possibility of using HTML for non performance critical parts of game, such as menus.

Out of the box, JQuery mobile, is pretty damn cool but needs a couple of modifications to run as a transparent layer on top of your GL content.

1 – Modify CSS.  JQuery by default fills the view-port with CSS gradient, this prevents us using the layer as a transparent overlay.  Grab a modified CSS file here, with the gradients removed.  NB you may want to minimise this file again later:

https://gist.github.com/2843567

2 – Add Meta data to HTML to disable ZOOM on IOS

<meta content="initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>

3 – Disable Zoom in the Marmalade ICF file for Android

[S3E]
AndroidWebViewZoomControlsEnable=0

And thats it.  Just create a new web view in Marmalade and Navigate yo your content.  It will appear transparently over your Game :)

  panel = s3eWebViewCreate(true);

  const int width  = IwGxGetScreenWidth();

  const int height = IwGxGetScreenHeight();

  const int y = 0;

  s3eWebViewShow(panel, 0, y, width, height);

  s3eWebViewNavigate(panel,  "http://freesome.com/");

Towards automatic mobile asset creation via Marmalade SDK and Flash

We don’t use Adobe Air to produce game son mobile devices, we use the excellent Marmalade SDK.  However I work with a lot of Flash creative, so integrating Flash content into my mobile workflow has been on my mind a lot recently.  Ive got two main use cases:

1)  Flash as an illustration and animation tool

2) Flash as a UI layer

Tackling them in reverse order;

2) UI Layer – for this ive begun work on porting GameSwf library to Marmalade.  As you probably know Gameswf is the public domain c++ swf  library which spawned Scaleform on consoles and Gnash on linux.  Ive currenttly got it compiling and rendering SWF contents directly in Marmalade (and thus on iOS , android, playbook etc) .  Really I need to add a layer above it now to do truly useful work with it.

1) Flash as an animation tool.  The idea is to use Flashes (quite good) animation tools to create vector based animation.  Next we need to convert the animation frames to sprite sheets (Atlas Textures).  This is fairly trivial a good online tool exists form PixelVison.  However with Marmalade there’s a few more steps to make this truly automatic.

1) Generate PNG and XML description

2) Generate Marmalade Group files

3) Generate Container ALL Group

4) Generate compressed textures based on PNG’s in multiple formats for different GPU architectures

5) Generate Maramalde derbh scripts to package up the binary data as compressed file systems

The next few posts will take a look at this process and see how close we can get to a truly automated work-flow.