Flash CS3 - Flash CS4

Flep · #1 (**permalink**) 23-06-08, 09:49

Dopo aver visto come usare la Tweener Caurina di Zeh Fernando nel primo tutorial di FlepStudio, ecco il secondo esempio.

Questa volta ho simulato la creazione di un sito web in Flash CS3, con sfondo colorato che cambia in base alla sezione, menu e contenuti tutti simulati utilizzando la tweener caurina.

Tengo a sottolineare che per chi avesse bisogno di una tweener, a mio parere Caurina è la migliore.

Sia come effetti che come semplicità ed immediatezza nel suo utilizzo.

Esempio:

Main.as :

Code:

package
{
	import flash.display.*;
	import flash.events.*;
	import flash.utils.getDefinitionByName;
	import caurina.transitions.Tweener;
	
	public class Main extends MovieClip
	{
		private var items_array:Array;
		private var background_colors:Array;
		
		private var container_mc:MovieClip;
		private var underline_mc:MovieClip;
		
		private const ROWS:int=10;
		
		public function Main()
		{
			addEventListener(Event.ADDED_TO_STAGE,init);
		}
		
		private function init(evt:Event):void
		{
			removeEventListener(Event.ADDED_TO_STAGE,init);
			
			stage.frameRate=31;
			
			items_array=new Array(menu_mc.item_0_mc,menu_mc.item_1_mc,menu_mc.item_2_mc,menu_mc.item_3_mc,menu_mc.item_4_mc);
			background_colors=new Array(0x006699,0xCC0066,0xFF3300,0x009900,0x333333);
			
			changeItemColor(0);
			displayContent("Square");
			
			addMenuListeners();
		}
		
		private function addMenuListeners():void
		{
			for(var i:int=0;i < items_array.length;i++)
			{
				items_array[i].id=i;
				items_array[i].mouseChildren=false;
				items_array[i].buttonMode=true;
				items_array[i].addEventListener(MouseEvent.MOUSE_OVER,setOver);
				items_array[i].addEventListener(MouseEvent.MOUSE_OUT,setOut);
				items_array[i].addEventListener(MouseEvent.MOUSE_DOWN,setDown);
			}
		}
		
		private function setOver(evt:MouseEvent):void
		{
			underline_mc=new MovieClip();
			underline_mc.graphics.beginFill(0xFFFFFF,1);
			underline_mc.graphics.drawRect(0,0,1,1);
			underline_mc.x=evt.target.x;
			underline_mc.y=evt.target.y+evt.target.height+5;
			menu_mc.addChild(underline_mc);
			
			Tweener.addTween(underline_mc,{width:evt.target.width+5,time:0.3,transition:"easeOutQuad"});
		}
		
		private function setOut(evt:MouseEvent):void
		{
			if(underline_mc!=null)
			{
				menu_mc.removeChild(underline_mc);
				underline_mc=null;
			}
		}
		
		private function setDown(evt:MouseEvent):void
		{
			Tweener.addTween(bg_mc,{_color:background_colors[evt.target.id],time:1.2,transition:"easeOutQuad"});
			
			menu_mc.removeChild(underline_mc);
			underline_mc=null;
			changeItemColor(evt.target.id);
			
			switch(evt.target.id)
			{
				case 0:
					displayContent("Square");
				break;
				
				case 1:
					displayContent("Circle");
				break;
				
				case 2:
					displayContent("Star");
				break;
				
				case 3:
					displayContent("Oval");
				break;
				
				case 4:
					displayContent("Line");
				break;
			}
		}
		
		private function changeItemColor(n:int):void
		{
			for(var i:int=0;i < items_array.length;i++)
			{
				if(i==n)
				{
					items_array[i].mouseEnabled=false;
					Tweener.addTween(items_array[i],{_color:0x000000,time:1.5,transition:"easeOutQuad"});
				}
				else
				{
					items_array[i].mouseEnabled=true;
					Tweener.addTween(items_array[i],{_color:0xFFFFFF,time:1.5,transition:"easeOutQuad"});
				}
			}
		}
		
		private function displayContent(s:String):void
		{
			var className:Class=getDefinitionByName(s)as Class;
			
			if(container_mc!=null)
			{
				removeChild(container_mc);
				container_mc=null;
			}
			container_mc=new MovieClip();
			for(var i:int=0;i < 50;i++)
			{
				var clip:MovieClip=new className();
				clip.scaleX=clip.scaleY=0;
				clip.x=66+((i%ROWS)*30);
				clip.y=66+(Math.floor(i/ROWS)*30);
				Tweener.addTween(clip,{scaleX:2,scaleY:2,delay:0.05*i,time:0.2,transition:"easeOutQuad"});
				container_mc.addChild(clip);
			}
			container_mc.x=(stage.stageWidth-container_mc.width)/2;
			container_mc.y=(stage.stageHeight-container_mc.height)/2;
			addChild(container_mc);
		}
	}
}

Allego i files:

orciatichino · #2 (**permalink**) 25-06-08, 11:58

magico Flep...
aiuti sempre MOOOLTO preziosi.....

continua così!

mi raccomando, sennò sono rovinato!

Red_Admin

pavle1980 · #3 (**permalink**) 28-08-08, 11:38

Ciao Flep,
sto facendo degli esercizi ma ho dei problemi con
getDefinitionByName
il mio compilatore non mi da errori ma il debug mi dice questo:

ReferenceError: Error #1065: Variable Square is not defined.
at global/flash.utils::getDefinitionByName()
at GetDefinitionByNameExample/displayContent()[/home/pavle/Desktop/esercizi/Prova/src/GetDefinitionByNameExample.as:15]
at GetDefinitionByNameExample()[/home/danieli/pavle/esercizi/Prova/src/GetDefinitionByNameExample.as:11]

nello script che porti come esempio non vedo metodi chiamati "Circle" o "Square" o altro...
sono proprietà dell'IDE Flash CS3? perchè nelle SDK non credo che esistano [dato l'errore che ricevo].
Il che mi porta a pensare che dovrei costruirle io...
va a farsi benedire la comodità.

posto il codice così gli dai un'occhiata:

package {
import flash.display.DisplayObject;
import flash.display.Sprite;
import flash.display.Shape;
import flash.utils.getDefinitionByName;

public class GetDefinitionByNameExample extends Sprite {

public function GetDefinitionByNameExample()
{
displayContent("Square");
}
private function displayContent(s:String):void
{
var ClassReference:Class = getDefinitionByName(s) as Class;
var instance:Shape = new ClassReference();
instance.scaleX=instance.scaleY=100;
instance.x=100;
instance.y=100;
addChild(DisplayObject(instance));
}
}
}

Flep · #4 (**permalink**) 29-08-08, 06:23

Ciao,
sì devi associare la classe Square ad una MovieClip nella libreria.

pavle1980 · #5 (**permalink**) 29-08-08, 12:00

Grazie della dritta Flep :)
ora il mio getDefinitionByName funziona correttamente.

ho scritto un classe Square.as:

Code:

package
{
    import flash.display.*;

    public class Square extends MovieClip
    {
        private var _fla:MovieClip;

        public function Square(fla:MovieClip)
        {
            _fla=fla;
            quadrato();
        }
        public function quadrato():void
        {
            var rect:Shape = new Shape();
            rect.graphics.lineStyle(1);
            rect.graphics.beginFill(0x0000FF, 1);
            rect.graphics.drawRect(5, 5, 10, 10);
            _fla.addChild(rect);
        }
    }
}

e una classe Circle.as:

Code:

package
{
    import flash.display.*;

    public class Circle extends MovieClip
    {
        private var _fla:MovieClip;

        public function Circle(fla:MovieClip)
        {
            _fla=fla;
            var circ:Shape = new Shape();
            circ.graphics.lineStyle(1);
            circ.graphics.beginFill(0xff00ff, 1);
            circ.graphics.drawCircle(40, 10, 10);
            _fla.addChild(circ);
        }
    }
}

entrambe le richiamo in una classe main che ho nominato GetDefinitionByNameExample.as

Code:

package {
    import flash.display.*;
    import flash.utils.*;

    public class GetDefinitionByNameExample extends MovieClip {

    private var container_mc:MovieClip;
    private var clip:Square;
    private var clip_1:Circle;

    public function GetDefinitionByNameExample()
    {
        displayContent('Square');
        displayContent('Circle');
    }

      private function displayContent(s:String):void
    {
        container_mc = new MovieClip();
        addChild(container_mc);
        var ClassReference:Class = getDefinitionByName(s) as Class;
        var istance:MovieClip = new ClassReference(this);
        /*
        istance.scaleX=istance.scaleY=2;
        istance.x=100;
        istance.y=100;
        container_mc.addChild(istance);
        */
    }

    }

}

Ora ho un altro difetto che nel tuo codice non c'è:

Code:

        /*
         istance.scaleX=istance.scaleY=2;
         istance.x=100;
         istance.y=100;
         container_mc.addChild(istance);
         */

1) come faccio a modificare le proprietà scaleX e scaleY di "istance" dalla mia main?

2) se nelle classi Circle e Square elimino "_fla.addChild(clip);" nella mia main non riesco a vedere gli oggetti anche se vengono creati e anche se scrivo "container_mc.addChild(istance);"

Cosa sbaglio?

pavle1980 · #6 (**permalink**) 29-08-08, 13:37

Risolto!

La soluzione è suggerita in questa tua lezione:
Added_to_stage

In pratica ho usato

Code:

Event.ADDED_TO_STAGE

nelle classi Circle e Square

Come sempre sei un grande Flep anche se non proferisci parola

!

riposto il codice delle classi Square Circle e GetDefinitionByNameExample modificato:

Square.as

Code:

package
{
    import flash.display.*;
    import flash.events.Event;
    public class Square extends MovieClip
    {
        public function Square()
        {
            addEventListener(Event.ADDED_TO_STAGE,quadrato);
        }
        private function quadrato(evt:Event):void
        {
            removeEventListener(Event.ADDED_TO_STAGE,quadrato);
            var rect:Shape = new Shape();
            rect.graphics.lineStyle(1);
            rect.graphics.beginFill(0x0000FF, 1);
            rect.graphics.drawRect(0, 0, 20, 20);
            addChild(rect);
        }
    }
}

Circle.as

Code:

package
{
    import flash.display.*;
    import flash.events.Event;
    public class Circle extends MovieClip
    {
        public function Circle()
        {
            addEventListener(Event.ADDED_TO_STAGE,cerchio);
        }
        private function cerchio(evt:Event):void
        {
            removeEventListener(Event.ADDED_TO_STAGE,cerchio);
            var circ:Shape = new Shape();
            circ.graphics.lineStyle(1);
            circ.graphics.beginFill(0xff00ff, 1);
            circ.graphics.drawCircle(5, 5, 10);
            addChild(circ);
        }
    }
}

GetDefinitionByNameExample.as

Code:

package {
    import flash.display.*;
    import flash.utils.*;

    public class GetDefinitionByNameExample extends MovieClip {

    private var container_mc:MovieClip;
    private var clip:Square;
    private var clip_1:Circle;

    public function GetDefinitionByNameExample()
    {
        displayContent('Square');
        displayContent('Circle');
    }

      private function displayContent(s:String):void
    {
        container_mc = new MovieClip();
        addChild(container_mc);
        var ClassReference:Class = getDefinitionByName(s) as Class;
        var istance:MovieClip = new ClassReference();
        istance.scaleX=istance.scaleY=2;
        istance.x=10;
        istance.y=25;
        container_mc.addChild(istance);
    }
    }

}

prossimo passo:
estendere il mio esercizio con le Tween del tuo esempio usando Caurina...

se ho problemi naturalmente ingolfo il forum

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Actionscript 3 Tweener caurina e lineTo	webbed	Actionscript 3.0 avanzato	2	22-10-08 09:44
Tweener caurina di Zeh Fernando - tutorial 1	Flep	Articoli e tutorials	26	10-10-08 13:56
Actionscript 3 Tweener Caurina con dissolvenza	Tiche	Actionscript 3.0 base	0	07-10-08 13:46
Tweener caurina by Zeh Fernando - example 2	Flep	Tutorials	1	24-06-08 11:24
Caurina Tweener by Zeh Fernando - tutorial 1	Flep	Tutorials	8	27-03-08 13:11

Flash CS3 - Flash CS4

Tweener caurina di Zeh Fernando - tutorial 2

Tweener caurina di Zeh Fernando - tutorial 2

Similar Threads