Category 'Tutorials'


Create MovieClip modal TopMost

di Flash. Illustrate a technique to create symbols (MovieClip) modal components to be used similarly to the Alert and Window of Flash. The aim is to show a MovieClip above all others, disabling - well - access to the underlying and any other object / component present. To be honest I have achieved that by doing a little 'reverse engineering code from Adobe, which is in the clear! I actually resisted ;)

The artefizio that is used to disable any interface present below our MovieClip, is to create a transparent MovieClip take the whole area of ​​the stage. a false . At this MovieClip, which will be virtually no visible snaps a method "void" on the event onRelease , being careful to set the useHandCursor to false .

First of all we create a movie with any interface in the main stage:

Interface

Continued ...

Add properties to a MovieClip

In Post Extend MovieClip in Flash MX I had some insight to extend a MovieClip. In particular, I said that the use of MovieClip.prototype not allow the extension of their methods, but only:

[...] Two important limitations of this technique are:

  1. It can not be applied to all objects exposed by Flash
  2. They can be "added" only methods and properties do not [...]

Indeed, it is possible, with an extra step, even when using dynamically add properties MovieClip.prototype . , infatti, Flash permetteva l'aggiunta di proprietà (in lettura/scrittura o solo lettura) tramite il metodo addProperty() . Before the introduction of function get and function set , in fact, allowed the addition of Flash properties (read / write or read only) via the addProperty() . In practice this results in the invocation of the method addProperty() and the definition of two getters and setters. The setter can be null in order to create read-only property. For example if we wanted to extend MovieClip with an all new property _alpha can add animation, just write the following code:

1
2
3
4
5
6
7
: Number { _get_alpha function (): Number {
this . _alpha ) ; return (this. _alpha);
}
v : Number ) : Void { _set_alpha function (v: Number ): Void {
this , "_alpha" , Strong . easeOut , this . _alpha , v , 1 , true ) ; new Tween (this, "_alpha", Strong. easeOut, this. _alpha, v, 1, true);
}
prototype . addProperty ( "_alpha_tween" , _get_alpha , _set_alpha ) ; MovieClip . prototype. addProperty ("_alpha_tween" _get_alpha, _set_alpha);

From now on, if we have a symbol "miosimbolo_mc" We can exploit this new property:

1
; miosimbolo_mc. _alpha_tween = 50;

. What you can do instead, is to overwrite the existing properties, which is why I used _alpha_tween instead of _alpha . Here, then, a good reason to still use the 2.0 classes to extend - and result - any MovieClip.

Continued ...

Resizable Flash movies: Act II

Returning to the Post StageExt Class: resizable Flash movies here is an even easier to get the same effect, only if the library for our movie is at least one Flash component!

Create a symbol, a red square 100 × 100 and put it in stages resizeWindow calling. Enter in the library, not on the Stage, any component, such as a TextInput, and enter the following code in the first frame of the movie.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
managers . SystemManager ; import mx. managers. SystemManager;
/ /
scaleMode = "noscale" Internships . scaleMode = "noScale"
/ /
/ / SystemManager.init ();
( "resize" , resizeWindow ) ; SystemManager. AddEventListener ("resize", resizeWindow);
/ /
= function ( Void ) : Void { resizeWindow. resize = function (Void): Void {
Object = SystemManager . screen ; var s: Object = SystemManager. screen;
_width = s . width ; this. _width = s. width;
_height = s . height ; this. _height = s. height;
_x = Math . round ( s . x ) ; this. _x = Math . round (s. x);
_y = Math . round ( s . y ) ; this. _y = Math . round (s. y);
}
( ) ; resizeWindow. resize ();

The line 6 (SystemManager.init ();) can be omitted.

Continued ...

Flash: how to initialize components in the constructor of a class

When estent a class from a MovieClip that it contains other objects (MovieClip, TextField, etc ...) they may not be "ready" within the constructor. This happens especially when using other or expanded MovieClip components (controls) of Flash. To solve the problem just use the onLoad event inherited from the class itself. For example, imagine you have a MovieClip that contains a TextField (internal static visual object in Flash) and a TextInput object (inserted control panel components) and want to set some property in the constructor of our class MyClass.

Example We create a symbol and insert inside the TextField object is (let's call text_txt) is the object TextInput (textinput_txt). We associate this symbol to a class that extends MovieClip, call our class MyClass. What we get is that during the constructor of our class MyClass these two controls are initialized. If we try to use a code like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/ /
controls . TextInput ; import mx. controls. TextInput;
/ /
MovieClip { class MyClass extends MovieClip {
/ /
text_txt : TextField ; private var text_txt: TextField ;
textinput_txt : TextInput ; private var textinput_txt: TextInput;
/ /
function MyClass () {
"MiaClasse::costruttore" ) ; trace ("MyClass:: constructor");
/ /
= "Ciao" ; text_txt. text = "Hello";
= "Ciao" ; textinput_txt. text = "Hello";
/ /
}

}

Continued ...

Fullscreen Flash on the browser

Flash has always supported the full-screen (full screen) and in stand-alone player to the projector. This mode is still fully supported and has not changed. Instead Adobe has recently introduced the ability to directly activate the full screen movies displayed in the browser. We have introduced a new and simple ActionScript function that works with both players stand-alone player with the browser. ed <embed> . To make the fullscreen fuzionante must operate side HTML, adding a new parameter allowFullScreen in TAG <object> and <embed> . Everything else is left to the internal engine of Flash.
This new feature has still some restrictions that you must know, first of all use of the Flash Player version 9.0.28.0 or higher. Moreover, in summary:

  • Browser must be installed on the version of the Player 9.0.28.0 or higher
  • e <embed> . The developer must add a new parameter allowFullScreen tag in <object> and <embed> . This parameter is normally set to false and does not allow fullscreen. To enable full screen you must explicitly set it to true .
  • A dialog box will be shown when entering fullscreen mode and tell you how to get out of that mode. This box will be visible for a few seconds, after which he will disappear by itself.
  • The activation of the fullscreen ActionScript can only be in response to a click of the mouse or the push of a button, any other mode will be ignored in ActionScript 2.0 and trigger an exception throw in ActionScript 3.0.
  • During the fullscreen mode you can not use the keyboard. The end user can not enter or edit text. The only answer is given to the keyboard shortcut used to exit fullscreen mode (pressing ESC )

ActionScript

The code required to set the fullscreen is very simple and uses the object Stage discussed in this blog StageExt Class: resizable Flash movies :

1
"displayState" ] = "fullScreen" ; Stage ["displayState"] = "fullScreen";

Continued ...

MagicLetter Flash Class: A class for writing magical

As promised here is the updated version of the sympathetic effect of written magic. I made a different animation for the "letter", to show how many effects you can do. The complete source you can download it here .

Loading Flash ...

Class MagicLetter

This is the code of the class, of course, can be further modified and improved. For example, you can enter a parse supprot for a symbol of "new line", to wrap words. Can be introduced functions get and set some properties to export outside, and more.

Continued ...

Written in a magical flash

This I propose is an article I wrote in August 2003 (original title: Written magic in Flash MX). Despite being "dated" (now I'd use a different ActionScript), I think it is a nice tool to truly enchanting effect. Propose later, or do you, the updated version with the use of classes ...

Dynamic MovieClip

The element that plays a key role nell'architetura Flash MovieClip object. The ability to create objects of this type of code gives a remarkable potential to Flash, making it a decent development environment really fun. With the ability to add run-time objects of type MovieClip, we'll see how easy it is to achieve the effect shown in Figure 1.

Loading Flash ...

Figure 1 - Example of text effect

The class MagicText_class

Since we're using the latest version of Flash MX, we do things right and create a class MagicText_class be reused at will. What we're doing is defining a new class MagicText_class , which inherits all the characteristics of a class MovieClip. In this way we would have a real object, then create the basis for a Flash component real! If we wish. For now let us dwell only on our class and see how to build it.

Continued ...

Extend MovieClip in Flash MX

I use two techniques to extend the functionality of a MovieClip. The first, used in previous versions of Flash MX, used the property prototype , a pointer to the superclass (parent), as indicated in the manual:

A reference to the superclass of a class or function object. The property   prototype is automatically created and associated to any class or function object created. This property is static and is specific to the class or function created. If, for example, you create a custom class, the value of the property   prototype is shared by all instances of the class and is accessible only as a class property. . Instances of the custom class can not directly access to the property prototype , but can be accessed through the property __proto__ .

One of the advantages of using prototype , especially with the MovieClip MovieClip resides in the extension of all, none marked. In fact, you make an extension to all MovieClip broadcast static or dynamic. For example, a convenient extension could be:

1
2
3
prototype . move = function ( x : Number , y : Number ) { MovieClip . prototype. move = function (x: Number , y: Number ) {
_x = x ; this . _y = y ; this. _x = x; this. _y = y;
}

Continued ...

StageExt Class: resizable Flash movies

The technique Fullsize (hall for Fullscreen - of which more later) was, until recently, mainly used in Flash applications (RIAs), made ​​so by a more or less complex user interface, where the container (Adobe AIR , browser or standalone player) scaled by the user, forcing a repositioning of the objects making up the movie. The downsizing of the container obviously follows a drawing function, or Refresh MovieClip can reposition or redesign the runtime interface to the new size of the container. Today this technique is also used in more advanced websites or articulated, very pious rendondo attractive interface. The implementation of this technique is quite simple and essentially uses the native Flash Stage object and introduced with version MX. For its implementation here is a class that allows to obtain the coordinates of the Stage :

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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
/ **
*
* @ File StageExt.as
* @ Author Giovambattista Fazioli (@ g.fazioli undolog.com)
* @ Web http://www.undolog.com
* @ @ Email g.fazioli undolog.com
* /
{class StageExt
/ / Release
__release : String = "1.0" ; __release private var: String = "1.0";
/ / Properties
__movieWidth : Number = 0 ; __movieWidth private var: Number = 0;
__movieHeight : Number = 0 ; __movieHeight private var: Number = 0;
__left : Number = 0 ; __left private var: Number = 0;
__right : Number = 0 ; __right private var: Number = 0;
__top : Number = 0 ; __top private var: Number = 0;
__bottom : Number = 23 ; __bottom private var: Number = 23;
/ /
w : Number , h : Number ) { StageExt function (w: Number , h: Number ) {
"StageExt::constructor" ) ; trace ("StageExt:: constructor");
/ /
__movieWidth = w;
__movieHeight = h;
/ /
addListener ( this ) ; Internships . addListener (this);
}
/ **
* OnResize () event
* /
onResize ( ) { onResize private function () {
"StageExt::onResize " + Stage . width + ", " + Stage . height ) ; trace ("StageExt: onResize" + Stage . width + "" + Stage . height);
/ /
Number = Math . round ( Stage . width ) ; var sw: Number = Math . round ( Stage . width);
Number = Math . round ( Stage . height ) ; var sh: Number = Math . round ( Stage . height);
Number = Math . round ( this . __movieWidth ) ; var ow: Number = Math . round (this. __movieWidth);
Number = Math . round ( this . __movieHeight ) ; Oh var: Number = Math . round (this. __movieHeight);

/ / The x coordinate (top left)

__left = - Math . floor ( ( ( sw - ow ) / 2 ) ) ; this. __left = - Math . floor (((sw - ow) / 2));
__top = - Math . floor ( ( ( sh - oh ) / 2 ) ) ; this. __top = - Math . floor (((sh - h) / 2));

/ / The x coordinate (top right)

__right = Math . round ( ( sw + ow ) / 2 ) ; this. __right = Math . round ((sw + ow) / 2);

/ / The y coordinate (bottom)

__bottom = Math . round ( ( sh + oh ) / 2 ) ; this. __bottom = Math . round ((sh + O) / 2);
}
/ **
* Refresh ()
* /
Refresh ( ) { public function refresh () {
onResize ();
}
/ **
* Left - get
* /
get Left ( ) : Number { public function get Left (): Number {
__left ) ; return (__left);
}
/ **
* Top - get
* /
get Top ( ) : Number { public function get Top (): Number {
__top ) ; return (__top);
}
/ **
* Right - get
* /
get Right ( ) : Number { public function get Right (): Number {
__right ) ; return (__right);
}
/ **
* Bottom - get
* /
get Bottom ( ) : Number { public function get Bottom (): Number {
__bottom ) ; return (__bottom);
}
/ **
* MovieWidth - get / set
* /
get MovieWidth ( ) : Number { MovieWidth public function get (): Number {
__movieWidth ) ; return (__movieWidth);
}
set MovieWidth ( v : Number ) { MovieWidth public function set (v: Number ) {
__movieWidth = v;
}
/ **
* MovieHeight - get / set
* /
get MovieHeight ( ) : Number { MovieHeight public function get (): Number {
__movieHeight ) ; return (__movieHeight);
}
set MovieHeight ( v : Number ) { MovieHeight public function set (v: Number ) {
__movieHeight = v;
}
}

Continued ...

How I Did It: Flash write a countdown

For the series "How I Did It" (or as I did) here is how to make a countdown to display Flash, starting with a date, what days, hours, minutes and seconds are missing an event! The Flash movie below, for example, see how many days the first year! They can be used pull-down menus to select a different date:

Loading Flash ...

We create three combo day_cmb, month_cmb year_cmb and initialize them:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
/ / Init combo
controls . ComboBox ; import mx. controls. ComboBox;
/ /
var i = 1 ; i < 32 ; i ++ ) { for (var i = 1, i <32; i + +) {
i , i ) ; day_cmb. addItem (i, i);
}

var i = 0 ; i < 12 ; i ++ ) { for (var i = 0; i <12; i + +) {
sm [ i ] , i ) ; month_cmb. addItem (sm [i], i);
}
/ / Starting from today ... I
var i = 2007 ; i < 2020 ; i ++ ) { for (var i = 2007; i <2020; i + +) {
i , i ) ; year_cmb. addItem (i, i);
}
/ / Set the date to January 1, 2008
; // -1 day_cmb. selectedIndex = 0; / / -1
; // -1 month_cmb. selectedIndex = 0; / / -1
; year_cmb. selectedIndex = 1;

The heart of the system we place the onEnterFrame event:

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
onEnterFrame = function ( ) { this. onEnterFrame = function () {
/ /
Date = new Date ( ) ; var today: Date = new Date ();
getFullYear ( ) ; var today = currenty. getFullYear ();
getTime ( ) ; var today = currentTime. getTime ();
/ /

getTime ( ) ; targetTime var = TARGETDIR. getTime ();
/ /
currentTime ; var = targetTime TimeLeft - currentTime;
/ /
. floor ( timeLeft / 1000 ) ; var s = Math . floor (TimeLeft / 1000);
= Math . floor ( sec / 60 ) ; var min = Math . floor (sec / 60);
. floor ( min / 60 ) ; var hrs = Math . floor (min / 60);
. floor ( hrs / 24 ) ; var days = Math . floor (hrs / 24);
/ /
sec % 60 ) ; sec = String (sec% 60);
length < 2 ) ? "0" + sec : sec ; sec = (sec. length <2)? "0" + sec: sec;
/ /
( min % 60 ) ; min = String (min% 60);
min . length < 2 ) ? "0" + min : min ; = min (min. length <2)? "0" + min: minutes;
/ /
hrs % 24 ) ; hrs = String (hrs% 24);
length < 2 ) ? "0" + hrs : hrs ; mins = (hrs. length <2)? "0" + hrs: mins;
/ /
days ) ; days = String (days);
length < 2 ) ? "0" + days : days ; = days (days. length <2)? "0" + days: days;
/ /
String = days + ":" + hrs + ":" + min + ":" + sec ; var counter: String = days + "" + hrs + ":" + min + ":" + sec;
/ /
= counter ; time_txt. text = counter;
};

Continued ...



Stop SOPA