In this article you will learn the world of Flash development with ASP.NET. I recently designed a website, which thoroughly covers all Flash to ASP.NET communication methods mentioned in this article, as well as a step-by-step introduction to ASP.NET development with C# using Visual Studio.NET, the best IDE and Adobe FlashCS.

Step 1

Open Adobe Flash CS. Create a new document by selecting Flash File (Action Script 2.0). You may be interested in Action Script 3 (AS3), but I choose Action Script 2 (AS2) for ease of understanding. Just come to me and I assure you that you will become a good Flash developer after reading this article. You will now see a single tab called ‘Untitled 1’ in Adobe Flash. After saving the file, the ‘Untitled 1’ text will be replaced with your preferred file name. I named it ‘AspFlash.fla’. Remember that FLA is a flash source file and your output movie will be SWF which will then need to be embedded in the ASP.Net ASPX file.

Adobe Flash divided into several windows, don’t get confused. You do not need to know all the features of the window. Start with the left window called ‘Tools’, in the top middle window called ‘Timeline’, the next lower window called ‘Scene’, the next lower window called ‘Properties’ and the rightmost window divided with many windows ‘Color’, ‘Align’, ‘Components’ and ‘Library’. Those entire windows can be enabled/disabled via the ‘Window’ menu. Look at the ‘Scene’ window, which will be your layout area. From the ‘Properties’ window you can change the colors and size as per your requirements.

Step 2

Now add some component from ‘Components’ window, expand ‘User Interface’. Oh! a lot of things. Drag just one ‘Text Input’ and one ‘Button’ into your ‘Scene’ window and line them up correctly. Select ‘TextInput’ and put an instance name (eg TextInput1) in the ‘Properties’ window. Without the instance name, Action Script will not recognize any components. Do the same for the ‘Button’ instance name (eg Submit Data) and from the ‘Parameters’ tab, change the ‘Button’ label (eg Submit Data).

Step 3

Here we start the main part of coding. Select ‘Layer 1’ in the ‘Timeline’ window and press F9 (keyboard function key). You will see the ‘Actions’ window, where you write your AS code. Write or copy pests from the following codes.
SendData.onPress = function() {
//Declare and initialize variable
var send_lv:LoadVars = new LoadVars();
//Assign value to parameter, like Asp.Net QueryString
send_lv.mydata = TextInput1.text;
//Sending data
send_lv.send(‘default.aspx’, ‘_self’, ‘GET’);
};

The LoadVars object is used to exchange data between flash and the server. The LoadVars object is capable of sending data to the server for processing, loading data from the server, or sending data to the server and waiting for a response from the server in a single operation. The LoadVars object uses name-value pairs to exchange data between the client and the server. The LoadVars object is best used in a scenario that requires two-way communication between the Flash movie and server-side logic, but does not require large amounts of data to be passed.

The send method sends the variables in the send_lv object to the specified URL. The string is posted to the URL using the HTTP GET method so that ASP.Net easily reads the mydata variable in the QueryString.

Step 4

Write or copy the following code to read the QueryString in Flash – Action Script 2. In Action Script 2 there are no methods like those provided by ASP.Net, so I wrote the following code to get the QueryString from the URL. The _url method returns the URL of the ‘AspFlash.swf’ file that was loaded with the ASPX page.
//Reading QuaryString
myURL = this._url;
myPos = myURL.lastIndexOf(“?”);
if (myPos > 0) {
var myRawParam = myURL.substring(myPos + length(‘mydata=’) + 1, myURL.length);
myParam = myRawParam.toString().split(“‘”).join(“”);
if (myParam!= undefined){
InputText1.text = myParam;}

step 5

Save your file from the File menu. Now we need to make the final SWF move and embed it into the ASPX page. In the File menu, click on ‘Publish Settings’ and you will see a new window containing three tabs (Formats, Flash and HTML). In the Formats tab, check the Flash and HTML types, so you can get the SWF embed code in the HTML page. Now hit the ‘Publish’ button to build the final move. If no error occurred, flash will give you two files (eg ‘AspFlash.swf’ and ‘AspFlash.HTML’) in the root folder where the ‘AspFlash.fla’ source file is located.

step 6

Now start Visual Studio.Net (VS) and create a new website and name it ‘AspFlash’. VS creates a default page, namely ‘Default.aspx’. From the solution explorer, double click on the ‘Default.aspx’ file to see the markup code (also called inline code) like the following.

Now copy the files ‘AspFlash.swf’ and ‘AspFlash.HTML’ to the root directory of your web. I am referring to ASPX, the SWF files must be located in the same directory. Open the ‘AspFlash.HTML’ file and copy the entire ‘object’ tag and paste it inside the ‘Default.aspx’ file tag.

After pasting the above code, few changes are needed in the ‘AspFlash.swf’ parameter as below. Look at the ‘AspFlash.swf?mydata=”’ line we added. Flash reads _url data with mydata that will be provided by ASP.Net later.

Finally, add two standard ASP.net controls to the ‘Default.aspx’ page, ie TextBox and Button. Change the button’s text property to ‘Submit Data’.

step 7

In this step, you need to open the ‘Default.cs’ file by clicking ‘View Code’ pointing to ‘Default.aspx’ from VS Solution Explorer. By default, VS added the Page_Load event procedure. You need to add some text in the Page_Load event procedure along with the button1_click event procedure like the following.

protected void Page_Load(object sender, EventArgs e)
{if(!IsPostBack)
yes (Request[“mydata”]!= null)
textbox1.Text = Request[“mydata”].Chain();}

protected void button1_Click(object sender, EventArgs e)
{Response.Redirect(“~/default.aspx?mydata=” + textbox1.Text);}

step 8

Now create the website using F5 (keyboard function key) and type a text into the Flash movie and click ‘Send Data’ to send Flash data to the ASPX page. You will see the ASPX text ‘TextBox’ changed with your Flash text ‘TextInput’.

In the same way, write a text in the ASPX ‘TextBox’ and click the ‘Send Data’ button to send ASPX data to the Flash movie. Enjoy the technical communication between ASP.Net and Flash. If you need further help, feel free to contact me by email.