Book Review: ActionScript Developer’s Guide to Robotlegs

So quite some time after I got this book on my hands I’ve finally taken the time to sit down and read it and let me open this post saying that I really enjoyed it. ActionScript Developer’s Guide to Robotlegs will guide You through the inner workings of the Robotlegs framework in a very straightforward and concise way, the authors Lindsey Fallow (Stray) and Joel Hooks (who also are part of the Robotlegs core team) do so by taking real-life applications and break them apart showing You how Robotlegs gets things done in the process, each chapter is full of tips equally appealing to Robotlegs newcomers and seasoned users of the framework. The book is written in such a way that has a very “Head First Series” nice feel to it taking You from the basics to more advanced features, troubleshooting, tips, good practices and power-ups in a very clear way.

What I liked the most about this book is the fact that Is really well explained, from the table of contents to the appendixes is a step by step companion as You dive deeper in the core concepts of Robotlegs such as Context, Commands, MediatorMaps and DI ( Be sure to check the Appendix B dedicated entirely on how Robotlegs handles dependency injection).

When You’re entirely new to a framework such as Robotlegs You might find yourself lost in nomenclatures and concepts previously unknown to you, well this book untangles it all for You and gently clears your way as you read along and event when you’ve used Robotlegs before is full of juicy tips and best practices that will surely help you have a better understanding on how you wire your applications using the framework.

You can get the book in digital or print format at O’Reilly in case you haven’t already done so, I definitely recommend it for anyone thinking on using the Robotlegs Framework or anyone who is already using it on a regular basis.

I like to thank Stray and Joel for taking the time to write this book and the Robotlegs team for the efforts on the framework (keep up the wonderful work guys).

Don’t forget to visit Robotlegs.org for the latest on the framework.

Happy Reading.

Greensock’s ThrowPropsPlugin iPad Test

Heres a quick video showing how You can use the Greensock’s ThrowPropsPlugin to emulate the bouncy effect of the iOS devices, on the example I used an image but it can also be used with TextFields or Lists and it performs equally good on the iPad.

ThrowPropsPlugin is a plugin for TweenLite and TweenMax that allows you to simply define an initial velocity for a property (or multiple properties) as well as optional maximum and/or minimum end values and then it will calculate the appropriate landing position and plot a smooth course based on the easing equation you define (Quad.easeOut by default, as set in TweenLite). This is perfect for flick-scrolling or animating things as though they are being thrown

For the code part I just used Jack’s sample with some minor tweaks to use an image instead of a TextField.
Here is the class:

package com.swfgeek.mobile.ThrowPropsPlugin {
	import flash.display.MovieClip;
	import flash.display.Shape;
	import flash.events.MouseEvent;
	import flash.events.Event;
	import flash.utils.getTimer;
	import com.greensock.TweenLite;
	import com.greensock.easing.Strong;
	import com.greensock.plugins.TweenPlugin;
	import com.greensock.plugins.ThrowPropsPlugin;
	import flash.geom.Rectangle;
	
	public class MainApp extends MovieClip {
		private var bounds : Rectangle;
		private var mc : MovieClip;
		private var t1:uint, t2:uint, y1:Number, y2:Number, x1:Number, x2:Number;
		
		public function MainApp() {
			TweenPlugin.activate([ThrowPropsPlugin]);
			initialize();
		}
		
		private function initialize():void {
			bounds = new Rectangle(-128, 0, 768+128, 1024);
			mc = getChildByName("robots_mc") as MovieClip;
			setUpTPBounds(mc, bounds);
			mc.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
		}

		
		private function mouseDownHandler(event:MouseEvent):void {
			TweenLite.killTweensOf(mc);
			x1 = x2 = mc.x;
			y1 = y2 = mc.y;
			t1 = t2 = getTimer();
			mc.startDrag();
			mc.addEventListener(Event.ENTER_FRAME, enterFrameHandler);
			mc.stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
		}

		private function enterFrameHandler(event:Event):void {
				x2 = x1;
				y2 = y1;
				t2 = t1;
				x1 = mc.x;
				y1 = mc.y;
				t1 = getTimer();
		}

		private function mouseUpHandler(event:MouseEvent):void {
			mc.stopDrag();
			mc.stage.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
			mc.removeEventListener(Event.ENTER_FRAME, enterFrameHandler);
			var time:Number = (getTimer() - t2) / 1000;
			var xVelocity:Number = (mc.x - x2) / time;
			var xOverlap:Number = Math.max(0, mc.width - bounds.width);
			var yVelocity:Number = (mc.y - y2) / time;
			var yOverlap:Number = Math.max(0, mc.height - bounds.height);
			ThrowPropsPlugin.to(mc, {throwProps:{
										 y:{velocity:yVelocity, max:bounds.top, min:bounds.top - yOverlap, resistance:300},
										 x:{velocity:xVelocity, max:bounds.left, min:bounds.left - xOverlap, resistance:300}
									 }, ease:Strong.easeOut
									}, 10, 0.3, 1);
		}

		private function setUpTPBounds(container : MovieClip, bounds : Rectangle):void {
			var crop:Shape = new Shape();
			crop.graphics.beginFill(0xFF0000, 1);
			crop.graphics.drawRect(bounds.x, bounds.y, bounds.width, bounds.height);
			crop.graphics.endFill();
			container.x = bounds.x;
			container.y = bounds.y;
			container.parent.addChild(crop);
			container.mask = crop;
		}


	}
	
}

To know more about this plugin visit Greensock’s ThrowPropsPlugin page and check out the ASDocs.

Note: ThrowPropsPlugin is a membership benefit of Club GreenSock (“Shockingly Green” and corporate levels). If you’re not a member yet,I suggest you sign up, believe Me is really worthy.

Happy Coding

Quicktip: Uninstall Your Android App from the AVD Emulator

This post is more of a self-remainder but hopefully it will help other mobile developers with the same issue, when working with the Android Emulator You might be in the situation that You’ll need to wipe Your app entirely and there’s no drag and drop in thrash when using the emulator, so in order to delete Your app without erasing Your AVD image just follow the next steps:

1.- Start Your Eclipse IDE (FDT or Flash Builder).

2.- Run the emulator.

3.- Using the terminal navigate to the Android SDK “platform-tools” directory, mine is located at:

/Users/dave/development/flash/SDKs/android-sdk-mac_x86_r12 /platform-tools

 

4.- Do the command “./adb shell” remember that commands must have the “./” before the command name otherwise You’ll get a bash error (-bash: adb: command not found).

5.- Navigate to the app directory using the cd command  ” cd /data/app/”.

6.- Then list the apps using the list command “ls” (This will display the names of the .APKs installed in Your emulator.

 

7.- Then use the remove command “rm YourApp.apk”

8.- You can now type “Exit” to leave the adb shell, relaunch the emulator and Your app will be gone for good.

Happy Coding.

Flash For Android Meeting | Slides and Recording

Here’s the slides of my preso Flash For Android for Hawaii Flash User Group, thanks everyone who attended and to John Barret for the invitation was my first preso in other language so that makes it special ;), if You didn’t make it to the meeting last night below is the link of the recording.

The recording of the session:
http://experts.adobeconnect.com/p305dn8lpzd/

Thanks again and happy coding.

*UPDATE* Flash for Android Talk for Hawaii Flash User Group

Upate: Unfortunately and due to some problems with the Adobe Connect Add-in on Mac OS Lion the presentation couldn’t be held last Saturday, I apology for the inconvenience and the meeting is being rescheduled to August 27, 2011 05:00 PM – 06:00 PM (GMT-10 Hawaii, Fakaofo).
This meeting will be on-line at:
http://experts.adobeconnect.com/hawaiiflash/

I will be speaking this August 27, 2011 05:00 PM – 06:00 PM (GMT-10 Hawaii, Fakaofo) about Flash for Android, In this session I will be showing the basic workflow in Flash CS5.5 to set up and get Your AIR app running on the Android emulator for testing and then pushing it to the Android Marketplace.

You can RSVP here.

The talk will be streamed on connect, Visit Hawaii Flash User Group in Adobe to get the connect details.

See You in an hour 😉

Flash Player 11 & AIR 3 Betas at Adobe Labs

Adobe in his secret plan of not letting Me catch up with the latests runtimes 😉 has just released new beta versions of Adobe Flash Player 11 and Adobe AIR 3 and are available at Adobe Labs.

Some of the new features are:

Adobe® Flash® Player 11 desktop beta drives innovation for rich, engaging digital experiences with new features for cross-platform browser-based viewing of expressive rich internet applications, content, and videos across devices. Some of the features from the Flash Player Incubator, such as Stage 3D and 64-bit support, have been moved into this beta release.

Key benefits of the Flash Player 11 desktop beta include:

Stage3D APIs — Create highly interactive visuals to improve collaboration on 3-dimensional models.
64-bit support — Support for 64-bit operating systems and browsers on Linux, Mac OS, and Windows.
G.711 audio compression for telephony — Integrate voice/telephony into business apps using G.711 codec.
H.264/AVC SW Encoding — Encode higher quality video locally using H.264 video.
Socket Progress Events — Build advanced file sharing apps like FTP clients that send large amounts of data.
HD surround sound — Deliver full HD videos with 7.1 channel surround sound directly to AIR powered TVs.

More info at Adobe Labs

Adobe® AIR® 3 introduces enhanced features that provide developers a consistent and flexible development environment for the delivery of out-of-browser applications across devices and platforms.

AIR 3 delivers innovation for rich engaging applications with unparalleled performance improvements that deliver advanced graphics rendering, high-definition video, and consistent reach across operating systems and devices. AIR 3 is packed with features that will benefit all developers but has a special focus for those interested in developing console quality games, delivering high quality video, or scalable enterprise applications.

Note: The AIR 3 desktop runtime beta is provided to ensure current AIR 2.7 and AIR apps targeting older version of AIR are compatible if You want to test the new SDK You must enrole in the private prerelease program.
More info at Adobe Labs

Seems like a lot of good stuff to play with.

Happy Coding.
Dave

Robotlegs Modular + Flash CS5 Project Template for FDT 4.5


Click the image to see working example.

So here it is the updated version of my Robotlegs Modular + Flash CS5 Project Template for FDT 4.5, what it does? it will let You create a Flash CS5+Robotlegs Modular project using Robotlegs version 1.4.0 and Joel Hooks version of Stray’s Utility Modular.

Project Settings

The project is set so You can enter your own package structure e.g. “com.yourdomain.project” it will crate a folder called modules with the all the classes needed it will also create a Flash .XFL with the Views( MovieClips) already mapped to Your classes.

I also gave the design a little make over 😉 see the example above.

So where do You get this template and how to use it:

1.- Download the Project Template form GitHub extra points if You make a fork.

2.- Install the project template in Your FDT folder:
On OSX the path is: (Your User Name) > Library > Application Support > FDT
For windows: C:\Users\{Username}\AppData\Roaming\FDT

3.- Create a project with this template in Your project settings will be on Web>Robotlegs Modular + Flash CS5

4.- Compile the Project and Enjoy 😉

What I’ve been up to.

After quite some time of not writing a post due to projects I like to share with You what I’ve been up to, begging this year I decided to leave Grupo W and start working on my own one of the things that influenced that move was the fact that even when working in W was awesome I was spending more and more time at the office and less and less time with my family so based upon that I decided to start working at my place to give more time to my kids and my personal projects, at first I was doubtful that I could pull it off (having 4 kids to feed makes anyone nervous about leaving a stable job) and last time I’d freelanced was a long time ago, but as soon as I started I found out that the lack of projects was the last thing that should worry Me things rolled out just fine and before I knew it I was enrolling in new contracts that had me working full time, the difference of doing it by my own is that I decided what projects to take and when to take them.

To make things shorter and less sentimental most of the projects I’ve been doing are for mobile platforms and even when I had previous experience in that field I’ve really enjoyed the process of learning new tools and development languages I reluctantly moved back to Mac OS after almost 4 years of working with PC but if You plan to do mobile development there’s one platform You don’t want to miss (at least my clients wouldn’t wanted to miss it) Yes I’m talking about Apple’s iOS I decided to go native and get to dusting my old Objective-C books and get a MacBook Pro, and to be sincere I kinda of liked it( I’m talking about the code, to talk about how I feel about Apple cornering You to give them their 30% of almost every app You build is a matter that will need a post of it’s own) but almost immediately Adobe started unveiling the path they where taking for mobile development in the Flash Platform and the sun shined again, it’s not that I hate iOS or xCode but the fact of stop working with the tools that I know and love was something I didn’t like at all. And Adobe sure didn’t let Me down using the newer AIR and Flex SDKs I was deploying a single code based project across multiple devices including iOs, Android and BB Playbook( that last one only on emulator “You should have submitted Your app for that contest Dave”) so event some client’s work was being done native I kept doing Flash based mobile development in all my other projects, one of those projects is a game I’m doing with Cecy Meade and let me say it runs like butter on iOS devices can wait to update it to AIR 2.7 SDK (which Adobe publicly released today) and push to Apple’s AppStore.

So that’s what I’ve been up to, oh yes and Piñatarama 2.0 😉 a project I secretly worked on with Cecy Meade and Vertigo Gallery’s Jorge Alderete and Clarisa Moura  this last few months that features the works of artists from all over the world reinterpreted by Mexican artisans in the form of Piñatas which had it’s opening last weekend in the Museum of Modern Arts of México City if You go to D.F. be sure to pay a visit the artists and artisans did a really amazing work.

So, thanks for reading I promise I’ll keep updating this blog more often.
See You on Twitter and Viva el Flash 😉

Adobe announces The Adobe Creative Suite 5.5 Product Family

Today Adobe has announced a very  significative update to the Creative Suite family of products, The Adobe Creative Suite 5.5 which is also the first time Adobe does a mid-cycle release, according to Adobe this releases will help developers and designers get up to speed on technology changes the milestone releases (such as CS3, CS4, CS5) are moved to a two-year cycle , I was part of the private prerelease beta for Flash Builder 4.5 and Flash Catalyst 5.5 and let me say it comes with a lot of new and cool features. This release has a lot of mobile targeted features “Android, iOS, Blackberry” which will facilitate You targeting various devices using the same codebase there’s also great new features in Flash CS5.5 and all the HTML5 cool stuff in Dreamweaver CS5.5 including the jQuery mobile framework integration for browser-based content. So here is a list of some of the new features and be sure to check out the introduction post and  AdobeFlash PlatformCS5 Twitter timelines.

Flash Builder 4.5

  • Android, BlackBerry and iOS development
  • Lots of new coding enhancement and productivity features
  • Improved workflow between Flash Builder and Flash Catalyst
  • Uses Eclipse version 3.6.1 “Helios”
  • Performance improvements
  • Supports code and design view of the same document
  • Introduces a new version of Flash Builder 4.5 aimed for PHP developers with Zend integration

 

Flash Catalyst 5.5

  • Resizable applications and components
  • Timeline and animation enhancements
  • Custom skinnable components
  • Improved interaction choices
  • Common library panel

 

Flash Professional 5.5

  • Workflow improvements for mobile development
  • Content scaling on stage resizing
  • Performance optimization with rasterization for symbols
  • Enhanced layer controls
  • Code snippet handling improvements and enhancements
  • Inverse kinematics pinning support
  • File auto-save and recovery
  • Incremental compilation with asset caching
  • Seamless mobile testing

Dreamweaver 5.5

  • Multiscreen preview panel
  • CSS3 and HTML5 support
  • JQuery Mobile integration
  • Native Android and iOS apps development and packaging
  • Adobe BrowserLab integration
  • FTPS, FTPeS support

 

 

Quickguide: Using AIR 2.6 in FDT 4

So finally I got some free time to write this post about using the new Adobe AIR 2.6 in your FDT 4 environment, so let’s get to it:

As you know Adobe recently released the Adobe 2.6 runtime and SDK with significant improvements including iOS support bringing feature parity for Android and iOS platforms, more info on Adobe AIR team’s blog.

Some of the new features are:

AIR for iOS

  • Updated AIR for iOS support with improved performance. Developers can take advantage of new features in iOS 4 like multitasking, Retina display for higher screen resolutions, and front and back camera support. Developers can now build application that capture audio with the microphone and take advantage of the same graphics hardware method used in AIR for Android using OpenGL ES2 for fast graphics.
  • Packager for iPhone (PFI) is now replaced with and the functionality integrated with AIR Developer Tool (ADT) a comand line tool for compiling application in the AIR SDK. ADT can now be used to package AIR files, native desktop installers, AIR applications for Android and iOS.

AIR for Android

  • Submit apps to be included in the Amazon Appstore for Android when the store launches.  Companies now have an additional distribution option with one of the largest online shopping destinations on the web.
  • USB debugging was added as an additional debugging option to WiFi.

So what do You need to start testing this new capabilities in AIR SDK 2.6, if You’re part of Adobe’s Flex SDK and Flash Builder private pre-release program You can start testing this right away. If You like to start working with the Adobe AIR 2.6 SDK inside of FDT4 the following guide should be a good start.

1.-Download the SDKs.

Download The Adobe AIR SDK 2.6 and Flex 4.1 latest stable release.

2.- Merge the SDKs

To start using the AIR 2.6 specific features You need to merge the AIR SDK with your flex sdk to do that I created a new copy of my flex SDK renamed it to “flex_sdk_4.1.0.16076_AIR_2.6” and then copy the entire contents of the AIR SDK in there it will ask You to replace files and folders  just click ok and move on to next step.

3.- Adding the SDK to FDT


Fire up Your copy of FDT then go to “Preferences->FDT->Installed SDKs “ click the Add button located in the top right of the panel this will open a new panel asking for the “Path:”  select the folder path to Your newly created SDK, mine is located in “C:\SDKs\flex_sdk_4.1.0.16076_AIR_2.6” give it a name I called mine: “Flex 4.1 AIR 2.6 SDK” hit Ok and  now You’re ready to build a project using AIR 2.6 features, on to next step.

4.- Create a project.

Create a new Flash project by going to “File->New->New Flash Project” give Your project a name, set the project type to Desktop and in the options section of the window change the Flex version to  Flex 4 AIR click the “next” button it will take You to the SDK configuration panel, select the one You created in the last step in my case it was “Flex 4.1 AIR 2.6 SDK” then click finish.

5.- Change the compiler settings.


Right click the project You just created select Properties–>FDT Compiler and change the target player from “-target-player={playerVersion}” to “-target-player={11}” this will let You compile and debug Your project without any errors. Remember to set the version of  your application to “2.6” in Your descriptor file.

 

I will make a full example on how to deploy and debug both to Android and iOS using an ANT file in another post, until then, happy coding.