Posts Tagged ‘example’

• By Rich

  Tags

  demo, example, flixel, game, nokia

  Posted in

  Flixel

  2 comments

  FlxSnake – A simple Snake game for Flixel 2.23+

  19th Mar 2010

  2

  I’ve been playing with Flixel a lot recently, and over on the forums someone was having trouble getting a “snake” game to work. I always applaud people who “start simple”, rather than diving in the deep end and sinking without trace.

  So I spent lunch time today knocking together a simple snake game in Flixel 2.23.

  There are no graphics (just blocks), but it shows how to use an FlxGroup to handle single to many collision checks, simple sprite controls and of course a basic snake game mechanic. The whole thing is just one single class file with no external requirements.

  It’s up on my GitHub account here: http://github.com/photonstorm/FlxSnake

  And if you want to join in, the forum thread is here: http://flixel.org/forums/index.php?topic=1261.0 (I’m a moderator on the Flixel forums, so drop by and say hi!)

• By Rich

  Tags

  amfphp, example, png

  Posted in

  Tutorials

  11 comments

  Save MovieClip as PNG Example

  25th Feb 2010

  11

  A couple of guys on Twitter asked me if I would write-up how I generate PNG files from MovieClips in my SWF, at run-time. So I put this example together and am sharing it here.

  We use this technique in our virtual world WebbliWorld to save a PNG version of the users avatars after they have customised them. But there are all kinds of other reasons you may need this. My example includes two methods: Saving the PNG locally using the local file system, and Saving the PNG to a web server using AMFPHP.

  This technique requires Flash Player 10 and the Adobe AS3 Core Lib.

  Here’s a very simple example (included in the zip download below):

  [swfobj src=”http://sandbox.photonstorm.com/saveAsPNG/SaveAsPNG.swf” width=”640″ height=”480″]

  Essentially it all boils down to this:

  1) When you are ready to save your image, create a Bitmap version of your MovieClip.

  [as]
  private function getMovieClipAsBitmap():Bitmap
  {
  var bounds:Rectangle = theMovieClip.getBounds(theMovieClip);

  //    The * 2 is because we’re scaling the clip up by a factor of two, to result in a larger PNG
  //    If you don’t need this, remove it and comment out the m.scale call below
  var theBitmap:Bitmap = new Bitmap(new BitmapData(bounds.width * 2, bounds.height * 2, true, 0x0));

  var m:Matrix = new Matrix(1, 0, 0, 1, -bounds.x, -bounds.y);

  //    Simply scale the matrix to make a bigger PNG. Here we are doubling it. Comment this out if you don’t need it.
  m.scale(2, 2);

  //    Need to crop the PNG to a given size? Pass it a Rectangle as the 5th parameter to draw()
  //var r:Rectangle = new Rectangle(0, 0, 50, 40);

  theBitmap.bitmapData.draw(theMovieClip, m, null, null, null, true);

  return theBitmap;
  }
  [/as]

  2) Convert this Bitmap to a ByteArray.

  [as]
  private function getMovieClipAsByteArrayPNG():ByteArray
  {
  var data:Bitmap = getMovieClipAsBitmap();

  var ba:ByteArray = PNGEncoder.encode(data.bitmapData);

  return ba;
  }
  [/as]

  3) Send this ByteArray to either the local filesystem, or AMFPHP.

  [as]
  //    Uses FileReference to save the PNG locally to the hard drive (see “saveToServer” for an alternative)
  private function saveLocalPNG(event:MouseEvent):void
  {
  var ba:ByteArray = getMovieClipAsByteArrayPNG();

  file.save(ba, “BirdyNamNam.png”);
  }
  [/as]

  Complete source code is included in the zip file including an AMFPHP PHP script for saving on a web server.

  Hope someone finds this useful.

  Download the Soure Code zip.