Apr 9, 2014

Starling Framework - Start learning from beginning

Starling is an ActionScript 3 2D framework developed on top of the Stage3D APIs, available for the desktop in Adobe Flash Player 11 and Adobe AIR 3. Starling was designed for game development, but you can use it for many other applications. Starling makes it possible to write fast GPU accelerated applications without having to touch the low-level Stage3D APIs.
Most Flash developers want the ability to leverage GPU acceleration (through Stage3D) without having to write such higher-level frameworks and digging into the low-level Stage3D APIs. Starling is completely based on the Flash Player APIs and abstracts the complexity of Stage3D (Molehill). The result is intuitive programming for everyone.
Starling is designed for ActionScript 3 developers, especially those involved in 2D game development. To use it, you must have a basic understanding of ActionScript 3. Since Starling is lightweight, flexible and easy to use, you can also use it for other project needs, such as UI programming. The framework is designed to be as intuitive as possible, so any Java or .Net developer can begin using it right away.

I attached an ebook that is very good resource for beginner who want to develop or wanna learn Starling framework from start.


Mar 11, 2014

Aug 1, 2013

How do I attach camera to Spark.components.VideoDisplay

Simple example to capture the Image from Camera by using Spark Videodisplay.


--------------------------------- Start Code Here ------------------------------------------------------

  xmlns:s="library://ns.adobe.com/flex/spark"
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
  creationComplete="application1_creationCompleteHandler(event)">



<![CDATA[
import mx.events.FlexEvent;

private var myvideo:Video;
private var cam:Camera;

protected function application1_creationCompleteHandler(event:FlexEvent):void
{
cam = Camera.getCamera()
cam.setMode(320, 240, 15);
cam.setQuality(0, 0);

myvideo = new Video(320,240);
myvideo.attachCamera(cam);
myVideo.addChild(myvideo);
}

private function takePicture(event:MouseEvent):void {
var bmd:BitmapData = new BitmapData(320,240);
bmd.draw(myVideo)
imagen.source = new Bitmap(bmd)
myVideo.visible = false;
imagen.visible = true;
}

protected function button1_clickHandler(event:MouseEvent):void
{
myVideo.visible = true;
imagen.visible = false;
}

]]>







/>








--------------------------------- End Code Here ----------------------------------------------------


Enjoy :)




Jul 18, 2013

Flex 4 AutoComplete component with text highlighting | Train to RIA

Flex 4 AutoComplete component with text highlighting | Train to RIA:

'via Blog this'

How to use the new CSS syntax in Flex 4.6

Problem

CSS now provides a lot of features such as advanced selection or namespaces. Let's see how to use it.

Solution

We'll show a few ways to select and apply styles to a component: global selection by namespace, selection by ID, Descendant selection and States selection.

Detailed explanation

My application

For this example, I'll use two Buttons (one from Halo, one from spark) and a progressBar contained in a VGroup container:
01"1.0" encoding="utf-8"?>
04xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024"
05minHeight="768">
06        "global.css" />
07        
08                
09        
10        <mx:Button label="Click me, I'm a Halo button!"
11id="haloButton" />
12        label="Click me, I'm a spark cool and funky
13button !" id="sparkButton" />
14        "myBox">
15                <mx:ProgressBar />
16        
17

Namespace declaration

@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/halo";
This way, if I want to apply some styles to a component, I'll have to specify the namespace before my selector (for example, s|Button { styles... }). If you're sure your project will mostly use Spark components, you can set the Spark namespace as default:
@namespace "library://ns.adobe.com/flex/spark";
Then, with the previous example, you won't need to specify the "s|" anymore.

Global selection

mx|Button
   {
   color:#ffffff;
   }
s|Button 
   {
   color:#000000;
   }
Of course, it's still possible to use the class selection by setting a stylename attribute to a component, then use the following syntax:
.myStyleClass 
   {
   color:#ff0000;
   }

Selection my ID

I want only specifics components to be base-colored, so I'll use the selection by id syntax:
#haloButton 
   {
   base-color:#0000ff;
   }
#sparkButton
   {
   base-color:#ffffff;
   }

Descendant selection

I want the text of my progressbar contained in my VGroup to be colored in red:
s|VGroup#myBox mx|ProgressBar
   {
   color:#ff0000;
   }

States selection

I want my spark Buttons' label to be colored in green when the user clicks on it (which means when my button's current state is "down"):
s|Button:down
   {
   color:#33CC33;
   }

Conclusion

The previous CSS functionalities were such jokes and really frustrating if, before using Flex, you were developing HTML/CSS websites. With this new syntax, it'll be much easier to skin components.