Category Archives: Adobe

Invoking RESTful and AMF services from Flex using WCF / MVC / FluorineFX in .NET

Rich Internet ApplicationsI’ve written a small Rich Internet Application using Flex and [dot]NET. Data from [dot]NET is returned to Flex using different technologies being MVC, WCF and FluorineFX.

In dot[NET], there are two MVC controllers, RestJsonController and RestXmlController. They both have about the same logic, but one returns Json, the other XML. There’s also a UserService with methods made public using both WCF and FluorineFX. For WCF, REST is used with both GET (WebGet) and POST(WebInvoke).

On the Flex side, REST calls are being done using URLLoader and URLRequest.  There are examples using GET and examples using POST. You’ll also see that URLVariables, Json strings or XML are used to transport data. For the AMF calls, a RemoteObject is used to call a FluorineFx gateway.

Flex only supports the HTTP Verbs GET and POST, so full REST isn’t really possible.

I created the example in Visual Studio 2010 (ASP.NET MVC 3 Web Application) and Flash Builder 4.5 Premium (SDK Version 4.5.1). You can easily open the .NET solution. The Flex source is configured to call localhost on port 53259, so make sure the .NET WebApp is started on that port (or change the Flex source code). For the Flex project, import it using ‘Existing Projects into Workspace’. Since Flash Builder has a problem with relative paths (adobe, please have a look at that), you’ll have to change some things. In the properties of the project, go to Flex Build Path, and set the Output folder to [root example project]/FlexDotNetREST/Flex, being the Flex folder under the root of the .NET Web App. Then right click FlexRest.mxml –> Run As –> Run Configurations… URL or path to launch should be http://localhost:53259/Flex/FlexRest.html.

A zip of the example can be downloaded here.

As I wife recently gave birth to a second daughter, I haven’t got the time anymore to blog a lot. So, explaining this will be difficult. But you have the source and I’ve written a lot of comment in the source it self. So check it out and let me know if it was useful.

Be sure to go and read some articles and blog posts on REST, especially the difference between low REST and high REST (lo-REST – hi-REST). A lot of developers/managers/companies think they have a RESTful api, but actually, they don’t.

http://blog.jonnay.net/archives/665-Hi-Rest-and-Lo-Rest,-two-broken-halves-of-the-tower-of-Babylon.html
http://lesscode.org/2006/03/19/high-low-rest/

WCF REST
REST in Windows Communication Foundation (WCF)
A Developer’s Introduction to Windows Communication Foundation 4

Continue reading

Flex Icon

Packaging a Flex Mobile Project using Ant for Android, BlackBerry or iOs

Flex IconIf you want to package a Flex Mobile Project using Ant, you’ll first need to compile your project to get a swf. ADT is the tool need to package your application. First of all, if you want lots of information, I recommend installing the Adobe Community Help.

Remember you can also do this by creating a Release Build (right click project –> Export… –> Flash Builder –> Release Build) of your Flex Mobile Project.

Continue reading

Flex Icon

Compiling a Mobile Flex Project using Ant and launching the swf using the Air Debug Launcher

Flex IconFirst of all, compiling a Mobile Flex Project is not the same as packaging one. Compiling is creating an swf, packaging is creating a ipa or apk file (Android or iOs). I’ll deal with packaging in a later post. If you double click on a compiled Mobile Flex Project swf, you wont see a thing. If you want to see your swf in action, you’ll have to use the Air Debug Launcher, ADL. Off course, instead of using Ant, you can also use the command prompt or Flash Builder.

Continue reading

Flex Icon

Updating a Flex Mobile App on Android & iOs

Flex IconWhen I was first starting to look, I thought it would be done in the same way an Air Application is updated (see here and here for more info on updating air projects). Updating Flex Mobile Apps doesn’t work this way. Quote:
The AIR update framework is only supported in the desktop profile. It is not supported for extended desktop applications (applications installed with a native installer), and it is not supported on the mobile profile (iPhone applications written with ActionScript 3.0). Check the Updater.isSupported property at runtime to see if the update framework is supported.
If you would trace out Updater.isSupported in your Flex Mobile Project, is would return false.

Continue reading

firefox_icon

White screen when loading Flash in FireFox – GZIP problem

Last week at work we noticed a strange bug. When loading our Flex application in FireFox, we got a white screen. The swf was loaded in the browser, but no content was shown, just an empty white screen. Very annoying. Debugging wasn’t possible because no connection could be made between the swf file and Eclipse. In all other browsers we had no problem with the application and all content was shown.

Now, after searching for some hours, we found that the problem had to do with IIS and FluorineFx ecnrypting the swf with GZIP. When we tunred GZIP off for swf files, things worked again in FireFox. Our application can be configured to work with WebORB or with FluorineFx and with WebORB we didn’t have this problem (the app worked fine in FireFox with WebORB). Computer problems always have a logical explanation, one of the reasons why I like IT so much. IT and my wife balance out great!

What I don’t get so far is if this is a problem with IIS 7(.5) not ecrypting properly the swf for FireFox or if it’s a problem with FireFox not decrypting the file properly.

I think it has to do with FireFox because in Charles I do not see differences in the Requests and Responses from FireFox and Chrome.

Continue reading

Flex Project in IntelliJ with Charts

This year, my brother, Jef Monballieu, graduates as Civil Engineer. For his thesis, he needed a program that calculated the different criteria for building roads. Charts were ideal to show why certain materials were better and how they compared to each other. Starting from an Excel file, we first created the model, then implemented all the calculations and finished with creating tables and charts. Thanks to the help of my brother, we were able to create this application on short notice.

Normally I work with FlexBuilder, but for this project I wanted to experiment with IntelliJ. I already had experimented with BlazeDs in IntelliJ, but I had never really created a project. IntelliJ is great, but it’s really hard to compare it with FlexBuilder because the project I’m doing in FlexBuilder is way bigger. I would need to check FlashBuilder to be able to compare the features and import the big project in IntelliJ to see how compiling compares to each other.

The new Spark architecture was strange in the beginning, especially because now you have all these namespaces mixing together. Mx, s, fx, … I really should check some online resources and videos because now I just experimented while doing the project. Not a lot of time to go and search for things, best practices, …

No backend was used, but setting BlazeDs (or GraniteDs) up in IntelliJ is really a piece of cake. Coming from .NET world, it does feel strange and it’s a totally new world.

The project can be found here, but I think not a lot of people will understand it. There are three states: in the first general parameters need to be entered, in the second some specific parameters need to be entered and in the third all tables and charts are shown.

I still have one big problem and that’s loading the application. Apparently a couple of swf files are downloaded before the application is shown. I guess that these swf files should be included when compiling, but I haven’t managed to do this. If one of you knows how to resolve this, please let me know. Now the application is loading toooo slow. Maybe it’s a configuration in IntelliJ? I have searched online but haven’t found anything, so I guess it’s not a bug in Flex SDK 4.

Flash game Eggie (WebORB, PHP and MySql)

Together with a colleague Piet Santy (aka Ploem), who did the artwork, we created a Flash Game for a friend of ours. Elections are up in Belguim and Dominique Dehaene needs votes! One way to get some attention and publicity is off course the internet. It was great to work with CS5, but I did have some problems with code completion and Flash Builder. Also, in Flash Builder, lots of classes weren’t found. I probably haven’t searched enough to find out the solutions of these problems.
I really like creating once in a while such a small game. No design patterns are involved, no architecture, just programming and quickly seeing result! With WebORB for PHP together with MySql I created a TOP 10 highscores. When the game finishes, your score is stored in the database and top 10 is fetched and displayed. Setting up WebORB for PHP was very easy. I just had some problems with a function that I called Echo, which is a reserved word in PHP and off course not knowing the language PHP. But everything was created very fast.

The result can be found here.

WebBrowser Control – Flash DropDown Fix (Framework 2.0)

For a customer of ours we had to create a standalone browser that could load assessments for candidates. It couldn’t be loaded in a browser because the user would have access to the computer. Anyway, the .NET WebBrowser component loads a html page with the swf that starts the assessment.
The problem now was that Flex/Flash dropdowns didn’t seem to work. A candidate could click on the dropdown, the items were shown but when an item was clicked, the dropdown closed and the item was not selected. On my laptop I couldn’t reproduce the bug.

After searching someone pointed me in the right direction on StackOverflow and with the help of this question on a vbdotnetforum, I finally managed to find the problem and two solutions.

Problem

It seems that when clicking the dropdown, a Flash layer is displayed on top of the dropdown with the items. At that moment, the WebBrowser seems to take over the focus. When clicking on an item, you are actually clicking on the whole Flash Application, giving back focus to the swf, but not selecting an item. Because Flash gets back the focus, the dropdown closes automatically.

Solution 1

The problem only occurs when the client pc has .NET Framework 2.0 installed and nothing higher. When installing .NET Framework 2.0 SP1 or 3.5, the problem is resolved.

Solution 2

By extending the WebBrowser component and overriding one function, you can resolve the problem without upgrading .NET Framework. Use this Class as your WebBrowser and everything should work fine (the VB implementation can be found at the link above):

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
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
using System.Windows.Forms;
 
namespace SaltoExplorer
{
///
 
<summary> /// When clients have .NET Framework 2.0 installed and
/// nothing higher, then there's a problem that not item
/// can be selected in Flex DropDowns.
/// It's a problem with focus. From the moment
/// .NET Framework 2.0 SP1 or higher (like 3.5) is installed,
/// the problem is resolved.
/// Extending the WebBrowser component can fix this problem,
/// but it should only be done if the problem occurs
/// (with .NET Framework 2.0)
/// See
/// http://www.vbdotnetforums.com/vb-net-general-discussion/18563-webbrowser-control-2-0-framework-flash-fix.html
/// http://stackoverflow.com/questions/2205924/problems-flashflex-in-net-webbrowser-component
/// </summary>
 
&nbsp;
 
public class Edumatic3WebBrowser : WebBrowser
{
private const int WmLbuttondown = 0x201;
private const int WmRbuttondown = 0x204;
private const int WmMbuttondown = 0x207;
private const int WmMouseactivate = 0x21;
 
private ContainerControl FindContainerControl()
{
ContainerControl cc = null;
Control ctl = this;
while(ctl != null)
{
var tempCc = ctl as ContainerControl;
if(tempCc != null)
{
cc = tempCc;
break;
}
ctl = ctl.Parent;
}
return cc;
}
 
protected override void WndProc(ref Message m)
{
switch (m.Msg)
{
case WmLbuttondown:
case WmRbuttondown:
case WmMbuttondown:
case WmMouseactivate:
if(!DesignMode)
{
var cc = FindContainerControl();
if(cc != null &amp;&amp; cc.ActiveControl != this)
{
//Probably giving focus to the Swf
cc.Focus();
}
}
base.DefWndProc(ref m);
break;
default:
base.DefWndProc(ref m);
break;
}
}
}
}

Oldschool Flashing

After some years of Flexing I’ve restarted to Flash. I’m creating a flash site for Peter Platel (know from ‘Kleren maken de man‘) and it has been lots of fun and lots of frustration. Luckily I’ve gotten support from Ward De Langhe, one of the best Flash Developers around! (Check the Art he’s creating with Flash! Awesome!).

Four and a half years ago I started working with Flash mainly to created cd-roms (in a Zinc of Director shell — even more frustrating). After a while you get to know that Flash isn’t always logic. Sometimes I would search hours for a bug just to find out that the bug was in Flash and all you could do is work around it. Other things I remember from working with Flash:

  • Debugging is a disaster because there is no debugger. You had to put traces all around to find a bug and those traces would only appear when you were building in Flash. So SOS logger was used to get some logs when you’re site was online for example.
  • Quite often the library in Flash was like a battlefield after a few weeks of development. And once a battlefield is wasn’t easy to find anything back.
  • Putting code on the timeline in Flash was a way of punishing the developer that came after you… We had projects from a previous developer that were like a puzzle with code all around… we called it ‘name of developer’-code… :-)
  • Creating flash content that would adapt to the size of the stage is a hard one. Certainly when you worked with Flex were Layout Containers are part of the sdk going back to Flash is a adventure. With the help of some basic classes created by Ward De Langhe I created a liquid flash site. Some bugs are left in my flash site but they will be resolved in the near future. For a project I’ve worked on (Edumatic) we even created Layout Containers in AS2 (based on the Layout Containers in Java).

So, this in mind, I went on creating this Flash Site. Now I have:

  • Still no debugger but, but I started an ActionScript Project in FlexBuilder parallel to the Flash project. This ActionScript Project uses assets from an Swf file. This ActionScript project has the adventage that it can be debugged. The flash project still can’t be debugged. Another thing I’d like to try is a Flex Project for creating a Flash Site. I wonder if this will work out… (to be continued).
  • My library is kept clean from in the beginning! If you import graphics from Illustrator, you sometimes get hunderds of groups in groups in groups… I always clean them out first.
  • Almost no code is found in the fla file. All code is in classes, except sometimes a stop() for animations (I could also do this in code but in this case I like it more in the fla).
  • The liquid design isn’t easy when you’ve never done it. For example, if you have a Tween that’s dependent of the stage size and during the tween you the stage is resized, you can get in trouble.
  • Thx to some classes provided by Ward, the site is localized. For each language there’s a Xml file containing the text content.

I’ve tried to use Spring.Actionscript in the project but the Ioc framework needs some classes from the Flex Sdk so I could not compile it. Anyway, to keep the size small of the swf it’s maybe better to leave it out.

Another thing I learned is that it’s a lot of work compared to the result. What seems little work for the customer or graphical designer sometimes takes a lot of hours… But I’m happy with the result for now. The site is far from finished so check it out in the next months as new parts will be added.