Archive → January, 2008
BlazeDS with Spring
With the release of BlazeDS from Adobe building your business logic in java just became a lot more accessible! In this post I’m going show the basics of setting up a Java, spring based application, then connecting to it from Flex via the flex.messaging.factory.SpringFactory . I’m going to keep the the domain (business logic) as simple as possible, and I’m not going to be persisting anything to a database. This is so I don’t get bogged down in details and can get straight to the point… connecting Flex to Java/Spring with BlazeDS…. so here we go!
What you’ll need.
- BlazeDS
- Spring Framework (I’ve used 2.5)
- Flex 3.0 (I’ll be using Flex Builder, but you are free to just use the SDK)
- Eclipse with Spring IDE plugin
- blazeds-spring-beta1.jar
The Steps!
Creating The Java
- Create a Spring project in eclipse named BlogExample and set the output folder to be war/WEB-INF/classes.
- Find the directory you unzipped the BlazeDS download into and navigate to the following directory {blaze install dir}/tomcat/webapps/blazeds/
- copy the contents of this directory into the new project (you should have copied two folders, called WEB-INF and META-INF. These folders contain the necessary libraries and config files for connecting to Java from Flex)
- Copy spring.jar file from {Spring unzip directory}/dist/ into the war/WEB-INF/lib directory of the project. The project now contains all the necessary library’s to connect Flex to Java. However as we are using Spring we will still need one more jar file which we will get in step 9
- Next you need to create your business logic, I have created a very simple POJO called SimpleBook.java, which contains two properties with getters and setters (you can download the complete project here which contains this simple class).
- Create a new Spring Bean Definition File called beans.xml inside the WEB-INF directory.
- Add the following lines to the new beans.xml file, it tells spring to instantiate SimpleBook and set its properties
<bean id=”myBook” class=”uk.co.ziazoo.example.domain.SimpleBook”>
<property name=”name” value=”my book” />
</bean> - Next we need to edit the services-config.xml and remoting-config.xml so that flex can connect to the application. Your can download mine from here (remoting-config.xml, services-config.xml). Be sure to change the endpoint in the services-config.xml to point to your local tomcat server. I have used the tomcat that come with the BlazeDS download as it comes pre-configured to work with BlazeDS.
- If you take a look within the services-config.xml you will see I am referencing a class named flex.messaging.factory.SpringFactory which doesn’t currently exist in the project. We can get this file thanks to http://www.igenko.org… here blazeds-spring-beta1.jar
- Once you have downloaded the blaze-spring-beta1.jar just copy it into the war/WEB-INF/lib folder
- Next its time to configure the web.xml file. The web.xml file that come with BlazeDS needs a little tweaking to get it to work with our spring app. Firstly the included file uses the older DTD based syntax, we need to change this to the newer XML scheme method. Once we have done that we need to change the <listener> property such that it fits the spring based development ideas. (The changes essentially allow Spring to instantiate the business classes, rather than letting Flex do it… this is crucial to the whole idea of Spring, and its called IoC, Inversion of Control). Once that changes are made the web.xml file should look like this web.xml
- The Java code is now complete, all that remains is to deploy it to the tomcat server, I have done this using Ant, blogging how to setup Ant and starting tomcat are all fairly in depth and very dependent on the system they are being installed on, so I’ll keep quite on that. If you are stuck I recommend reading the build.properties and build.xml files in my project.
The Flex
I am using Flex Builder 3.0, so these steps will vary for other IDS etc
- Create a new project and select the application type J2EE
- Set the root folder to to the context root of the java app withing tomcat ie /Users/Sam/Documents/blazeds_b1_121307/tomcat/webapps/blogexample
- Replace the contents of the main mxml file with the follow main.mxml
- Run the flex app.. and you should see the following

And thats your lot!!!
OOPS… forgot to upload the full Java code… here ya go Java code
Flex Cairngorm code example
Over the Christmas break I finally managed to claw an afternoon of free time together to knock up a little example application. Why bother? Well just about every client I go to meet and potentially work with wants to see some example code first… now since writing code is my job you wouldn’t think that was a very difficult task, but its not quite that simple. Often the projects I work on are very large, worked on by multiple programmers, and dependent on some server side code to run. Even when the projects are small enough to send to someone as an example I’m not even sure I have the legal right to-do so!
With the above in mind I though it was about time I created a little application that I could send around to plug my abilities etc, and you can see it here
A little about how it works
The app is built using Flex 3.0 and the Cairngorm framework. Data is pulled in via XML, and displayed using a simple image viewing component I created.
Why use Flex
Flex enables me to build the same breed of applications we have all been building with Flash for sometime… only with Flex we can do faster, more reliably, with a fuller api and using a decent IDE… whats not to like?
Why Cairngorm
Cairngorm is all about building complex RIA’s in a consistent MVC manner… adobe puts it like this “The Cairngorm microarchitecture is intended as a framework for Enterprise RIA developers”. As you may have noticed the little image viewer I’m using as my example code is no enterprise application, in fact it only has a couple of user gestures, I’m just trying to demonstrate my familiarity with the framework.
I think Cairngorm is very important to the Flex developer community, it offers a well proven methodology for building applications, which separates concerns, promotes testability and leads to very predictable, scalable solutions.
About the view
I wanted to build a little set of classes that would allow me to display items (which could be anything from products to images etc.) in a number of ways, and was simple to extend. The snappyviewer, which is the name of the component displaying the images is an implementation of those classes.
The main classes the view is built around are two interfaces IItemView and IItemDisplayer.
Both interfaces contain a function named display. The display function in IItemVIew is intended to delegate the displaying of items to the IItemDisplayer via composition. The display function in IItemDisplayer is implemented for various display types, ie, displaying items in a grid, or in a row (GridItemDisplayer & SlideItemDisplayer).
To change which type of view the IItemView uses I can set the IItemDisplayer though the dispayer setter function in IItemVIew and hey presto, the view is updated.
You can check out the code by right clicking on the application and selecting Source View.
Any feedback welcome
ps.. you can see the application here