The Custom Tool

Step 01> First import the Dekho Simulator project into Flex Builder. See the section titled “Dekho Simulator” in this document for details. To create a custom tool for Dekho you will need to create it as an MXML Module.

Step 02> Once imported, expand the src folder and then the ExampleCustomTools folder.

Step 03> Now create a new folder with the name of the custom tool.

Step 04> Right-Click on the ExpandCustomTools folder and then select the New and then Folder options.

Step 05> Give the new folder a name and click the Finish button


Step 06> Right-Click on the newly created folder and then select New and then MXML Module options.

Step 07> On the New MXML Module form enter a name for the custom tool. Then select the “Do not optimize (module can be loaded by multiple applications)” option. Finally click the Finish button

Flex Builder will then create the new module and open the new mxml page containing the mx:Module tag.

Now start creating the contents of the custom tool. You can use any of the available MXML tags, ESRI Flex API tags and ActionScript by placing it between the mx:Module tag. The next image shows the source for a very simple form.

Once the custom tool is created or to view the progress of the custom tool and debug it you can click on Flex Builder’s debug tool. When the project has been built and launched, click on the “set channel and get settings” button. Then making sure you have the right folder and custom tool name in the “Custom Tool URL:” text box click on the “load custom tool” button. The custom tool should then be loaded and displayed in the browser window. For the above example the custom tool will be displayed in the top left corner.

How to program in Flex is beyond the scope of this documentation. The Dekho Simulator project does have some example custom tools located in the ExampleCustomTools folder. The example tools cover a range of functionality like Flex drawing based on map to pixel and pixel to map coordinates (FireSpotter), capturing map click events (GetMapClickEvnet), using the ESRI Flex API drawing tools to add graphics to the map (DrawOnMap), and how to call the Dekho server methods using an AMF channel and BlazeDS (CallDekhoUsingBlazeDS).


The above examples also show how custom tools can communicate directly with the Dekho client and how the Dekho client can communicate with them. The communication is done by a set of publically available functions in both the Dekho client and the custom tool. See the remainder of the Dekho Client Flex Extensions API section of this document for the list of functions and their details.


If you don’t want to use BlazeDS for communication with the Dekho server methods, they are also available via SOAP. However SOAP requests and responses require XML and working with XML in Flex is resource intensive, i.e. slow.




PLEASE NOTE: A custom tool can also be created in a separate project to the Dekho Simulator project. Make sure the custom tools project is set to the same Flex SDK version as the Dekho Simulator. See the Dekho Simulator section in this document on how to set a projects Flex SDK version.




If the tool has been created as a separate project, make sure it’s opened in the same Adobe Flex Builder application as the Dekho Simulator. If it’s not and the Dekho Simulator is run in debug mode, loading the custom tools debug swf file will result in a security error.

Step 08> If you then continue executing the code the web browser will display an “Error Loading Custom Tool” message.


Step 09> To avoid the security error and be able to debug the custom tool when it’s in a different project, import it into the same Flex Builder application as the Dekho Simulator project

Once the project is imported, open one of its files to force Flex Builder to load the custom tool project.

Step 10> When the custom tool project has loaded, run the Dekho Simulator in debug mode. Then try loading the custom tools bin-debug swf file again. It should load and allow for debugging.

Adding the Custom Tool to Dekho