Recently I had the problem that my Flex code, which used the ResourceManager, would not find the resource bundle, which contained all resources for my application. However, the application compiled but it would always crash whenever the first time a resource should be loaded. I checked my compiler arguments a 1000 times but everything was correct and did work well in another Flex application. The problem was that my resource bundle was not present in the ResourceManager, it just did not load it.

My application did not have any UI elements just a visualization UIComponent that I wrote myself. Thus, I did not load any resources from my MXML. A some point I added a UI element (a Button) and tried to load a resource directly from that Button in order to see if it worked there:

1

<mx:Button label="@Resource(bundle='myResources', key='OBJECT')" />

And it worked fine in that Button and suddenly in the whole application as well. So it seemed to me that Flex refused to load the resource bundle if it was not referenced from the MXML. As I did not want to use an UI element in my application I looked for a workaround and stumbled upon this:

1
2
3

<mx:Metadata>
        [ResourceBundle("myResources")]
</mx:Metadata>

This piece of MXML code just needs to be added in the top of your Application or WindowedApplication in order to trigger the loading of the resource bundle.

fiducialtuioas3 now supports pure TUIO messages via TCP.

The bridge TUIO → Flosc → Flash is now being replaced by the bridge TUIO → udp-tcp-bridge → Flash. The latter method renders the transformation of TUIO messages to a proprietary XML dialect obsolete. That speeds up the connection of the TUIO producer (e.g. Touchlib, CCV or Touché) to the Flash application itself (e.g. Vispol, Volvelles) and thus reduces lag.

Hopefully, TUIO producers will support the output of TUIO via TCP natively soon (as far as I know at least Touché does). However, you are on the safe side if you use memo’s cross platform, open source, C++ UDP TCP bridge.

The TCP tuio AS3 classes have been downloaded and adapted for the additional support of fiducials from Touchgateway.

So you can download fiducialtuioas3 in both flavors (via Flosc and via pure TCP TUIO) from the fiducialtuioas3 google code repoitory (on the right).

In the nuigroup there are a threads about fiducialtuioas3 here and here.

With a little workaround it is possible to load files into Flash in a way that it feels just as if you would do it with a common application: You are being asked with a standard system file dialog, which file you want to load in your application.

However, at first you have to park (i.e. upload) your file on a server in order to make it “publicly” available for your Flash app:

Figure 1: Howto save and load text files with AS3

But step by step. The procedure goes like this:

• You open up a file browser in Flash.
• The user chooses a file from your HD and clicks OK.
• The file is being uploaded from your HD to the server.
• Flash loads the file from the server in itself.

This code should do all the file handling in Flash for you:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46

private var fileRef:FileReference;
private const FILE_UPLOAD_URL:String = 
        "http://your-server.com/path/to/upload/flashUpload.php";
private const UPLOADED_XML_URL:String = 
        "http://your-server.com/path/to/upload/";
 
private function initializeFileRef():void{
    //FileReference allows you to open up system file chooser dialogs and 
    //to simply upload files on a webserver
    fileRef = new FileReference();
 
    //after a file has been chosen in the file chooser dialog the function 
    //fileSelected will be called.
    fileRef.addEventListener(Event.SELECT, fileSelected);
 
    //after the chosen file has been uploaded to the server the function 
    //uploadCompleted will be called
    fileRef.addEventListener(Event.COMPLETE, uploadCompleted);
}
 
/**
 * upload chosen file from file chooser dialog to server
 */
private function fileSelected(evt:Event):void {
	fileRef.upload(new URLRequest(FILE_UPLOAD_URL), "uploadFile");
}
 
/**
 * load uploaded file from server into flash
 */
private function uploadCompleted(evt:Event):void {
	var uploadedFileUrl:String = UPLOADED_XML_URL + fileRef.name;
	var message:String;
	var loader:URLLoader = new URLLoader();
	loader.addEventListener(Event.COMPLETE, downloadInFlashCompleted);
 
    loader.load(new URLRequest(uploadedFileUrl));
}
 
/**
 * file has been completely loaded into Flash. You can now do with it
 * whatever you want to do.
 */
private function downloadInFlashCompleted(evt:Event):void {
	trace(evt.target.data);
}

The script at http://your-server.com/path/to/upload/flashUpload.php should look like this:

1
2
3
4
5
6
7

<?php
move_uploaded_file($_FILES['uploadFile']['tmp_name'], 
    $_FILES['uploadFile']['name']);
#return something to flash. Otherwise the Event.Complete 
#listener will not trigger.
echo "somethingThatFlashGetsAResponseToItsRequest.";
?>

Download the Flash and the PHP example files.

However, as so often with Actionscript libraries there is NO documentation pertaining TwitterScript available on its Google code page, there is no example included in the source code and the source code is not commented. What could be so difficult about providing a little piece of code like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
      addedToStage="init()">
  <mx:Script>
    <![CDATA[
      import twitter.api.data.TwitterStatus;
      import twitter.api.events.TwitterEvent;
      import twitter.api.TwitterSearch;
        import twitter.api.Twitter;
 
      private static const TWITTER_USER:String = "stephenfry";
 
      private var _twitter:Twitter;
      private var _twitterSearch:TwitterSearch;
 
      private function init():void{
        _twitter = new Twitter();
        _twitterSearch = new TwitterSearch();
 
        _twitter.loadUserTimeline(TWITTER_USER);
        _twitter.addEventListener(TwitterEvent.ON_USER_TIMELINE_RESULT, 
            userTimelineResult);
 
        _twitterSearch.addKeyword("ipad");
        _twitter.addEventListener(TwitterEvent.ON_SEARCH, onSearchResult, 
            false,0,true);
        _twitter.search(_twitterSearch);
      }
 
      private function userTimelineResult(e:TwitterEvent):void {
        var twitterStatus:TwitterStatus;
        for (var i in e.data) {
          twitterStatus = e.data[i]
          trace("user tweets",twitterStatus.text)
        }
      }
 
      private function onSearchResult(event : TwitterEvent) : void{
        var twitterStatus : TwitterStatus;
        for (var i : int = 0; i < event.data.length; i++){
          twitterStatus = event.data[i];
          trace("search result:",twitterStatus.text);
        }
      }
    ]]>
  </mx:Script>
</mx:Application>

This example originates to Trevor Boyle’s blog. Improved by Kimi.

In his Bachelor thesis Frederic Frieß enhanced the original Touchlib TUIO AS3 classes with support for fiducials (or to speak in TUIO terms with support for /tuio/2dobj messages).

Thus, the Touchlib’s TUIO classes can simply be replaced with Frederic’s classes and everything should still work as before. However, there is one slight change in the package structure: the TUIO classes are now lying inside the package tuio and not in the package flash.events.

I have made Frederic’s Tuio Fiducial AS3 classes available on Google code in a project called fiducialtuioas3.

If you want to use reacTIVision fiducials in Flash, Flex or Adobe Air you are heartily invited to use these classes in your private and professional project.

Examples of what has been done so far with those classes:
Tangible Vispol
Pf Design Media Installation

If you have a nice project with fiducialtuioas3 it would be great if you shared a link with us via mail or in the comments.

I wanted to remove the status bar in the bottom of the window because it is useless and it looks bad in fullscreen mode.

As standard MXML element Flex Builder uses the mx:WindowedApplication. You just have to add a simple
showStatusBar="false"
and you get rid of that stupid status bar.

[Update 8. April 2009]
Setting
showStatusBar="false"
just causes the status bar to not being displayed. However, it is still there but not visible.

Thus, I added
windowComplete="removeStatusBar(event);"
in the title tag of WindowedApplication and implemented removeStatusBar(event) as following:

private function removeStatusBar(event:AIREvent):void{
removeChild(statusBar);
}

However, there is great reflection class and component available by Ben Stucki that produce an image reflection for standard flex components (and actually keep them up to date by using an enter frame method).

Anyway, there will be two different aspects regarding a Flex Image object if I want to apply this reflection to it:

• The reflection can only be generated as soon as the whole image content has been completely loaded inside of the Image object.
• The reflection stays the same all of the time. Thus, there is no need for an enter frame method.

Actually, I came across this blog entry about the creation of an Image reflection in Flex but there are important parts of the code missing, this works only for one image at a time and the example is not working.

So I wrote a Flex component ImageWithReflection that automatically produces the image reflection. Here is the source code and an swf in a zipped Flex Builder project.

Please remember that Ben Stucki put his code under the Creative Commons Attribution 2.5 License and I do so as well for my part. The images in that example are under a non-commercial Creative Commons licence. So be warned not to reuse them for commercial projects.

Cheers.

As some code is missing in Kevin’s tutorial, here is the code of two Adobe Air thumbnail generation applications.

This video presents the results of the Bachelor thesis of Frederic Friess at the Vislab of the Wiesbaden University of Applied Sciences. I have been Frederic’s mentor under the guidance of Prof. Dr. Doerner for this work.

Frederic developed five kinds of interaction metaphors for the interaction of objects with Vispol:

1. The automatic flare layouts of Vispol can be applied by simply putting the appropriate layout object on the table (the Virttable to be precise). As soon as the object is removed the layout of the objects will be restored.
2. Magnet objects can be declared with a combination of tangible and multi-touch interaction: for instance one magnet can be a victim magnet, which attracts all victim persons. Another magnet can be configured to attract male persons. The result will be that male persons gather around the male magnet and victims around the victim magnet. Additionally, male victims will arrange in the middle of those two magnets.
3. There is a pan magnet that allows to move the Vispol visualization around. If a scale object is added to the pan object the visualization can be scaled by rotating this object.
4. Person objects can be used to create, modify, delete and connect persons. The connection of persons works very nice: two person objects can just be put on top of two persons on the screen and then the objects can be moved to each other until they touch themselves. The persons underneath the objects will then be automatically connected.
5. A timestamp object allows to save the current state into a timestamp object. As soon as this object is added again to the scene the saved state will be restored.

Technically, this interface has been realized with reacTIVision as underlying tracking engine for the objects and the multi-touch input. The application itself is an enhancement of my Master’s thesis project Vispol, which is written in Adobe Flash Actionscript and Adobe Flex. Frederic has developed a very nice framework for the integration of the TUIO-based fiducial messages into the Adobe Flash AS3 TUIO classes of the nuigroup’s Touchlib.

reacTIVision has reacted only very slow to multi-touch input and can in no means compete with the Touchlib as it comes to multi-touch interaction. Thus, a software that could provide both – a reliable object and multi-touch tracking – would be great.

Here you can see a video of the multi-touch capabilities of Vispol.