iPhone Apps with CS5

Lee Brimelow has a great video about creating apps for the iPhone with CS5. This is is just a preliminary video showing a prerelease version of Flash CS5. The process may change in the final release, but it gives a good idea of what is going on and what kind of performance you can expect.
Sounds like it costs $99 per year to become an iPhone developer through Apple. You’ll have to pony up if you are serious about developing iPhone apps.

http://www.gotoandlearn.com/play?id=116

Here’s a little on someone’s experience creating apps for the iPhone:

http://joshblog.net/2009/10/18/bowler-hat-games-phase-two-begins-chroma-circuit-for-iphone/

SWFObject

SWFObject, if you haven’t heard of it already is a really great little javascript that simplifies the process of embedding your swf files in an html page. This is a huge improvement over the default systems provided Publishing from Flash or Dreamweaver.

The method provided by the Publish settings in Flash and Insert > Media > Flash in Dreamweaver work just fine, but they leave you with a huge Javascript mess in your HTML page. SWFObject provides a clean and organized system that works well and provides a few extra perks.

You can download SWFObject here: http://code.google.com/p/swfobject/

SWFObject is contained in a single small Javascript file. I have been using the latest version (at the time I wrote this it was 2.2) and it seems to work well.

You can write the code for yourself following the documentation on the site listed above. Or use the code generator here: http://www.bobbyvandersluis.com/swfobject/generator/index.html

I had some trouble getting Flash to display 100% width and height. But this was sorted after a short Google search. Turns out the following styles are required:

html, body {
 background-color: #616264;
 margin:0;
 height:100%;
 overflow: hidden;
}
#flashcontent {
 height:100%;
}

Note, without overflow:hidden you end up seeing the scroll bars and the page scrolls about 5px. This was very confusing, you would figure that 100% height would make everything the size of the browser rather than a little larger?

Javascript Audio Player

I was thinking about Javascript and wondered if anyone had made a Javascript Audio player? Turns out there is a very impressive one that uses many of the features slated for HTML5. To tell the truth I was prepared to be underwhelmed when I started searching. I was actually very impressed with this player. The audio samples were less than impressive.

http://hyper-metrix.com/open-source/jai/

Programming with Classes

The other day I found myself with nothing do in the late evening and thought and improving book might be just thing. I find a good software manual the perfect subject for a prerequiste to slumber.

The choice was a title I had lying a round for a while. But, had not had the mental agility to tackle earlier. I had gotten a few good naps from the title earlier before moving on to other topics.

The subject of loaders had been coming up all week. I had been working with the Load_Content class with my students, I had also created an AS3 version of the venerable ImageStreak class, and moved on to a, soon to be realease, image loading masking effect thing.

At this point the material in the book was finally hitting home. The book by the way is: Advanced Actionscript 3.0 with Design Patterns. We’ll just stick to calling this title “The Book” for the rest of this post. The name seems to be doing pretty well for itself so far. And it’s growing on me.

The Book, says there are several different types of Class files that you can write. The first time through I figured this stuff was for those smart guys that really knew what they were doing. Or, for the larger more involved projects written by people that like to type for days.

It was the loader class that really made the ideas hit home. Imagine you want to load an image. In AS you need to create an instance of the Loader class. Create an instance of the URLRequest class. Then follow these up with a listeners. More work than the old AS2. But worth it.

For example:

var loader = new Loader();
loader.load( new URLRequest( url ) );
loader.contentLoaderInfo.addEventListener( Event.COMPLETE, on_complete );
loader.contentLoaderInfo.addEventListener( ProgressEvent.PROGRESS, on_progress );

Of course then you go and make a class that loads an image and works with it. Like the ImageStreak. Then, you go and do it again with another class. Of course you are writing the few lines and you’re just happy to see it all work.

But it it could work better! Back to The Book. An important idea presented is the Abstract class. This is a class that presnts the base properties and methods of a class. It sounds like the Abstract is usually meant to be extended. Think about it in terms of class that load images. All of these classes would need the same basic functionality. They need to load an image. Other classes that need to load an image could extend this class.

The Abstract Loader class would need to provide only the load method. Of course this means that all these many loader classes that will be extending Abstract Loader will also need to include a load method. Of course this easy to remember. Expecially when you have such an excellent new compiler error system, and it’s fanciful messages. 1067: Implicit coercion of a value of type foo to an unrelated type bar anyone?

Of course The Book again comes through with a better way! The interface. An interface is not some fancy new button motion that’s sure to move your new site up the ranks of the FWA. Instead it defines a programming interface. A programming interface describes the method names, parameters and return types for a class. Or any number of classes.

Think about the many and varied image loading classes that you are going to create, by extending the Abstract Loader. They will all need to make use of Abstract Loaders load function. By defining it in interface and making all variants implement this interface you can be sure that your classes will all work correctly.

So what doesn it all look like, sleepy yet?

First step, we want to make a class that loads an image. Then we want to follow it up with a series of classes that extend this class and load images in new and interesting ways. All the classes will need to provide the same method to load images. So, and here’s the good part, we write an interface!

Here’s the interface, we’ll call it ILoader (the I is for interface):

package {
	public interface ILoader {
		function load( url:String ):void;
	}
}

The interface defines a single function, it’s parameter and it’s return type. Note, that it doesn’t define the code block for the function. This is left to classes that implement ILoader.

The next step is to define the Abstract class. This will be a class that defines the basic functionality used by all the classes that will extend it. We’ll call this one AbstractLoader.

package {
	import flash.display.*;
	import flash.events.*;
	import flash.net.*;

	public class AbstractLoader extends Sprite implements ILoader {

		public function AbstractLoader( url:String = null ) {
			if ( url != null ) {
				load( url );
			}
		}

		public function load( url:String ):void {
			var loader = new Loader();
			loader.load( new URLRequest( url ) );
			loader.contentLoaderInfo.addEventListener( Event.COMPLETE, on_complete );
			loader.contentLoaderInfo.addEventListener( ProgressEvent.PROGRESS, on_progress );
		}

		protected function on_complete( e:Event ):void {
			dispatchEvent( new Event( Event.COMPLETE ) );
			e.target.removeEventListener( Event.COMPLETE, on_complete );
			e.target.removeEventListener( ProgressEvent.PROGRESS, on_progress );
			addChild( e.target.content );
		}

		protected function on_progress( e:ProgressEvent ):void {
			dispatchEvent( new ProgressEvent( ProgressEvent.PROGRESS, false, false, e.bytesLoaded, e.bytesTotal ) );
		}
	}
}

This class wraps the Loader class. It creates a loader instance and creates it’s own URLRequest Object. It also sends out it’s event messages for PROGRESS and COMPLETE events.

It also implements ILoader, implements is key word. This tells the Flash compiler to check this class against the interface it implements. This makes usre that this class provides the functions, parameters, return types, and class properties defined in the interface.

For all that extra work what do you get, Still awake? Answer, some pretty good error checking, but you knew that would be the case. With the creation of the Abstract class, you get all of the base functionality for many classes. This simplifies writing those new classes. No need to rewrite what you’ve alreay written. Where it really pays off is when you want to make a change. Adding a feature to the Abstract class adds that feature to all classes that inherit from it.

Wow, what fun. Take a look at the ImageStreak and CircleMask classes.

To Cuddle or Not to Cuddle?

I was reading an article the other day on Grant Skinner’s blog about styles of writing code. me and Grant like to cuddle, who’d of thunk it?

I prefer same line formatting for many of the reasons listed. I would recommend finding a style that works for you and sticking with it. Having your code all over the page makes it difficult to understand what you are looking at.

Flash > Preferences, in the Actionscript category allows you to set the auto format button to follow one style or another. Be sure to set these options and use the Auto format Button often!