Dispatching a custom event

There are many common events for Flex components, such as the click or change events. These events are very usefull and great for many situations. Your application or custom component may require more from an event than is provided in these built-in events. Not a problem! You can dispatch any of the predefined events inherited by a component’s superclass, as well as new, custom, events that you define within the component.

To dispatch a new event from your custom component, you must do the following:

  1. Create a subclass from the flash.events.Event class (or another event class) to create an event class that describes the event object. This step is optional.[as]
    public class MyCustomEvent extends Event
    {
    static public var customEventName:String = “customEventName”; public var myEventData:*;

    public function MyCustomEvent(type:String, p_eventData:*, bubbles:Boolean=false, cancelable:Boolean=false)
    {
    super(type, bubbles, cancelable);

    myEventData = p_eventData;
    }

    }
    [/as]

  2. Use the [Event] metadata tag to make the event public so that the MXML compiler recognizes it. This step is optional.
    [as]
    [Event(name=”customEventName”, type=”com.events.MyCustomEvent”)]
    public class MyCustomEvent extends Event
    { …[/as]
  3. Dispatch the event using the dispatchEvent() method.
    [as]
    dispatchEvent(new MyCustomEvent(MyCustomEvent.customEventName, eventData));
    [/as]

[Simple Custom Event Sample]

[Simple Custom Event Source]

Flex Doumentation:

Flex 2.0.2 hotfix released!

Adobe has released a hotfix for the Flex SDK. Looks like there are quite a few things for the DataGrid.

Adobe – TechNote : Flex 2.0.1 SDK Hotfix 1

Flex 2.0.1 SDK hotfix 1 (build 159086) is a collection of bug fixes that have been completed since the Flex 2.0.1 release on January 5, 2007.I like this note: “Installation of this hotfix release is not recommended for customers who are not experiencing one of the described issues”

Cursor postion in a flex TextArea control using the TextLineMetrics class

Problem: We want to add a pop-up box to a TextArea control as a user is types a specific word or set of words into a TextArea control. The pop-up box should needs to be at the position of the cursor, but we don’t know the x & y position of the cursor.

Solution: With a little coercion and the TextLineMetrics class, we can approximate the x & y position of the cursor.

Example using a TextArea control with the id of myTextArea:
[as]
var textHeight:Number = myTextArea.textHeight;
var lineHeight:Number = myTextArea.getLineMetrics( 0 ).height;
var numLines:Number = Math.ceil( textHeight/lineHeight );
var currentLineMet:TextLineMetrics = myTextArea.getLineMetrics( numLines-1 );
var xPos:Number = currentLineMet.width + myTextArea.x;
var yPos:Number = textHeight + predict_ti.y – ( lineHeight * myTextArea.verticalScrollPosition );
[/as]

The TextLineMetrics class contains information about the text position and measurements of a line of text within a text field. All of the measurements are in pixels, so we are just aproximating the x & y position.

[View Sample]
[Download Source]

The problem with the above example is that it only works for the last character that you type into the TextArea. If we want to get the actual cursor position we’ll need to create a custom component using the a TextField.

Below is a link to a simple component that figures out an approximate x & y based on the index of the character 1 less than the current position of the carat within the TextField.

[View Sample]
[Download Source]

Flex: Simple Predictive Text Example

We built a predictive TextInput component in an AS2 for a project that we have been working on for a client. I thought it might be good practice to port it to Flex. I’ve created a very simple example of a predictive text component that uses a local ArrayCollection to populate the results. Obviously the functionality is quite limited, the concept is there. Next on the list of things to do would be to capture keypresses for up and down arrows so the user could select an item in the list more easily as well as creating a more robust data provider example (possibly from Google or something). I’ll be sure post any updates.

[Check out the sample]

[Download the source]

Flex Module for IIS and Apache Released

The Flex module for Apache and IIS provides web-tier compilation of MXML and ActionScript files on Apache and IIS web servers. This lets you rapidly compile and test an application by simply requesting the main application file from a web browser, similar to working server-side scripting languages like PHP, ColdFusion or JSP.

Check it out.

The Rest of ApolloCamp

Well, I tried to get up a post about the rest of the ApolloCamp presos the next morning, but my connection was crap, and the post seems to have been lost, so here goes the rest.

Kevin Hoyt – Nice Presentation on the File API. One huge bonus is the ability to read and write ActionScript object directly. I’ve played with the file IO stuff a little so this was cool to see.

Daniel Dura – Awesome “cookbook” session lots of good. Quick examples, of the Apollo’s windowing etc.

EUI – Gave a presentation on a desktop application they have been working with Ebay on. The cool thing here wasn’t really the application, although some of the features of the app (data filtering) were right up there, but the Java Bridge framework that EUI has been working on. Codenamed Artemis, it allows for access to low-level system functions through Java. Think a wii-mote controlled light saber on the big screen. You can learn more at http://artemis.effectiveui.com/.

Finetune – Showed off their media player that they have been working on. Very cool features like recognizing a playlist on someone’s site and keeping it playing in the desktop application when you leave that persons site!

I’m sure I’ve forgotten quite a bit of all the cool stuff that was presented. I do want to give a big thanks to all those involved with ApolloCamp. It was a great event, and I’m sure a ton of work. Good job everyone!