The Flash Studio

Monday, January 31, 2011

Adding alternative content for SWF files

All devices and platforms do not support flash. You need to supply alternate HTML for users to view additional content like phones and tablets.

Method 1: Add alt text and images inside the <object> tag

</object>

Method 2: Using SWFObject 2 & XHTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Alternative Content using SWFObject</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("about.swf", "mySWF", "100%", "100%", "9.0.0", false, {},{},{scale:"noscale"});
</script>
<style type="text/css">

</style>
</head>
<body>
<div id="mySWF">
<img src="myAltPic.png" height="300" width="300" alt"Image version of the SWF" />
<p>Alternate Text here.</p>
</div>
</body>
</html>

Get SWFObject 2

Method 3: Using SWFObject 2, PHP & XML

Use this method as a back up if your SWF file has a datagrid connected to a database (Flex). You can use PHP and SQL/XML to populate the area. There are many different ways to do this, and this code just shows how you can incorporate simplexml into the alternate area.

<?php
if (file_exists('myList.xml')) {
$xml = simplexml_load_file('myList.xml');
print_r($xml);
} else {
exit('Failed to open test.xml.');
}
?>
</p>
</div>
</body>
</html>

Monday, December 27, 2010

Free Flex Components

1. FlexLib

- Open Source Flex Component Library

The FlexLib project is a community effort to create open source user interface components for Adobe Flex 2, 3 and 4.

Current components: AdvancedForm, Base64Image, EnhancedButtonSkin, CanvasButton, ConvertibleTreeList, Draggable Slider, Fire, Highlighter, HorizontalAxisDataSelector IconLoader, ImageMap, PromptingTextArea, PromptingTextInput, Scrollable Menu Controls, SuperTabNavigator, Alternative Scrolling Canvases, Horizontal Accordion, TreeGrid, FlowBox, Docking ToolBar, Flex Scheduling Framework

2. reusable-fx

The reusable-fx is a library of reusable flex components.

* ChartScroller adds scrolling and zooming functionality to CartesianChart
* DataGrid2CSV enables export of data displayed in DataGrid to CSV format
* MDataGrid is an extendible DataGrid with client-side filtering and searching
* SlideDown, SlideLeft, SlideRight and SlideUp defines slide effects

3. The ActionScript Data Provider Controls library (ASDPC)

Provides a set of standard user interface components written in ActionScript.

Easy and extensive customization (functionality, appearance)
Platform, framework and project neutrality (out of the box usage)
Generic data intergration (data provider interface architecture)
High-performance
Unit tested and well documented
Open-source licence MIT

ADOBE Resources

Monday, December 20, 2010

Tour de Mobile Flex

Tour de Mobile Flex is an Android application for exploring the new Flex mobile capabilities. You can start building Flex applications for mobile devices with the Flex Hero prerelease.

To install on your Android device, search the Android Market for "Tour de Mobile Flex"
Download the Flash Builder project with all samples from http://flex.org/TourDeMobileFlex.fxp
You must use the preview release of Flash Builder (Hero) to compile the source

Download the Tour de Mobile Flex Flash Builder Project (FXP) or get the code from github.

Monday, November 29, 2010

ActionScript 3 Objects, Properties and Methods

Objects

ActionScript objects provide a means of moving graphic elements dynamically, building applications, organizing data, and more. You accomplish these tasks by using or setting object property values and invoking object methods.

Global objects

In your Flash application there are some objects that are classified asglobal, or unique to the movie as a whole. The mouse, for example, is defined as a global object, like a Mouse object. The mouse is global because you can only have one mouse in your application and can not create an instance of it. Objects like movie clips, text fields, and sounds must be created with components and instances to be used.

Flash Global Objects:

Math
Accessibility
Key
Mouse
Selection
Stage
System

Object classes

A class of objects represents a group of object instances within your project that share the same basic structure and functionality. For example, all movie clip instances belong to the MovieClip class of objects

import flash.display.MovieClip;
var myMovie:MovieClip = new MovieClip();

Properties

Certain objects, such as MovieClips for example, have properties and attributes which can be configured via ActionScript. Properties are simple attributes of the object, such as its width, its height, its horizontal position and its vertical position. In order for a property to be configured you need to use the dot (.) operator to access the property and the assignment (=) operator to set a new value for it.

var myMovie:MovieClip = new MovieClip();
myMovie.x = 300;
myMovie.y = 100;

myMovie is the object, x is the property, 300 is the value

Methods

Objects also have methods, or functionality actions that the object can perform. If your object is a video object, you can tell this object to play the video. Any action that the object can perform is called a method.

import flash.media.Video;

var myVideo:Video = new Video();
myVideo.play();

Some methods require additional information to execute the action. The Loader Class is responsible for loading external graphical elements into your movie, in order for it to perform the .load() method you must specify the URL of the file to be loaded:

import flash.display.Loader;

var myLoader:Loader = new Loader();
myLoader.load(new URLRequest("MyPic.png"));

Saturday, November 20, 2010

Create A Basic Contact Form With PHP and ActionScript

Creating the Form

A TextInput Component for the email address of the sender named email_txt.
A TextInput Component for the email address of the sender named name_txt.
A TextField Component for the email address of the sender named message_txt.
A Button Component named submit_btn, and Labeled Submit Message.

flash email form

The PHP Code (mail.php)

<?php
$to = "myAddress@mySite.com";
$subject = ($_POST['senderName']);
$message = ($_POST['senderMsg']);
$message .= "\n\n---------------------------\n";
$message .= "E-mail Sent From: " . $_POST['senderName'] . " <" . $_POST['senderEmail'] . ">\n";
$headers = "From: " . $_POST['senderName'] . " <" . $_POST['senderEmail'] . ">\n";
if(@mail($to, $subject, $message, $headers))
{
echo "answer=ok";
}
else
{
echo "answer=error";
}
?>

The Button Event Handler

import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.events.Event;
import flash.net.URLVariables;

submit_btn.addEventListener(MouseEvent.CLICK, sendMessage);
function sendMessage(e:MouseEvent):void
{
var my_vars:URLVariables = new URLVariables();
my_vars.senderName = name_txt.text;
my_vars.senderEmail = email_txt.text;
my_vars.senderMsg = message_txt.text;

var my_url:URLRequest = new URLRequest("mail.php");
my_url.method = URLRequestMethod.POST;
my_url.data = my_vars;

var my_loader:URLLoader = new URLLoader();
my_loader.dataFormat = URLLoaderDataFormat.VARIABLES;
my_loader.load(my_url);

name_txt.text = "";
email_txt.text = "";
message_txt.text = "You have created a contact form with ActionScript 3.0 & PHP";

}

Adding Form Validation

Hide the submit button until the user types the word validate

var valid:String = "validate";
submit_btn.visible = false;
validate_txt.addEventListener(TextEvent.TEXT_INPUT, textInputHandler);

function textInputHandler(event:TextEvent):void
{
if (validate_txt.text = valid)
{
submit_btn.visible = true;
}
}

Pages