Teste de efeito de texto.
package com.leandroamano.text {
import flash.text.TextField;
import flash.events.EventDispatcher;
import flash.events.TimerEvent;
import flash.events.Event;
import flash.utils.Timer;
public class RandomCharacters extends EventDispatcher {
private var _textField:TextField;
private var _message:String;
private var _time:Number;
private var _html:Boolean;
private var chars:Array;
private var timer:Timer;
private var i:uint;
private var newMessage:String = "";
public function RandomCharacters(textField:TextField, message:String = "", time:Number = 1, html:Boolean = false):void {
timer = new Timer(time * 1000);
timer.addEventListener(TimerEvent.TIMER, timerHandler, false, 0, true);
_textField = textField;
_message = message;
_time = time * 1000;
_html = html;
}
public function start():void {
i = 0;
newMessage = "";
timer.start();
chars = new Array();
var j:uint;
while (j < 127) {
if (j >= 33 && j <= 47 || j >= 58 && j <= 64 || j >= 91 && j <= 96 || j >= 123 && j <= 126) {
chars.push(String.fromCharCode(j));
}
j++;
}
}
private function timerHandler(e:Event):void {
if (i < message.length) {
var w:Array = message.split("");
var n:String = newMessage.substring(0, i);
for (var k:int = i; k < message.length; k++) {
n += chars[Math.floor(Math.random() * chars.length)];
}
newMessage = n.substring(0, i) + message.charAt(i) + n.substring(i + 1);
if(!html){
textField.text = newMessage;
}else{
textField.htmlText = newMessage;
}
i++;
} else {
if(!html){
textField.text = message;
}else{
textField.htmlText = message;
}
i = 0;
newMessage = "";
timer.stop();
dispatchEvent(new Event(Event.COMPLETE, false, false));
}
}
public function pause():void {
timer.stop();
}
public function resume():void {
timer.start();
}
override public function toString():String {
return time + " segundo(s).";
}
public function get textField():TextField {
return _textField;
}
public function set textField(value:TextField):void {
_textField = value;
}
public function get message():String {
return _message;
}
public function set message(value:String):void {
_message = value;
}
public function get time():Number {
return _time / 1000;
}
public function set time(value:Number):void {
_time = value * 1000;
timer.delay = _time;
}
public function get html():Boolean {
return _html;
}
public function set html(value:Boolean):void {
_html = value;
}
}
}
//No frame 1
import com.leandroamano.text.RandomCharacters;
var texto:String = "<b>Prerequisite knowledge</b><br><br>A solid understanding of developing with ActionScript 3.0 is required. Some previous experience working with Flash Builder is recommend. Prior knowledge of Flare3D is helpful, but not necessary to complete this tutorial";
//parâmetros: textField:TextField, message:String = "", time:Number = 1, html:Boolean = false
var rc:RandomCharacters = new RandomCharacters(tfLabel, texto, .03, true);
rc.start();
Novidades, artigos, tutoriais e outros temas referentes ao mundo tecnológico, principalmente softwares Adobe e linguagens de programação. Melhores práticas, criatividade e educação usando tecnologia.
sexta-feira, 13 de junho de 2014
quinta-feira, 12 de junho de 2014
ActionScript 3 - Zoom class
Um teste que havia feito em AS2, agora em AS3:
package com.leandroamano.display {
import flash.display.DisplayObject;
import flash.display.BitmapData;
import flash.display.MovieClip;
import flash.display.Bitmap;
import flash.geom.Rectangle;
import flash.geom.Matrix;
import flash.events.MouseEvent;
import flash.events.Event;
public class Zoom extends MovieClip {
private var _target:DisplayObject;
private var _transparent:Boolean;
private var zoomMatrix:Matrix;
private var rect:Rectangle;
private var bmpData:BitmapData;
private var bmp:Bitmap;
private var _height:Number;
private var _width:Number;
private var _zoom:Number;
private var _color:uint;
public function Zoom(p_target:DisplayObject, p_width:Number = 100, p_height:Number = 100, p_color:uint = 0xFFFFFFFF, p_transparent:Boolean = false):void {
_width = p_width;
_height = p_height;
_target = p_target;
_color = p_color;
_zoom = 1;
_transparent = p_transparent;
addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event):void {
bmpData = new BitmapData(_width, _height, _transparent, _color);
bmp = new Bitmap(bmpData);
bmp.smoothing = true;
zoomMatrix = new Matrix();
zoomMatrix.scale(_zoom, _zoom);
target.addEventListener(MouseEvent.MOUSE_MOVE, mouseHandler);
addChild(bmp);
}
private function mouseHandler(e:MouseEvent):void {
rect = new Rectangle(0, 0, _width, _height);
bmpData.fillRect(rect, 0xFFFFFF);
//A distância utilizada para traduzir cada ponto ao longo do eixo x, representa o valor na terceira fileira e na primeira coluna do objeto da matriz.
zoomMatrix.tx = (rect.width / 2) - parent.mouseX * zoom + target.x * zoom;
//A distância utilizada para traduzir cada ponto ao longo do eixo y, representa o valor na terceira fileira e na segunda coluna do objeto da matriz.
zoomMatrix.ty = (rect.height / 2) - parent.mouseY * zoom + target.y * zoom;
bmpData.draw(target, zoomMatrix);
e.updateAfterEvent();
}
override public function get width():Number {
return _width;
}
override public function set width(value:Number):void {
_width = value;
}
override public function get height():Number {
return _height;
}
override public function set height(value:Number):void {
_height = value;
}
public function get zoom():Number {
return _zoom;
}
public function set zoom(value:Number):void {
if(value == 0) throw new RangeError();
_zoom = value;
}
public function get target():DisplayObject {
return _target;
}
public function set target(value:DisplayObject):void {
_target = value;
}
public function get transparent():Boolean {
return _transparent;
}
public function set transparent(value:Boolean):void {
_transparent = value;
}
public function get color():uint {
return _color;
}
public function set color(value:uint):void {
_color = value;
}
}
}
Para usar (imagem é o nome do seu movieclip):
import com.leandroamano.display.Zoom;
//target, width, height, color(ARGB), transparent
var img:Zoom = new Zoom(imagem, 200, 200);
img.zoom = 3;
img.x = 50;
img.y = 50;
addChild(img);
//target, width, height, color(ARGB), transparente
var img2:Zoom = new Zoom(imagem, 200, 200, 0x00000000, true);
img2.zoom = 6;
img2.target = image2; //alterando o alvo posteriormente, caso haja necessidade
img2.x = 50;
img2.y = 300;
addChild(img2);
package com.leandroamano.display {
import flash.display.DisplayObject;
import flash.display.BitmapData;
import flash.display.MovieClip;
import flash.display.Bitmap;
import flash.geom.Rectangle;
import flash.geom.Matrix;
import flash.events.MouseEvent;
import flash.events.Event;
public class Zoom extends MovieClip {
private var _target:DisplayObject;
private var _transparent:Boolean;
private var zoomMatrix:Matrix;
private var rect:Rectangle;
private var bmpData:BitmapData;
private var bmp:Bitmap;
private var _height:Number;
private var _width:Number;
private var _zoom:Number;
private var _color:uint;
public function Zoom(p_target:DisplayObject, p_width:Number = 100, p_height:Number = 100, p_color:uint = 0xFFFFFFFF, p_transparent:Boolean = false):void {
_width = p_width;
_height = p_height;
_target = p_target;
_color = p_color;
_zoom = 1;
_transparent = p_transparent;
addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event):void {
bmpData = new BitmapData(_width, _height, _transparent, _color);
bmp = new Bitmap(bmpData);
bmp.smoothing = true;
zoomMatrix = new Matrix();
zoomMatrix.scale(_zoom, _zoom);
target.addEventListener(MouseEvent.MOUSE_MOVE, mouseHandler);
addChild(bmp);
}
private function mouseHandler(e:MouseEvent):void {
rect = new Rectangle(0, 0, _width, _height);
bmpData.fillRect(rect, 0xFFFFFF);
//A distância utilizada para traduzir cada ponto ao longo do eixo x, representa o valor na terceira fileira e na primeira coluna do objeto da matriz.
zoomMatrix.tx = (rect.width / 2) - parent.mouseX * zoom + target.x * zoom;
//A distância utilizada para traduzir cada ponto ao longo do eixo y, representa o valor na terceira fileira e na segunda coluna do objeto da matriz.
zoomMatrix.ty = (rect.height / 2) - parent.mouseY * zoom + target.y * zoom;
bmpData.draw(target, zoomMatrix);
e.updateAfterEvent();
}
override public function get width():Number {
return _width;
}
override public function set width(value:Number):void {
_width = value;
}
override public function get height():Number {
return _height;
}
override public function set height(value:Number):void {
_height = value;
}
public function get zoom():Number {
return _zoom;
}
public function set zoom(value:Number):void {
if(value == 0) throw new RangeError();
_zoom = value;
}
public function get target():DisplayObject {
return _target;
}
public function set target(value:DisplayObject):void {
_target = value;
}
public function get transparent():Boolean {
return _transparent;
}
public function set transparent(value:Boolean):void {
_transparent = value;
}
public function get color():uint {
return _color;
}
public function set color(value:uint):void {
_color = value;
}
}
}
Para usar (imagem é o nome do seu movieclip):
import com.leandroamano.display.Zoom;
//target, width, height, color(ARGB), transparent
var img:Zoom = new Zoom(imagem, 200, 200);
img.zoom = 3;
img.x = 50;
img.y = 50;
addChild(img);
//target, width, height, color(ARGB), transparente
var img2:Zoom = new Zoom(imagem, 200, 200, 0x00000000, true);
img2.zoom = 6;
img2.target = image2; //alterando o alvo posteriormente, caso haja necessidade
img2.x = 50;
img2.y = 300;
addChild(img2);
quarta-feira, 11 de junho de 2014
The Rebirth of Flash Professional CC
With the release of Adobe Flash Professional CC earlier this year, the application has undergone a drastic rebirth. Built from the ground up to be lean, modern, and extensible the Flash Professional application has truly started a new life alongside the Adobe Creative Cloud. Originally released along with the full suite of CC branded applications in June 2013, the application included a number of exciting features; Creative Cloud Sync, 64-bit architecture, Dark UI (as shown in Figure 1), unlimited pasteboard, Timeline enhancements, HD video export, Mobile development enhancements, a new code editor, and the ability to perform real-time drawing upon the Stage.
Although the Flash Professional application began life closely tied to Flash Player and the SWF file format, starting with the introduction of Flash Player 9 and ActionScript 3.0, this relationship became much more relaxed. Today, with web standard technologies taking on many of the responsibilities that Flash Player once served, there is a decline in the use of the SWF format across many areas and Flash Professional is adapting to these changes by enabling the creation and export of content to serve a multitude of new and emerging platforms. At the same time, Adobe continues to improve upon and release new versions of both the Flash Player web browser plugin, and the Adobe AIR runtime for desktop and mobile applications and games.
So… No. Flash is not dead at all. The Flash Player will continue to serve those project types that require it (mostly web games and rich video projects). Adobe AIR continues to shine on iOS and Android with some of the top apps and games on those platforms built on ActionScript and third-party Flash frameworks such as Starling, Feathers, Apache Flex, Away3D, and many others. Most important to this discussion, Flash Professional will continue to enable its time-tested tooling and robust workflow to target platforms such as Flash/AIR, HTML5 Canvas, Google Dart, HD Video, and additional functionality users will come to know and love. The future of Flash Professional has never been as promising as it is right now!
In this recent update for Flash Professional CC, there are a number of enhancements that do much to extend the range of targets that can be published from the application. Among these new features include fully integrated HTML5 Canvas documents along with full JavaScript editor support in the Actions Panel.
The next sections covers four of the key enhancements in support of this new Canvas integration:
HTML5 Canvas is a new document type added to Flash Professional CC that generates an .FLA file for authoring, and targets the canvas tag of HTML. This option enables the authoring of animation and interactivity for targeting web browsers without the need for Adobe Flash Player if those extended capabilities are not needed. The generated HTML file bundle is driven by the CreateJS JavaScript library, which was previously available as an extension for both CS6 and the previous version of CC. This functionality is now included as a prime target format within the application (as shown in Figure 2) and is no longer provided through the Toolkit for CreateJS as a separate extension.
Static artwork and full animation created using this new project type can be directly published to HTML canvas using the Publish Settings panel, similar to publishing an ActionScript 3.0 document targeting Flash Player. Because certain tools such as the 3D Rotation and Transform Tools are not applicable to the HTML canvas target, they will be disabled when this document type is selected. If you need that functionality, you will want to be sure to target Flash Player instead when creating a new project document.
When using the new HTML5 Canvas document type, you will be able to use JavaScript natively within the Actions Panel (as shown in Figure 3). This is a vast improvement over previous versions of Flash Professional which required users to include any JavaScript within a set of specific comments in order for the Toolkit for CreateJS. This new integration allows for the same features when writing ActionScript.
The one drawback of having a document specific to ActionScript or JavaScript is that you can no longer publish to both SWF and Canvas using the same FLA document. However, Adobe has built a workflow solution into this update (which will be discussed later) and the isolation of document types allows this sort of full JavaScript support within the Actions Panel and elsewhere.
A selection of new code snippets (as shown in Figure 4) come bundled with Flash Professional that are similar to the code snippets you may be used to when writing ActionScript. However, these are written in JavaScript for use with this new document type. Along with the expected mouse events and timeline navigation snippets, you can also find some which are particular to the CreateJS libraries such as the creation of gradients and various shapes.
Just as with ActionScript code snippets, these can be accessed from within the Code Snippets panel directly or by clicking upon the Code Snippets button within the Actions panel.
When converting assets from an AS3-based FLA to one which targets HTML5 Canvas, we now have two options. The first option is to open the AS3 document, then select and copy all the layers (using the Copy Layers contextual menu item) within the Timeline. When we create a new HTML Canvas FLA, all that is needed is to paste the copied layers (using the Paste Layers contextual menu item) within that fresh Timeline and all assets and animation will be copied over.
While this method works well, it involves a number of steps and can be confusing for newcomers. Adobe has made things a bit simpler by including a new Command (as shown in Figure 5) called “Convert to HTML5 Canvas from AS3 document formats”.
This Command (accessible from the application menu under Commands) can be executed upon an open AS3-based FLA and will prompt the user to save a new HTML5 Canvas-based FLA which will automatically be populated with all assets and animation from the original AS3-based document.
--
source: http://www.peachpit.com/articles/article.aspx?p=2164574&WT.mc_id=Author_Labrecque_FlashCCProUpdates
Wait… Isn’t Flash Dead?
Although the Flash Professional application began life closely tied to Flash Player and the SWF file format, starting with the introduction of Flash Player 9 and ActionScript 3.0, this relationship became much more relaxed. Today, with web standard technologies taking on many of the responsibilities that Flash Player once served, there is a decline in the use of the SWF format across many areas and Flash Professional is adapting to these changes by enabling the creation and export of content to serve a multitude of new and emerging platforms. At the same time, Adobe continues to improve upon and release new versions of both the Flash Player web browser plugin, and the Adobe AIR runtime for desktop and mobile applications and games.So… No. Flash is not dead at all. The Flash Player will continue to serve those project types that require it (mostly web games and rich video projects). Adobe AIR continues to shine on iOS and Android with some of the top apps and games on those platforms built on ActionScript and third-party Flash frameworks such as Starling, Feathers, Apache Flex, Away3D, and many others. Most important to this discussion, Flash Professional will continue to enable its time-tested tooling and robust workflow to target platforms such as Flash/AIR, HTML5 Canvas, Google Dart, HD Video, and additional functionality users will come to know and love. The future of Flash Professional has never been as promising as it is right now!
What’s New (December 2013)
In this recent update for Flash Professional CC, there are a number of enhancements that do much to extend the range of targets that can be published from the application. Among these new features include fully integrated HTML5 Canvas documents along with full JavaScript editor support in the Actions Panel.The next sections covers four of the key enhancements in support of this new Canvas integration:
HTML5 Canvas Documents
HTML5 Canvas is a new document type added to Flash Professional CC that generates an .FLA file for authoring, and targets the canvas tag of HTML. This option enables the authoring of animation and interactivity for targeting web browsers without the need for Adobe Flash Player if those extended capabilities are not needed. The generated HTML file bundle is driven by the CreateJS JavaScript library, which was previously available as an extension for both CS6 and the previous version of CC. This functionality is now included as a prime target format within the application (as shown in Figure 2) and is no longer provided through the Toolkit for CreateJS as a separate extension.Static artwork and full animation created using this new project type can be directly published to HTML canvas using the Publish Settings panel, similar to publishing an ActionScript 3.0 document targeting Flash Player. Because certain tools such as the 3D Rotation and Transform Tools are not applicable to the HTML canvas target, they will be disabled when this document type is selected. If you need that functionality, you will want to be sure to target Flash Player instead when creating a new project document.
Actions Panel JavaScript Editor
When using the new HTML5 Canvas document type, you will be able to use JavaScript natively within the Actions Panel (as shown in Figure 3). This is a vast improvement over previous versions of Flash Professional which required users to include any JavaScript within a set of specific comments in order for the Toolkit for CreateJS. This new integration allows for the same features when writing ActionScript.The one drawback of having a document specific to ActionScript or JavaScript is that you can no longer publish to both SWF and Canvas using the same FLA document. However, Adobe has built a workflow solution into this update (which will be discussed later) and the isolation of document types allows this sort of full JavaScript support within the Actions Panel and elsewhere.
JavaScript Code Snippets
A selection of new code snippets (as shown in Figure 4) come bundled with Flash Professional that are similar to the code snippets you may be used to when writing ActionScript. However, these are written in JavaScript for use with this new document type. Along with the expected mouse events and timeline navigation snippets, you can also find some which are particular to the CreateJS libraries such as the creation of gradients and various shapes.Just as with ActionScript code snippets, these can be accessed from within the Code Snippets panel directly or by clicking upon the Code Snippets button within the Actions panel.
HTML5 Canvas Conversion Command
When converting assets from an AS3-based FLA to one which targets HTML5 Canvas, we now have two options. The first option is to open the AS3 document, then select and copy all the layers (using the Copy Layers contextual menu item) within the Timeline. When we create a new HTML Canvas FLA, all that is needed is to paste the copied layers (using the Paste Layers contextual menu item) within that fresh Timeline and all assets and animation will be copied over. While this method works well, it involves a number of steps and can be confusing for newcomers. Adobe has made things a bit simpler by including a new Command (as shown in Figure 5) called “Convert to HTML5 Canvas from AS3 document formats”.
This Command (accessible from the application menu under Commands) can be executed upon an open AS3-based FLA and will prompt the user to save a new HTML5 Canvas-based FLA which will automatically be populated with all assets and animation from the original AS3-based document.
--
source: http://www.peachpit.com/articles/article.aspx?p=2164574&WT.mc_id=Author_Labrecque_FlashCCProUpdates
Assinar:
Comentários (Atom)




