Categories
Tips & Tricks

Class browser

In Flash MX 2004, one thing I wished it had is a class browser. But with all the new features in this release, we can’t have everything on our wishlist all at once, can we?

Here’s a little tip on how to make your own “class browser” with the Project panel:

Because all the classes have external .as class definitions inside the folder:
[Flash installation folder]enFirst RunClasses, we can add these to the Project panel and browse the classes from there. Double-clicking on an .as file from this list opens up the class definition in the Script window (in the Pro version only):

ClassBrowser.gif

To save you all the work of browsing through the folders and making your own project, download it here: ClassBrowser.flp

Categories
News

Get Flash MX 2004!

After all the excitement since the annoucement, Flash MX 2004 and Studio MX 2004 are available for download (fully functional 30-day trials) and purchase!

Also available are Flash Player 7 and Flash Remoting Components for Flash MX 2004.

Categories
ActionScript OOP

Inheritance in ActionScript 2.0

Back in the good old days of Flash 5 and MX, trying to do inheritance in ActionScript required some knowledge of what goes on behind the scene. Also, the infamous superclass invocation bug haunted developers for almost three years.

Now in ActionScript 2.0, with the new OOP-specific keywords, inheritance is much simpler:

class Parent {

}

class Child extends Parent {

}

That’s all. And the keyword “super()” in the Child class constructor is not even mandatory because the compiler inserts it for you!

As for the superclass invocation bug, it is now fix for Flash player 7!

Categories
ActionScript

Code hints

In Flash MX 2004, some of the component code hints are not listed in AsCodeHints.xml or UIComponents.xml. As a result, what used to be a common thing to do in MX by using code hints such as _cb for ComboBox, does not work now.

Well, there are two solutions:

1) Add you own code hints information to the two files mentioned above.

2) Reference the component class in your code:

var sp:mx.containers.ScrollPane;

Now when you type sp. the list of ScrollPane methods and property is displayed!

Thanks go to Rebecca Sun of Macromedia for this tip.

Categories
ActionScript

ActionScript 2.0

Here are some of the new features in ActionScript 2.0, and why one would want to use it instead of ActionScript 1.0 (yes, you can still use the older syntax in Flash MX 2004).

ActionScript 2.0 is not a new language. It is an enhancement to the previous version, by building on the existing language. In fact, Flash MX 2004 compiles AS2 into AS1 equivalent bytecodes. One reason for this is backwards compatibility in Flash Player 6. As a result, one can code in AS2 and compile it for Flash Player 6. For better optimization, target for Flash Player 6.0.65.0 or higher. Some version 2 components won’t run except in FP7, but some can run in 6.0.79.0 as well.

In terms of building applications, ActionScript 1.0 (and ECMAScript 3 in general) requires getting intimate with something called the prototype (and __proto__ if you’re a rebel trying to avoid unwanted side effects). The reason being that there was no ‘class’ construct, and inheritance was done in a very odd way.

Now in ActionScript 2.0, it is more suitable for OOP because of the following new keywords and features:

class, interface, extends, implements, private, public, dynamic, instrinsic, static, get, set, import; class path (similar to package), and strict data typing (useful in locating problems at compile time).

With these new features in ActionScript 2.0, building robust applications is becoming more attractive, and in a way easier. However, because Flash MX 2004 does not care if AS1 or AS2 is used (in most cases), one can still continue using AS1 and slowly migrate over to AS2.

Categories
Tutorials Web Services

Tutorial: BabelFish with WebServiceConnector

The new WebServiceConnector component in Flash MX 2004 Professional makes talking to standard (SOAP) web services extremely easy. Here’s how to make a simple call to the BabelFish web service using Flash MX 2004 Professional’s new features:

  1. Drag the WebServiceConnector component to the stage (just outside of it), and give it an instance name “babelfish”
  2. Select it and open the Component Inspector
  3. Under the Parameters tab, enter the WSDLURL:
    http://www.xmethods.net/sd/2001/BabelFishService.wsdl
  4. Click the next field “operation” and select BabelFish
  5. Click the Schema tab and check out the schema for this web service
  6. Note that it requires two parameters (translationmode and sourcedata), and it returns a string

    7. Now let’s create the interface of the application:

  7. Drag a TextInput component to the stage, adjust its size as needed, and give it an instance name “sourcedata”
  8. Drag a ComboBox to the stage and name it “translationmode”
  9. Drag a TextArea component to the stage (this is for displaying the result from the web service), adjust its size as needed, and name it “results”
  10. Drag a button to the stage, change its label to “Translate”
  11. With the button selected, add a new behavior from the Behaviors panel: Click the + button, select Data – Trigger Data Source. In the popup window, select babelfish.

    12. Let’s bind the babelfish component to the interface:

  12. Select the babelfish component, open the Component Inspector panel and click the Bindings tab
  13. Click the + button, select “translationmode:string”, and click OK. Double-click on the “bound to” field underneath. In the Bound To dialog box, select “Combobox, ” on the left, and “value:String” on the right. Click OK.
  14. Add another binding, this time select “sourcedata:String” and click OK. In the Bound To dialog box, choose “TextInput, ” and click OK.
  15. Add another binding, select “results:String” and click OK. In the Bound To dialog box, choose “TextArea, ” and click OK.

Now is a good time to save the FLA.

Before we can make this work, we need to populate the ComboBox. First, let’s take a look at how the web interface of BabelFish looks like: http://babelfish.altavista.com/. From the dropdown menus, you can tell the languages and translation directions.

View Source from the browser, inspect the data that is sent to the server when an item is selected from the dropdown menu:

English to Chinese
English to French
English to German
English to Italian
English to Japanese
English to Korean
English to Portuguese
English to Spanish
Chinese to English
French to English
French to German
German to English
German to French
Italian to English
Japanese to English
Korean to English
Portuguese to English
Russian to English
Spanish to English

Let’s populate these data into our ComboBox: Deselect all items from the stage, and add a new script:

translationmode.addItem(({label:"English to Chinese", data:"en_zh"}));
translationmode.addItem(({label:"English to German", data:"en_de"}));
translationmode.addItem(({label:"English to Italian", data:"en_it"}));
translationmode.addItem(({label:"English to Japanese", data:"en_ja"}));
translationmode.addItem(({label:"English to Korean", data:"en_ko"}));
translationmode.addItem(({label:"English to Portuguese", data:"en_pt"}));
translationmode.addItem(({label:"English to Spanish", data:"en_es"}));
translationmode.addItem(({label:"Chinese to English", data:"zh_en"}));
translationmode.addItem(({label:"French to English", data:"fr_en"}));
translationmode.addItem(({label:"French to German", data:"fr_de"}));
translationmode.addItem(({label:"German to English", data:"de_en"}));
translationmode.addItem(({label:"German to French", data:"de_fr"}));
translationmode.addItem(({label:"Italian to English", data:"it_en"}));
translationmode.addItem(({label:"Japanese to English", data:"ja_en"}));
translationmode.addItem(({label:"Korean to English", data:"ko_en"}));
translationmode.addItem(({label:"Portuguese to English", data:"pt_en"}));
translationmode.addItem(({label:"Russian to English", data:"ru_en"}));
translationmode.addItem(({label:"Spanish to English", data:"es_en"}));

That’s it! Test movie and enter some text, select a translation mode, and click the Translate button to see the translated text! Not too bad is it? Try it out:

Okay, this is what it looks like. Why doesn’t it work? It’s because when the new Flash Player 7 is running inside a browser through HTTP, the new cross-domain security prevents this SWF from loading data from another domain.

What is needed is a policy file – an XML document specifying who is allowed, and this file has to reside at the web service domain. One way to get around this is to use a redirection proxy (server-side script) at this domain, to pass the data between servers and back to this translator. This will be the subject for another day.

UPDATE:

Instead of hardcoding the translation modes into the movie, Mark Shepherd of Macromedia suggested using the XMLConnector component to load an external XML file with the translation modes, and bind the data to the ComboBox. I’ve gone one step further by adding the web service URL in this XML document (BabelFish.xml). This is what I usually do for application configurations, it makes updating quick and easy without going into the source movie and recompiling another SWF.

Also, a redirection proxy file is being used. However, for some reason, this proxy only works when the movie is running inside Flash’s IDE or from the desktop standalone projector, but still not from this domain, even though both the SWF and the proxy are located in the same folder. This is the proxy similar to the one posted at Macromedia, except I’m using JScript instead of VBScript (that does not work either):

Why does this proxy work outside of the browser and not from the same domain? I’d really like to get an answer to this one.

You can download the source files, check them out and let me know if you find anything. Thanks!

Categories
ActionScript OOP Tips & Tricks

abstract class

Since ActionScript 2.0 does not have the “abstract” modifier, here’s one way to create a class that acts like an abstract class, by making the constructor private:

class PretendToBeAbstractClass {
    // private constructor
    private function PretendToBeAbstractClass() {}
}

When the following statement is compiled, the compiler will complain that one can’t instantiate from this class because the constructor is private:

var o:PretendToBeAbstractClass = new PretendToBeAbstractClass();

Although the constructor is private, but because it behaves as protected, you can still extend this class:

class MyClass extends PretendToBeAbstractClass {
}

What is missing is the compiler does not actually know what an abstract class is; therefore there won’t be any warning messages.

As I mentioned in the last post, you can get around all the type-checking at runtime, and even instantiating an “abstract” class at runtime like this:

var o = new _global["PretendToBeAbstractClass"]();

Or even access “private” properties from it:

trace(o.somePrivateVar);

Obviously these actions defeat the purpose of strict-typing, but it is possible (until runtime type-checking is implemented).

Categories
ActionScript Design Patterns OOP Tips & Tricks

Singleton

Here’s one way to implement a Singleton in ActionScript 2.0:

class Singleton {
	// the only instance of this class
	private static var inst:Singleton;

	// keep count of the number of Singleton objects referenced
	private static var refCount:Number = 0;

	// constructor is private
	private function Singleton() {}

	// get an instance of the class
	public static function get instance():Singleton {
		if (inst == null) inst = new Singleton();
			++refCount;
			return inst;
		}

		// return the number of instance references
		public static function get referenceCount():Number {
		return refCount;
	}
}

The count property is for keeping count of the number of Singleton objects referenced (obviously it is not aware of destroyed objects), and is not really a necessary member of the Singleton pattern.

To use this class, one would write something like this:

var s1:Singleton = Singleton.instance;
var s2:Singleton = Singleton.instance;

Now s1 and s2 are the same instance of the Singleton class.

Categories
ActionScript OOP

private, protected & public

In ActionScript 2.0, there are “private” and “public” modifiers, but there is no “protected”. However, “private” behaves like “protected” – i.e. subclasses and instances can access private members; so there is no true private scope.

To make sure the compiler catches access to private properties/functions, strict-typing has to be used:

class SomeClass {
     private var:somePrivateProperty:String;
 }

// without specifying the type of the instance, the compiler will not
// prevent statements from accessing private properties; therefore,
// o.somePrivateProperty is accessible

var o = new SomeClass();
trace(o.somePrivateProperty);

// by specifying the type, the compiler will catch acess to
// private members:
var o:SomeClass = new SomeClass();

Because type-checking is only performed at compile time, there is no guarantee that private members cannot be accessed at runtime.

By default, if the “public” modifier is left out, the member is assumed to be public.

Categories
News

The beginning of swfoo.com!

Welcome! This marks the first post for swfoo.com!

What is swfoo?

It’s about ActionScript 2.0 development, object-oriented programming, design patterns, software architecture, Rich Internet Applications, Flash, ColdFusion, Flash Remoting, web services, tips and tricks, life, the universe, and other geeky stuff…

What happens to Quantumwave.com?
[Update 2013, 10 years later: This domain is now qwmobile.com]

It is alive and kicking! Because Quantumwave Interactive Inc. is a company site that offers diverse services, it’d be better if the personal blog and Flash focus are kept separately. I’ll slowly migrate the Flash resources over to this site.

In the mean time, hope you’ll enjoy this new site (which is still under heavy construction)!

Dave Yang