Last week, I took part in a recording of The Flex Show that centered around Apache Flex and the state of Flash in 2012. I thought it was a pretty interesting discussion – a lot of good points were brought up and you can listen to the entire recording from the show website:
Flexing into 2012 w/ Joseph Labrecque and Mark Ehlert: The Flex Show Episode 159

Apache Flex Re-branding Initiative

Submit your design to the Apache Flex Logo Contest!

On the 31th of December, 2011, the Apache Software Foundation has accepted the Flex SDK into incubation. Apache Flex is now a community project managed by Apache (ASF). The migration from Adobe to Apache involves a re-branding and you can contribute by proposing the new Apache Flex logo.

Such is the case with the email reproduced below regarding Flex. I’ve asked permission from the individual author but have blanked out his name for reasons of privacy.

Greetings Joseph.
I have several decades of programming experience on desktops and (in the old old days) mainframes, using a variety of languages and technologies.

I am interested in application development for mobile platforms, both Android and the Apple platforms. However I am unable to find anyone who can give an unbiased and straightforward answer to this question: Is the Adobe Flex platform (1) a good choice to devote my limited time resources to for learning mobile development (2) is it or is it not true that the Adobe Flex platform is dying / going away / not really a good choice etc. etc. etc.

Would you be kind enough to give me some guidance regarding this? I don’t have enough time available to learn every technology so I must focus and get the biggest bang for my buck.

What do you recommend?

Thank you so much for your guidance with this.

-Xxxxx

My response [though slightly modified for this public post] follows.

Hi Xxxxx.

I don’t think anyone has 100% fool-proof, solid-as-stone answers around this just yet… but I’ll answer you the best I can.

1) I believe that AIR/Flex is still quite valuable for mobile apps. Buried amid the 11/9 announcements is a repeated statement that Adobe is “doubling-down” on AIR for mobile. One of the reasons cited for dropping mobile Flash Player in the browser was to divert resources to mobile AIR. Furthermore, Adobe’s new line of Touch Apps for Android are (almost) all built upon AIR for Android (though my understanding is that Flex was not used).

2) Flex is now an Apache incubator podling. Assuming that the Apache Flex team is able to organize everything enough to put out a release or two (normally achievable over 4-6 months), the project is expected to graduate to full Apache project status – putting it on the same level as ANT, Tomcat, HTTPD, and other well-known, popular projects used worldwide. Note that PhoneGap was also contributed to Apache by Adobe directly after the Nitobi acquisition – so this is by no means a death sentence or dismissal of the framework.

With Flex in the hands of the wider community, there are actually more resources available in light of the number of individual contributors. Even if not an Apache contributor yourself, if you have a patch for Flex that would be useful for others – get in touch with a contributor to see whether they might see value in the patch and perform the contribution in your stead. Don’t forget that a number of contributors are Adobe engineers and that they the company has stated that even though the runtimes are still under their care – they will align releases in light of what is going on at Apache.

I am confident that we will see some great things come out of the Apache Flex effort from members of the Spoon project and the greater community.

I hope this is helpful.

-Joseph

I hope this is useful for others out there. If you want to gather information on-the-ground, be sure to check out the 360|Flex conference in April!

Unfortunately, the recording was problematic and we only have the first 20 minutes – but it still contains some good information and discussions.

The recording…
Rmaug_12/6/11 by realeyes media

[this is a post from 2007 in light of Adobe's announcement on 11/11/11]

Heh… really…

http://www.spoon.as/

Contribute to SPOON and see what happens!

Scenario: Using Flex 4.5 and the default Spark theme, you provide a button with both a “chromeColor” setting and assign it an Icon. The Icon is rendered almost transparent and looks nothing like what you’ve exported from Photoshop, Fireworks, or whatever. The image below demonstrates both how the icon should appear (top) and how it appears by default (bottom).

Good Icon / Bad Icon

I’ve mentioned that I’ve encountered this before. Well… for the current project, it really is a big deal. I needed to find a solution to this and the answer is not at all readily available. Since the ability to include an icon was not included in the initial Spark release, performing a search on Google will mostly pull up workarounds for this. Now that icons are officially supported in Spark Button components, this is not a big deal… yet we still have the problem of the icon showing up all funky.

I reached out on Twitter, thinking there must be someone out there that had encountered this. Dan Florio pointed out that it was likely the chromeColor style setting that was causing the problem. After giving this a good look, I did verify that the icon seemed to be inheriting styles off of the chomeColor even though the Label element within the Button was not. Weird… but it definitely gave me something to work on.

Anyhow. Here is what I found that does fix this problem.

1. Create a new Flex application with the default Spark theme.
2. Add a Button with an icon defined, as well as the chromeColor attribute:

   <s:Button label="BOOKMARK" chromeColor="#000000"  icon="@Embed('mini_bookmark.png')"/>

   This will render the icon barely visible.

3. Now you must create a new Skin class based off of spark.skins.spark.ButtonSkin and assign this to the skinClass attribute of the Button
4. Within this class (around line 43) is the following declaration:

   static private const exclusions:Array = ["labelDisplay"];

5. The icon in a Spark Button has the ID of iconDisplay. We will add this to the exclusions Array:

   static private const exclusions:Array = ["labelDisplay", "iconDisplay"];

6. Presto! Everything looks classy!

Hopefully those reading this did not need to spend over an hour wading through the default Spark component and skin declarations to locate this :)

The Flex Show

An interview I did with The Flex Show, back in December 2010, is now available!

On the show, we talk about the use of Flex in higher education – specifically focused on projects I’ve been involved in at the University of Denver. We also go over the Adobe Education Leader program and chat about the wider Flex-in-education community. There is even some talk on mobile application development, the implications of tablet computing in education, and even some AIR for TV!

Toward the close of the episode; I talk about my upcoming book and give mentions to CodeBass, Emergent Collective One, 6Threads, and other projects.

Listen here: Flex in Higher Education: The Flex Show Episode 132

BlazeDS can work with Spring MVC

You can grab the latest build of Spring from:
http://www.springsource.org/

You can grab the latest build of BlazeDS from:
http://opensource.adobe.com/wiki/display/blazeds/BlazeDS

1. You will already have a dispatcher servlet entry in your web.xml for Spring MVC similar to the following:

   <servlet>
   <servlet-name>spring</servlet-name>
   	<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
   		<load-on-startup>1</load-on-startup>
   </servlet>
   <servlet-mapping>
   		<servlet-name>spring</servlet-name>
   		<url-pattern>*.do</url-pattern>
   </servlet-mapping>

2. Be sure to include the following JAR packages in the /WEB-INF/lib directory of your project:
   • asm.jar
   • blazeds-common-3.0.jar
   • blazeds-core-3.0.jar
   • cglib-2.2.jar
   • com.springsource.edu.emory.mathcs.backport-3.0.0.jar
   • com.springsource.flex.messaging.services.remoting-3.2.0.3978.jar
   • org.springframework.flex-1.0.3.RELEASE.jar
   • commons-codec-1.3.jar
   • commons-httpclient-3.0.1.jar
   • flex-messaging-common.jar
   • flex-messaging-core.jar
   • flex-messaging-opt.jar
   • flex-messaging-proxy.jar
   • flex-messaging-remoting.jar
   • flex-rds-server.jar
   • xalan.jar
   • commons-logging.jar
   • cfgatewayadapter.jar
   • spring-flex-1.0.1.RELEASE.jar

To get BlazeDS integrated with Spring, complete the following steps:

1. Add the following lines to web.xml:

   <servlet-mapping>
   	<servlet-name>spring</servlet-name>
   	<url-pattern>/messagebroker/amf</url-pattern>
   </servlet-mapping>

2. Add the following lines to your servlet XML file:

   <bean class="org.springframework.web.servlet.mvc.annotation.DefaultAnnotationHandlerMapping"/>
   <bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"/>
   <flex:message-broker>
   	<flex:mapping pattern="/messagebroker/amf" />
   </flex:message-broker>

3. Create a file called “services-config.xml” and add this to /web-inf/flex:

   <?xml version="1.0" encoding="UTF-8"?>
   <services-config>
   	<services>
   		<default-channels>
   			<channel ref="my-amf" />
   		</default-channels>
   	</services>
   	<channels>
   		<channel-definition id="my-amf"
   			class="mx.messaging.channels.AMFChannel">
   			<endpointurl=http://{server.name}:{server.port}/{context.root}/messagebroker/amf class="flex.messaging.endpoints.AMFEndpoint" />
   			<properties>
   				<polling-enabled>false</polling-enabled>
   			</properties>
   		</channel-definition>
   	</channels>
   	<logging>
   		<target class="flex.messaging.log.ConsoleTarget" level="info">
   			<properties>
   				<prefix>[BlazeDS]</prefix>
   				<includeDate>false</includeDate>
   				<includeTime>false</includeTime>
   				<includeLevel>true</includeLevel>
   				<includeCategory>false</includeCategory>
   			</properties>
   			<filters>
   				<pattern>Endpoint.*</pattern>
   				<pattern>Service.*</pattern>
   				<pattern>Configuration</pattern>
   			</filters>
   		</target>
   	</logging>
   </services-config>

4. Import the RemotingDestination class and add the following annotations to any Java classes that will be used by Flash:

   import org.springframework.flex.remoting.RemotingDestination;
   @Service("flexService")
   @RemotingDestination(value="flexService",channels={"my-amf"})

5. If you are using Spring security, add the following line to whichever xml you are using to define security parameters so we can access message broker:

   <security:intercept-url pattern="/messagebroker/**" access="IS_AUTHENTICATED_ANONYMOUSLY" />

Now, to get Flex talking to Java through BlazeDS, we must configure our application as such:

1. Import the remoting event packages so that we can send data over AMF:

   import mx.rpc.events.FaultEvent;
   import mx.rpc.events.ResultEvent;

2. Now, in your declarations tag, set up a RemoteObject structure similar to this:

   <fx:Declarations>
   		<s:RemoteObject id="ro" endpoint="http://website.root/messagebroker/amf" destination="flexService" result="resultAMF(event)" fault="faultAMF(event)">
   			<s:method name="methodNameFromJavaClass">
   				<s:arguments>
   					<arg1>{arg1}</arg1>
   					<arg2>{arg2}</arg2>
   					<arg3>{arg3}</arg3>
   				</s:arguments>
   			</s:method>
   		</s:RemoteObject>
   </fx:Declarations>

   If you are not passing any arguments, you can simplify the setup as such:

   <fx:Declarations>
   	<s:RemoteObject id="ro" endpoint=" http://website.root/messagebroker/amf" destination="flexService" result="resultAMF(event)" fault="faultAMF(event)"/>
   </fx:Declarations>

3. Create methods to handle the result and fault events reported through our remote service:

   private function resultAMF(e:ResultEvent):void {}
   private function faultAMF(e:FaultEvent):void {}

4. To invoke a remoting call through BlazeDS AMF, simply invoke the specific method off of our remote object instance:

   ro.methodNameFromJavaClass.send();

That should be all there is to it.

If you want to test this quickly, here is some quick MXML to do so:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   width="600" height="400">

	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.rpc.events.FaultEvent;
			import mx.rpc.events.ResultEvent;

			protected function testAMF(e:MouseEvent):void {
				ro.helloWorld.send();
			}
			private function resultAMF(e:ResultEvent):void {
				Alert.show("BlazeDS Worked...", "Hot Shit!");
			}
			private function faultAMF(e:FaultEvent):void {
				Alert.show(e.fault.faultString, "Duck and Cover!!!");
			}
		]]>
	</fx:Script>

	<fx:Declarations>
		<s:RemoteObject id="ro" endpoint="http://website.root/messagebroker/amf" destination="flexService" result="resultAMF(event)" fault="faultAMF(event)"/>
	</fx:Declarations>

	<s:Button width="375" height="120" label="Test BlazeDS" click="testAMF(event)" fontSize="36" fontWeight="bold" horizontalCenter="0" verticalCenter="0"/>

</s:Application>

Note that this document was compiled from our internal experiences integrating BlazeDS and Spring MVC. This is what worked for us… we do not claim to be experts in this area – if you have any feedback, please let us know!

The Flex Show

Last evening, I was interviewed by Jeffry Houser and John Wilker of The Flex Show with a focus on Flex Development in Higher Education. We chatted about a general overview of Flex and education, some Flex projects I’m involved with at the University of Denver, a bit about the Adobe Education Leader program, and emerging areas like tablet computing and AIR on TV. At the closing of the interview I was able to plug a bunch of projects from this year including 6Threads and Emergent Collective One, and also talk up my upcoming book!

This episode should be available either at the end of this year or the beginning of 2011is now available!:
Joseph Labrecque Flex in Higher Education : The Flex Show Episode 132

• http://my.site.com/flex2gateway
• http://my.site.com/flashservices/gateway

I recently came across the problem where the URL Rewrite rules in IIS7 were blocking both of these URLs from being passed on and correctly processed by ColdFusion. The solution is to add the following two rules to your site definition and move them both to the top of the stack, above any other rules you may have. This will effectively allow both of these URLs to process normally and stop and subsequent rules from executing if the pattern matches.

You can also edit your site definition web.config file to add the rules there:

1
2
3
4
5
6
7
8
9
10

<rule name="flashservices/gateway" stopProcessing="true">
	<match url="flashservices/gateway" />
	<conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
	<action type="None" />
</rule>
<rule name="flex2gateway" patternSyntax="ExactMatch" stopProcessing="true">
	<match url="flex2gateway" />
	<conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
	<action type="None" />
</rule>

Again, be sure they appear before any other rules and you should be good to go! Flash on!

The utility I am building grabs over 10,000 video clip records from our media repository and then systematically goes through and renders a still image of each clip. There’s actually a lot more to it than that and I’ll probably either write about or present on some of the neat tricks I am doing with this app soon, but for the sake of this article this is all you need to know.

I’m using s:VideoDisplay to grab data from an RTMP stream and also use the events present to manage the system method calls. Should be no big deal- but once the application hit 500-1000 out of the 10,000+ records, it would simply crash out. No good.

Using the Windows Task Manager, I could watch the memory usage in ADL skyrocket as each video was processed into a still image. Obviously something was up. Using the profiler in Flash Builder 4 I was able to isolate the problem to the org.osmf.* classes being used by the Spark VideoDisplay component.

It’s important to note here that while Flex 4.1 is certainly release quality, it (along with Flex 4.0) was released with components based on beta OSMF code. Flex 4.5, while not final by any means, does include the final OSMF 1.0 classes. I was able to download and compile the same project with Flex 4.5 and can happily say I have had no more memory leaks whatsoever. The application is running like a champ and processing thousands of videos without issue. Windows Task Manager shows that the memory used by ADL is being properly released and all is well.

As a side note, I could have written my own video display based on flash.media.Video or even used mx:VideoDisplay… but I wanted to get to the bottom of this :)