Flash CS3 - Flash CS4

Free tutorials and scripts for all.
Actionscript 3.0

Componente ColorPicker Flash CS3

This is a discussion on Componente ColorPicker Flash CS3 within the Articoli e tutorials forums, part of the Flash CS3 e Actionscript 3.0 category; Flash CS3 porta con se un nuovo componente: il ColorPicker . Sostanzialmente è un componente che permette all' utente di scegliere un ...


Go Back   Forum Flash CS3 Flash CS4 > Flash CS3 e Actionscript 3.0 > Articoli e tutorials

Register FAQ Members List Calendar Search Today's Posts Mark Forums Read
  #1 (permalink)  
Old 19-09-07, 15:19
Administrator
 
Join Date: Jul 2007
Location: Cesena
Posts: 4,486
Rep Power: 6
Flep is on a distinguished road
Componente ColorPicker Flash CS3

Flash CS3 porta con se un nuovo componente: il ColorPicker .
Sostanzialmente è un componente che permette all' utente di scegliere un colore tramite una palette di colori fatta davvero bene.
Il livello di difficoltà del componente è semplice, in quanto il ColorPicker permette una buona gestione dei suoi eventi e metodi.

Ho creato una piccola applicazione come esempio.
Vediamo come funziona entrando nei dettagli...

La classe che ho scritto è la seguente:
Code:
package
{
	import fl.controls.ColorPicker;
	import fl.events.ColorPickerEvent;
	import flash.geom.ColorTransform;
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.geom.Point;
	
	public class Prova extends MovieClip
	{
		private var color_picker:ColorPicker;
		
		private var _color:ColorTransform;
		
		private var sprite:Sprite;
		
		private var clips_array:Array;
		private var selectedClips_array:Array;
		
		private var startColor:Number=0x0066FF;
		private var startX:Number;
		private var startY:Number;
		
		private var point:Point;
		
		private var isOpen:Boolean=false;
		
		public function set col(c:Number):void
		{
			_color.color=c;
		}
		public function get col():Number
		{
			return(_color.color);
		}

		public function Prova()
		{
			init();
			initStartClipColors();
			initListeners();
		}
		
		private function init():void
		{
			stage.frameRate=31;
			
			clips_array=new Array(clip_0_mc,clip_1_mc,clip_2_mc,clip_3_mc);
			selectedClips_array=new Array();
			color_picker=new ColorPicker();
			_color=new ColorTransform();
			col=startColor;
			addChild(color_picker);
			
			color_picker.x=100;
			color_picker.y=300;
		}
		
		private function initStartClipColors():void
		{
			for(var i:int=0;i < clips_array.length;i++)
			{
				clips_array[i].transform.colorTransform=_color;
			}
		}
		
		private function initListeners():void
		{
			color_picker.addEventListener(ColorPickerEvent.CHANGE,settaColore);
			stage.addEventListener(MouseEvent.MOUSE_DOWN,azionaMouse);
			stage.addEventListener(MouseEvent.MOUSE_UP,stoppaMouse);
		}
		
		private function settaColore(c:ColorPickerEvent):void
		{
			isOpen=false;
			_color=new ColorTransform();
			col=c.target.selectedColor;
			for(var i:int=0;i < selectedClips_array.length;i++)
			{
				
				selectedClips_array[i].transform.colorTransform=_color;
			}
		}
		
		private function azionaMouse(m:MouseEvent):void
		{
			startX=mouseX;
			startY=mouseY;
			
			point=new Point(mouseX,mouseY);
			if(!color_picker.hitTestPoint(point.x,point.y,true))
			{
				aggiungiAlpha();
			
				sprite=new Sprite();
				addChild(sprite);
				
				addEventListener(Event.ENTER_FRAME,drawing);
			}
		}
		
		private function drawing(e:Event):void
		{
			sprite.graphics.clear();
			sprite.graphics.moveTo(startX,startY);
			sprite.graphics.lineStyle(1,0xCCCCCC,1);
			sprite.graphics.drawRect(startX,startY,mouseX-startX,mouseY-startY);
		}
		
		private function stoppaMouse(m:MouseEvent):void
		{
			removeEventListener(Event.ENTER_FRAME,drawing);
			if(!color_picker.hitTestPoint(point.x,point.y,true)&&!isOpen)
			{
				selectedClips_array=new Array();
				for(var i:int=0;i < clips_array.length;i++)
				{
					if(sprite.hitTestObject(clips_array[i]))
					{
						selectedClips_array.push(clips_array[i]);
						togliAlpha(clips_array[i]);
					}
				}
				removeChild(sprite);
			}
			else
				isOpen=true;
		}
		
		private function togliAlpha(m:MovieClip):void
		{
			m.alpha=.5;
		}
		
		private function aggiungiAlpha():void
		{
			for(var i:int=0;i < selectedClips_array.length;i++)
			{
				selectedClips_array[i].alpha=1;
			}
		}
	}
}
Risultato:











Oltre ad alcune logiche condizionali che ho applicato, vorrei attirare l'attenzione su un paio di punti.
Il primo è il getter/setter che ho utilizzato in questa parte:
Code:
private var _color:ColorTransform;
public function set col(c:Number):void
{	
	_color.color=c;
}
public function get col():Number
{	
	return(_color.color);
}
Solitamente avrei dovuto utilizzare il getter/setter così:
Code:
private var _color:ColorTransform;
public function set col(c:ColorTransform):void
{	
	_color=c;
}
public function get col():ColorTransform
{	
	return(_color);
}
Ma dato che mi serviva la proprietà color dell' istanza di ColorTransform (_color) ho optato per incapsulare appunto la proprietà dell'istanza e non l'istanza della classe.

Il secondo punto è questo:
Code:
private function initListeners():void
{	
	color_picker.addEventListener(ColorPickerEvent.CHANGE,settaColore);	
	stage.addEventListener(MouseEvent.MOUSE_DOWN,azionaMouse);	
	stage.addEventListener(MouseEvent.MOUSE_UP,stoppaMouse);
}
private function settaColore(c:ColorPickerEvent):void
{	
	isOpen=false;	
	_color=new ColorTransform();	
	col=c.target.selectedColor;	
	for(var i:int=0;i < selectedClips_array.length;i++)	
	{				
		selectedClips_array[i].transform.colorTransform=_color;
	}
}


A parte i 2 listeners in ascolto su eventi del mouse, c'è un listener in ascolto sul componente ColorPicker e l'evento (CHANGE della classe ColorPickerEvent) viene dispacciato quando l' utente clicca un colore nel pannello colori del componente.

A quel punto il gioco è fatto, ho ottenuto un valore esadecimale che posso utilizzare quando e come voglio.



NB: Per utilizzare questo scipt, tenere un ColorPicker in libreria e al suo identificatore ( nel campo Class ) scrivere: fl.controls.ColorPicker



Allego i files sorgente:
Attached Files
File Type: zip ColorPicker.zip (586.1 KB, 29 views)

__________________

 


I recommend: Essential Actionscript 3.0

- Non rispondo ai messaggi privati con domande tecniche. Apri una discussione sul forum !
- I do not reply technicians pvt messages. Open a thread !

Last edited by Flep; 04-06-08 at 23:50..
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

Reply

Bookmarks

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is On
Trackbacks are On
Pingbacks are On
Refbacks are On
Forum Jump

Similar Threads

Thread Thread Starter Forum Replies Last Post
SimpleGallery - componente per Flash CS3 Flep Componenti di FlepStudio 35 11-11-08 19:07
JellyMenu - componente per Flash CS3 Flep Componenti di FlepStudio 4 25-04-08 14:54
NumericStepper - componente di Flash CS3 Flep Articoli e tutorials 0 29-10-07 06:43
ColorPicker - Flash CS3 Component Flep Tutorials 0 08-10-07 16:14
RadioButton - componente di Flash CS3 Flep Articoli e tutorials 0 21-09-07 10:40


All times are GMT. The time now is 12:25.


Powered by vBulletin versione 3.7.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0 RC4
Forum SiteMap


FlepStudio
by Filippo Lughi
P.IVA 03605860406