BitmapTileGrid Demo:
Hey Guys and Gal,
I know its been awhile since I’ve posted anything. There has been a lot going on. I put together a little video that is jam-packed with a little news, recent projects, fun stuff and of course your Christmas present. Get inspired and get ready to make the most of 2012.
Video: Full Scoop on Snorkl.tv, BitmapTileGrid, and Some Amazing Resources
Having trouble? Watch the video on youtube
TimelineLite Ultimate Starter Guide on ActiveTuts+
The TimelineLite Ultimate Starter Guide is the main thing that has kept me busy and away from this site for the past month and a half. I know my Facebook and Twitter followers have been keeping up with the releases. Thank you. If you are new around here, the TimelineLite Ultimate Starter Guide is a 3-hour, 6-part series that dives deep into all the functionality and potential of GreenSock’s TimelineLite. If you do any script-based tweening with ActionScript 2 or 3, you really must check out the series. It will change the way you approach nearly every project.
This project was my first endeavor with ActiveTuts+. I really can’t begin to tell you how worthwhile and enjoyable it has been to work with them and have my work featured on a site with such a prestigious reputation. It really was quite a challenge trying to get a new 30 minute video out the door every week. With snorkl.tv and being the boss and all, I can pretty much slap together whatever I want and see what happens (as you may have noticed).
This was the first time I’ve created material that really had to be “approved” and would also surely be presented to such a massive audience. Fortunately for me, I had Michael James Williams as my editor and he did everything possible to give me support throughout the process and take my sort-of-rough material and really make it shine. Not only is Michael a great editor, but he is a top-tier developer and educator.
I give my absolute strongest recommendation possible for Michael’s AS3 Avoider Game Tutorial. It is easily the best “learn as you build” tutorial I have ever come across for learning object oriented programming. The pacing is excellent and he explains things in a way that just makes sense. My favorite aspect of his presentation is that he will often have you do things one way, show you some of the flaws, and then explain how to do it in a more flexible / efficient manner. It really makes the learning experience effective.
From a personal standpoint, that tutorial really gave me a strong push to attempt to build the BitmapTileGrid and Puzzle classes.
BitmapTileGrid
As you have seen in the video and demo at the top of this page, BitmapTileGrid makes it real easy to convert an image into a series of tiles that can easily be animated. This post isn’t meant to be a full-on tutorial for how it was built, just an introduction to this concept while still in a beta stage. I’m really happy with what it does right now and would love for you to download the source and demo files. Take it for a spin, let me know what you think.
Being my first AS3 custom class, I’m sure there is room for improvement. If anyone wants to suggest features or architectural changes, please don’t hesitate to post in the comments.
Keep in mind that the only role of the BitmapTileGrid right now is to provide a grid of bitmap tiles. All the animating is in your control.
A few things I’m wondering about:
Should the BitmapTileGrid automatically inherit the x/y coordinates of the source image? Or should the developer just set that themselves? I know how to do it, just don’t know if it should be a default behavior.
I know that a class like this should have some way of being removed / destroyed. What would be the best way to get the tile grid ready for garbage collection?
Basic BitmapTileGrid Usage Video #2
Having trouble? Watch the video on youtube
This video just gives you a look at an alternate approach to animating the tiles. In the first video I used TweenMax’s allfrom() method to set the same starting values on every tween on every object in the tilesArray array. By using a for loop you can get more creative and give each tween its own starting or end values that can be randomized or altered based on the current value of the loop iteration. If you watch both videos and look through all the source files you should be in good shape to get started using BitmapTileGrid.
I imagine I will do a more thorough tutorial-style post on this class once it gets finalized.
PuzzleBuilderPro
*the puzzle will re-shuffle 3 seconds after completion.
If that puzzle is too easy, this one will drive you mad.
PuzzleBuilderPro has been on my to-do list for at least 3 years. It feels so good to have made such progress in such a short amount of time. The code is literally 50% more compact, much easier to read and a zillion times more efficient. I’m really looking forward to blowing this one out.
next steps
- Build a custom event system so that the puzzle builder can send notifications about the current state of the app.
- Build in some clean-up routines to dispose of the Puzzle and all its PuzzleTiles.
- Add customization options for active tile border color, collision color, and animated shuffle styles
All the Good Stuff
The original puzzle gallery in all its glory.
Your Christmas present: The source and demo files for the BitmapTileGrid: snorkl_bitmapGrid_demos – CS4 Fla with document and custom classes.
Michael James Williams’ awesome AS3 Avoider Game Tutorial
The best available AS3/OOP reference: AS3 101 Session on ActiveTuts+ by Dru Kepple. Seriously, you need to have that bookmarked.
While I’m at it, Doug Winnie’s AS3 1 on 1 series on Adobe TV is also a huge favorite of mine.
So folks, enjoy your Christmas, New Year and holiday season. I look forward to all that 2012 holds and I wish you bountiful success.
-Carl
ps. good luck winning this month’s Really Green Club GreenSock Membership. Hurry up and submit the solution!
