a shakey first few moments with 2.0.1

I had a scary first experience with the Flex Builder 2 (2.0.1) Trial on the Mac, after having commenced a project using the Beta…

Before installing, I was aware of the following bullet in the release notes

Opening old Flex projects – The Flex Builder 2.0.1 update cannot open projects that were created with pre-release versions of Flex Builder 2. Flex Builder 2 beta-level projects must be recreated in Flex Builder 2.0.1.

So I zipped a back-up copy of my project files.

On installing and launching 2.0.1, I was suprised that my existing projects seemed to open ok. But ‘cleaning’ the project had the effect of removing the html files. Additionally seemingly spurious errors were generated on compile. The first being 1023: Incompatible override.

I keep my project files on a seperate disc away from the default location. So I deleted the folder and restored just my source files from a zip and recreated the project in builder 2.0.1 – still no joy. In-fact even creating a new application project with only the default stub resulted in errors reported at lines which didn’t exist. (Similar to these reported issues on Flexcoders).

I found the issue to be primarily that the 2.0.1 Builder looks for the same workspace files as the Beta – and they aren’t compatible. The solution…

Rename the existing “Flex Builder 2” folder to “Flex Builder 2 Beta” to accurately reflect the builder that created it. (Just to ensure you can revert to using the Beta if you need to – which I thought would be a likely prospect if my experiment failed) On the Mac:

/Users/username/Documents/Flex Builder 2
becomes
/Users/username/Documents/Flex Builder 2 Beta

(Note: for Flex Builder 2 Beta to pick up it’s workspace again, you need to choose “File>Switch workspace…” from the menu. Not that you’ll want to go back to the beta, once you have 2.0.1 running properly.)

Then when launching the 2.0.1 version, the “Flex Builder 2” folder will be re-created but this time containing a 2.0.1 compatible workspace. You can then start creating projects, porting your old source files as you see fit.

All the spurious errors are now cleared, and proper html files created. So far looking good with improved performance over the beta!

New flex dot-one, one day away

In case you missed it we have a new Flex dot release (2.0.1) due in the next 24 hours. Very significant for us Mac users – time to get the full version and pay for it!

I was hoping that there might be a simultaneous Apollo release. But while this version introduces development support for Apollo, the beta version seems to have a way to go yet.

More detail of the new features here.

Anyway, “Ted On Flex” seems excited! (A blog worth signing-up to if you are interested in Flex)

tile or repeat an image into a flex application background

UPDATE: There is a revised version of this post here, which you might find more accessible. It also includes a tile into the background of a Canvas.

I’ve only been using Flex for a few weeks via the Flex Builder Beta for the Mac. While I am really impressed with the ease of use of the framework, and now something of a convert, I was suprised by the apparent inability to tile (or repeat) an image over the background of the Application.

I tried a number of approaches which I now look back on as naive. I haven’t at this point managed to find a documented solution by googling. Though as responses to this post show (update: source now published), there seems to be interest in finding a solution.

So here is one solution. I don’t claim this to be ‘best practice’. Far from it. But it works, and will suffice for me until I am more familiar with Flex.

  1. Locate your flex installation, then Flex SDK 2/frameworks/source
  2. From here navigate the package structure to mx.skins.halo
  3. Duplicate file “ApplicationBackground.as” to a suitable location within your project file structure. In my case saved to ‘{projectroot}/com/ct/skins”
  4. Edit your local copy as per the following notes

Adjust the package detail

In my case the package line now reads:

package com.ct.skins

Add some imports

We need the following import lines to access the bitmap data:

import flash.display.Bitmap;
import flash.display.BitmapData;

Remove the version include

Because we are working outside the structure of the halo skin collection, we no-longer need or want the following line:
include "../../core/Version.as";

Embed the image and declare some variables

In this case I am embedding the image at compile time:

[ Embed( source='/assets/BackgroundLines.png' ) ]
private var backgroundImageClass :Class;
private var backgroundImage :Bitmap;
private var backgroundBitmapData :BitmapData;

Modify the constructor

In our constructor, after the call to ‘super()’ we need to get the bitmap data of the image into the backgroundBitmapData variable, we do this by first creating a Bitmap instance of the embedded image in backgroundImage, then drawing the data into backgroundBitmapData:

backgroundImage = new backgroundImageClass();
backgroundBitmapData
= new BitmapData( backgroundImage.width, backgroundImage.height );
backgroundBitmapData.draw( backgroundImage );

Clear out and replace the content of updateDisplayList

The only line we need keep is the super call. Everything else can be replaced with the following 4 lines:

var g:Graphics = graphics;
g.clear();
g.beginBitmapFill( backgroundBitmapData );
g.drawRect(0,0,w,h);

Now we just need to apply it.

All we need to do is point the borderSkin attribute of the mx:Application tag to this new skin. In my case the attributes of mx:Application look like this:

xmlns:mx ="http://www.adobe.com/2006/mxml"
frameRate ="36"
layout ="absolute"
borderSkin ="com.ct.skins.ApplicationBackground"

Bob’s your uncle!

I’d appreciate comments on a better practice approach.

Further reading:

flash webservices pending call gotcha – well got me for a while

I have a webservice running from asp.net. Sample method interface…

[WebMethod( Description = "Returns the About content" )]
public XmlDocument getAbout()
{
  xmlDoc.LoadXml( "<about></about>" );
  rootElement = xmlDoc.DocumentElement;
/*
* add some child nodes... etc
*/
...
  return xmlDoc;
}

As you can see the return type is of XmlDocument.

In ActionScript I am using code within a class similar to…

  private var myPCO :mx.services.PendingCall;
  private var myWSO :mx.services.WebService;

// myWSO is intialised once in a constructor or some other suitable location
  myWSO = new WebService( "/TheService.asmx?WSDL" );

//inside some function we initiate the data load
  myPCO = myWSO.getAbout();
  myPCO.onResult = mx.utils.Delegate.create( this, pcoResult )

// we handle a dataresult...
  private function pcoResult( result:XML ):Void
  {
    trace( result.firstChild.nodeName );
  }

The trace returns ‘undefined’. Spotted the mistake?

Because my service is returning an XML object, I assumed the ‘result’ would be the XML object. It isn’t. It is simply an object which contains the XML object, the root node of which you can access directly by name. In this case…

private function pcoResult( result:Object ):Void
{
  trace( result.about.nodeName );
}

This now correctly traces ‘about’.

Mac OS X batch xhtml validation

While many development tools include report generators capable of testing the validity of your xhtml site wide, they can only act on the code they are aware of. Where pages are dynamically generated using server-side scripting such as ASP / PHP etc, the only real way of testing the resulting xhtml is to test the content at run-time. The w3c validator is a handy tool for doing this, but it can become tedious to use interactively across a large number of files or test-cases. Additionally, if the site files are part of an extranet, or carry confidential information, you won’t want to be pushing the content out to a public service for validation.

An approach I use from time to time is to batch test site files on an internal network. To do this I use the following tools…

  • w3c validator
  • wget
  • awk (this is already on your system)

There is a small amount of work to do in setting up your system for this approach.

1. Install the w3c valdidator locally

Apple have produced and maintained an excellent article on how to install the validator onto your Mac OS X system. However I found a few areas which at time of writing were not accurately described…

  1. The Base code and the DTD Library downloads are gz files not tar files. This means the 2nd and 3rd lines of the instructions will not work as written. If of-course you double-click the downloaded files on the desktop, they will first expand to the tar file, then expand to a folder on the desktop. At which point will now have the following files and folders on your Desktop:
    1. sgml-lib.tar
    2. sgml-lib.tar.gz
    3. validator.tar
    4. validator.tar.gz
    5. validator-0.7.2 (folder)
    6. validator-0.7.2 2 (folder)
  2. validator-0.7.2 2 actually contains the expanded content of the sgml-lib.tar.gz file and contains a htdocs folder itself containing a sgml-lib folder.
  3. The instructions also seem to fail to inform you where to place the sgml-lib folder. It is apparent from the validator.conf sample file, that the sgml-lib folder should sit inside htdocs. So before going further. just through the finder I copied the sgml-lib folder from validator-0.2.2 2 to validator-0.7.2/htdocs/
  4. We can now pick up the instructions on the 4th line which reads “cd /Library/WebServer/Documents”. The remainder of the instructions worked fine for me on Mac OS X 10.4.7
  5. To test your completed install, paste visit: http://localhost/validator/htdocs/

2. Install Fink Commander

As part of the process of installing the validator, you have installed Fink. Fink commander provides a GUI interface to Fink, I suggest you install it as the next step.

3. Install wget

Using Fink Commander, download and install wget. This is a command-line utility that we will use to automate the downloading of files.

4. Create a ‘batch’ file

OK, strictly speaking not a batch file, but a text file of urls for wget to request. We must first take our list of files and process the text for form suitable urls. For this I suggest the following steps…

In the terminal window, use the following commands…

Using the terminal window, navigate to your local webroot folder.To generate a single column list of all the files within webroot we can use the command…

ls -1

We can send the output of one command directly to the next command using the pipe symbol “|”. Ultimately we wish to create a file containing full urls to the files we want to process. So the next stage is to prefix the filenames with the start of the url. We can do this by ‘piping’ the results from ls into awk. Then finally directing the output to file sourceURLs.txt which will be created up one level so as not to infect the webroot. So on one line…

ls -1 *.asp |
awk '{printf"http://localhost/validator/htdocs/check?
uri=http://www.yourdomain.com/%s\\\n",$1}'
 > ../sourceURLs.txt

Note: Currently I don’t have style sheet control on this blog. The above 4 lines should be typed into your terminal as a single line.

5. Process the urls

  1. move up one level so your working directory contains both sourceURLs.txt and the webroot folder…
    cd ..
  2. create a new folder to contain the validation reports…
    mkdir validationReports
  3. change to that directory
    cd validationReports
  4. execute wget using sourceURLs.txt to create validation reports of each page
    wget -Ei ../sourceURLs.txt
  5. The current folder now contains one html file per validated file. Open them in your browser to check the results.

mac flash switch

I recently had the need to be able to switch player versions on the mac, and was very grateful to have found Mike Chambers‘ “Flash Player Switching on Mac” entry. Following the instructions in that entry may well be all you need. Be sure to read comments IV and V – they are important!

In my own set up I made a couple minor alterations to ease things in my own mind (to be read in conjunction with Mike’s article)…

  1. With respect to setting up the ‘soft-link’ or alias to “Internet Plug-Ins” I find an alias name of “InternetPlug-Ins” less likely to cause confusion than the more generic “plugins”. (Norton utils for example creates a “Plug-ins” folder within /Library)
  2. Similarly to avoid any confusion within the InternetPlug-Ins folder which in my case contains loads of files, I created a sub-folder “flashplayers” into which I placed the version folders.

So my resulting folder/file structure is as follows…

/Library/InternetPlug-Ins/
  Flash Player Enabler.plugin
  Flash Player.plugin
  flashplayer.xpt
/Library/InternetPlug-Ins/flashplayers/7
  Flash Player Enabler.plugin
  Flash Player.plugin
  flashplayer.xpt
/Library/InternetPlug-Ins/flashplayers/8
  Flash Player Enabler.plugin
  Flash Player.plugin
  flashplayer.xpt
/Library/InternetPlug-Ins/flashplayers/9
  Flash Player Enabler.plugin
  Flash Player.plugin
  flashplayer.xpt

The idea being that the three files currently in /Library/InternetPlug-Ins represent the currently active version of the player.

As my folder structure is different to that of Mike’s, my script is slightly modified…

#!/bin/bash
#
# Script to change the flash player
#
if [ $# != 1 ]; then
  echo "Usage: $0 name-of-player-version-dir"
  exit
else
  plugin_dir='/Library/InternetPlug-Ins'
  np_dir="$plugin_dir/flashplayers/$1"
  if [ ! -d $np_dir ]; then
    echo "$np_dir does not exist."
    exit
  fi
  cp -rv $np_dir/* $plugin_dir/
fi

Finally if you are not familiar with writing and running scripts via the terminal, two things to bear in mind…

  1. Placing your script file in a folder picked up by the path, will ensure it is available to you whatever is your current working directory. In my case I use the default tcsh shell and cfp is placed in my /Users/username/bin directory. This is added to the path in my via my .tcshrc file with the line
    setenv PATH "$PATH":bin
  2. Make sure you set the executable flag on the script file:
    chmod +x cfp
  • Latest

  • View Paul Evans's profile on LinkedIn
  • Twitter

  • Categories

  • Archives