Archive for the ‘Flash’ Category

Flash Builder not creating .html wrapper file

July 10, 2010

This morning Flash Builder 4 (SDK 4.1.0) kept saying “File not found: ….. *html”, which is the html wrapper for the app. Here is how I fixed it:

  1. Project properties->Flex Compiler->HTML wrapper->Uncheck “Generate HTML wrapper file”->OK;
  2. Build project;
  3. Check “Generate HTML wrapper file” in step #1->OK;
  4. Build project.
Advertisements

Autohide UIScrollbar on a dynamic text field – AS3

February 22, 2010

mUIScrollBar.visible = (mTextField.maxScrollV > 1);

Uninstall Adobe AIR application in Linux/Ubuntu

September 11, 2009

I am talking about AIR 1.5.2 installer and Ubuntu 9.04 (cat /etc/lsb-release to find out your Ubuntu version).

Simple run the installation package file (*.air, which is basically an zip file) again. If you don’t know where it is (and presumably still in your machine), go to “Applications->Accessories->Adobe AIR Application Installer”, which opens the most recently installed AIR package (*.air), then click “Uninstall”.

Synchronizing small projects in eclipse

August 17, 2009
  • To export the project as a zip: File>General>Archive File;
  • To import it back to the workspace: File>General>Existing Projects into Workspace
    and select the aforementioned zip file. This will result in a new folder in the root of the current workspace.

Tracking mouse movement in Flash Player

June 8, 2009

In a recent prototyping project, I attempted to simulate “shake” gestures in a desktop AIR application, i.e., using mouse cursor to simulate a hand grabbing some object on the screen…

Anyhow. I found out that Flash Player can send out the mouseMove event must faster than it can update the screen. In the case you want to keep track of the simulated gestural motion, you would want to track the mouse cursor position on the stage, instead of the display object the mouse cursor is dragging. This is because when you drag the object to the point Flash Player cannot keep up with, the redaw will then not necessarily reflect the real positional changes of it in between the frames.

Take a look here. Right click to for the code. Also note that when directly register Application.application as the currentTarget we seem to get smoother tracking than if we registered the display object, like so:

mButton.addEventListener(MouseEvent.MOUSE_MOVE, mButton_handleMouseMove);/** you got more stripped out points than if you do this:

addEventListener(MouseEvent.MOUSE_MOVE, mButton_handleMouseMove);// this is btter.*/

MVC revisit: Take two

June 7, 2009

I find that MVC is much easier to understand both at the conceptual level and at the implementation level if you think about it from the perspective of how you communicate with the Model.

  1. Control is the input to Model. Basically, the Control is responsible to take input from the user or the system and stransfer it to the changes in the Model; The View is merely there to render the changes from the Model; so it can be considered as the output from the Model. You should keep the business logic as much as possible inside the Model and leave Control/View simple and dandy.For Flex 3 (Halo) components, the way of input is realized by implimenting the “change” listener of the controls, like this:

    <mx:TextInput id="mTxt" change="mVO.txtValue = mTxt.htmlText;"/>

    In Flex 3, when you bind a model to a control, it is one-way communication, meaning the control will reflect the change whenever there is one in the model; but the control would not be able to change the model. That’s why we need to wire through the change listener to make this happen.

    The output is hooked up by setter methods in the Model. Whenever you detect some changes that are historical, you would notify your listeners.

    [Bindable]
    public function set myValue(v:int):void
    {
    _
    myValue = v;
    notifyListeners();
    }

    In ActionScript 3, we normally implement “notifyListeners” by way of dispatchEvent. Your client listens to the event and updates the View by querying the changes from the Model. You may want to have different types of events so that your listeners can respond differently. For example, you normally would invalidate properties of your component and regenerate all the renderers when the data provider has changed, besides doing other updates; and you don’t want to do this kind of heavy-lifting each time when changes occur on the “less important” members of the Model.

  2. Asynchronous data. Sometimes you may compose something like an HTTPService component into your Model so that it can request external data.The data that are requested by the Control at a lot of times are not immediately available, and normally you would not notify your listeners until they are ready (For example, parsed into an XMLList object that can be consumed by component’s dataProvider).
  3. Static members are available before non-static members of the objects. You can use static members to set some initial values of your member variables.
  4. When you smell spaghetti code in your Model, try to partition/refactor your Model into smaller Value Objects. Value objects are a good way to structure your data/make flat Model hierarchical.
  5. For larger projects, you may want to duplicate Model (or value objects) so that multiple client can access the same data. For example, in your main window of your AIR application, you initialize your model like so:

    public var chatModel:ChatModel = new ChatModel();In another console window, you want to access the same model, like so:

    private var chatModel:ChatModel = Application.application.chatModel;

JSON to XML

June 1, 2009

A lightweight plugin for Eclipse. Works good for me on Flex Builder 3 (v3.0.1.2x).

JavaScript xml2json and json2xml.

Keyboard Keys and Key Code Values in ActionScript 3

April 21, 2009

Here

Install flare as ActionScript project

March 27, 2009

1. You will need to include “framework.swc” from the Flex SDK in order for it to compile.

In my computer, the framework.swc is at

“C:\Program Files\Adobe\Flex Builder 3\sdks\3.3.0\frameworks\libs”

2. In “ActionScript Build Path”->”Source path”, you would need both folders under “flare” folder. One is “src” (where all the  flare classes reside”; the other is “lib” which is namespaced “com.adobe.serialization.json”.

3. This one just keeps puzzling me. Please let me know if I am missing anything obvious. Flex throws the following error at the compile time,  for this signature

internal function doEnd(evtType:String=TransitionEvent.END):void in flare.animate.Transition:

"Type 1047: Parameter initializer unknown or is not a compile-time constant. Transition.as"

What I did to fix it was I had to change it to:

internal function doEnd(evtType:String=”end”):void

Working in 3D with Flash Player 10/ActionScript 3 101

December 30, 2008

1. The coordinate system in Flash Player is right handed. For angles in ActionScript, when dealing with DisplayObject properties such as rotationX, use degrees; when dealing with maths such as Math.atan, Math.cos etc., use radians.

2. Gumbo SDK and Flex SDK 3.2 have slightly different implementation on coordinates and layout. A UIComponent with the z depth appears much closer in Flash Player if complied with sdk 3.2 than if complied with Gumbo.

3. When Flash Player applies 3D, “the DisplayObject is drawn into a bitmap, then a vector rectangle (1 quad, not 2 triangles) is created with the dimensions of that bitmap, using that bitmap as a fill. The quad edges are then transformed into 3d world space and projected into 2d stage/global space.” (here, see comment #11.)

4. The Matrix3D and PerspectiveProjection class are used to manipulate visaul classes.

DisplayObject.perspectiveProjection.projectionCenter, which is the type of flash.geom.Point, determines the displayObject’s projection center. If you are setting root (which is  [_Main_mx_managers_SystemManager]) object’s projection center, be aware that  (a) root may be be available when the display list of the component is validated; (b) DisplayObject.transform.perspectiveProjection returns null unless you explicitly instantiate and assign a new PerspectiveProjection object to it, like so:

var pp:PerspectiveProjection = new PerspectiveProjection();
pp.projectionCenter = new Point(width/2, height/2);
contentPane.transform.perspectiveProjection = pp;//this prevents the mouse events from emitting from the contentPane

UICompnent(contentPane).parent.transform.perspectiveProjection = pp;//this doesn’t have the mouse event masking problem.

UICompnent(contentPane).root.transform.perspectiveProjection = pp;//this doesn’t have the mouse event masking problem.

Setting the projection center to the root object will affect the 3D projection of all the displayObjects on the stage, while setting the projection center for individual displayObjects will only affect those objects themselves and their children.

AppendRotation/PrependRotation/AppendTranslation/PrependTranslation apply transformation incrementally to a DisplayObject. To apply transformation in absolute values, use .transform.Matrix3D.recompose() instead:

import flash.geom.Vector3D;
import __AS3__.vec.Vector;

var v3:Vector.<Vector3D> = new Vector.<Vector3D>(3);
//The following line is required to avoid error in Gumbo but not sdk 3.2:
//items[id].transform.matrix3D = new Matrix3D();
v3 = item.transform.matrix3D.decompose();
var ang:Number = (-v + 180 +(centralAngle/numItems)*id)*Math.PI/180;
v3[0] = new Vector3D(0, radius*Math.sin(ang), radius*Math.cos(ang));
item.transform.matrix3D.recompose(v3);

To quickly manipulate an object in 3D, you can also use a Matrix3D object as follows:

var matrix:Matrix3D  = new Matrix3D();
matrix.appendTranslation(10,10,0);
matrix.appendRotation(1, Vector3D.YAXIS);
//instantiate .transform.matrix3D property if it doesn’t have one yet:
myObject.z = 0;
myObject.transform.matrix3D = matrix;

“To make something not be 3d anymore, set its .transform.matrix to a non-null value (or set .transform.matrix3D to null)”.

5. Some quirks of Flex 3 (“Moxie”):

If you apply an effect (say mx.effects.Blur) on a UIComponent that has its transform.perspectiveProjection.projectionCenter set explicitly already, FP will first remove the .tranform.Matrix3D on the component before applying the effect. This makes the target look like it’s jumping back to the origin. (Tested on SDK 3.2).

If you try to set projectionCenter (of its parent) and z properties on a UIComponent at the same time, your component won’t be able to receive any mouse event at all. This seems to be fixed on Gumbo.

mx.effects.Move seems to have its own projection center set and ignores your setting for its (parent’s) projectionCenter.