در این مطلب به تمام صفحه کردن یا همان fullscreen کردن در اکشن اسکریپت ۳ می پردازیم و دکمه ای را ایجاد می کنیم که با کلیک بر روی آن فلش ما به حالت تمام صفحه رفته و با کلیک مجدد به حالت عادی باز گردد.

دانلود سورس پروژه : fullscreen_as3_iflashlord.zip

برای این کار می بایست از متد displayState مربوط به Stage استفاده کنیم و به آن مقدار دهی نماییم ؛ در حالت عادی مقدار روی normal تنظیم شده است برای تمام صفحه شدن ما مقدار را روی fullScreen قرار می دهیم با این کار فلش به حالت تمام صفحه می رود.

ما به جای مقدار رشته ای می توانیم از ثابت های StageDisplayState استفاده نماییم ، برای normal از StageDisplayState.NORMAL و برای fullScreen از StageDisplayState.FULL_SCREEN استفاده می کنیم. البته شما در استفاده هر دو نوع آزاد هستید.

در ابتدا کلاس های مورد نیاز را import می کنیم :

//وارد کردن کلاس های مورد نیاز
import flash.events.MouseEvent;
import flash.display.Stage;
import flash.display.StageDisplayState;
import flash.display.StageScaleMode;

در مرحله بعد دکمه ای ایجاد می کنیم ، برای این کار در این نمونه از یک MovieClip استفاده می کنیم که ۲ فریم دارد و در فریم اول متن تمام صفحه و در فریم دوم متن حالت عادی را قرار می دهیم، این کار برای این است که در هر زمان بتوانیم عملکرد دکمه را به کاربر نشان دهیم. شما می توانید از نمادهای گرافیکی نیز برای این کار استفاده کنید.

حال رویداد CLICK را برای زمان کلیک کردن روی کمه فعال می کنیم

//ایجاد رویداد کلیک برای دکمه
fullscreen_btn.addEventListener(MouseEvent.CLICK , switchFullScreen , false , 0 , true);

و توسط متد buttonMode ما به MovieClip مان حالت دکمه می دهیم

//ایجاد حالت دکمه ای برای مووی کلیپ
fullscreen_btn.buttonMode =true;

حال تابع switchFullScreen را تعریف می کنیم و درون آن یک if قرار می دهیم تا در زمانی که فلش ما در حالت عادی بود به با کلیک به حالت تمام صفحه برود و زمانی که در حال تمام صفحه بود با کلیک به حالت عادی برود

function switchFullScreen(e:MouseEvent)
{
	if (stage.displayState == StageDisplayState.NORMAL)
	{
		//مقدار دهی تمام صفحه
		stage.displayState = StageDisplayState.FULL_SCREEN;
		//نمایش حالت عادی برای دکمه
		fullscreen_btn.gotoAndStop(2);
	}
	else
	{
		//مقدار دهی حالت نرمال
		stage.displayState = StageDisplayState.NORMAL;
		//نمایش تمام صفحه برای دکمه
		fullscreen_btn.gotoAndStop(1);
	}
}

حال اگر دقت کرده باشید در حالت تمام صفحه پروژه شما نسبت به طول و عرض مانیتور شما کشیده می شود در صورتی که بخواهید جلوی این کشیدگی را بگیرید می بایست از متد stage.scaleMode استفاده کنید و آن را بر روی StageDisplayState.NO_SCALE قرار دهید :

function switchFullScreen(e:MouseEvent)
{
	if (stage.displayState == StageDisplayState.NORMAL)
	{
		//مقدار دهی تمام صفحه
		stage.displayState = StageDisplayState.FULL_SCREEN;
		//برای حفظ ساختار بعد از تمام صفحه شدن - در صورت نیاز
		stage.scaleMode = StageScaleMode.NO_SCALE;
		//نمایش حالت عادی برای دکمه
		fullscreen_btn.gotoAndStop(2);
	}
	else
	{
		//مقدار دهی حالت نرمال
		stage.displayState = StageDisplayState.NORMAL;
		//نمایش تمام صفحه برای دکمه
		fullscreen_btn.gotoAndStop(1);
	}
}

نکته برای استفاده در مرورگرها :

اگر قصد دارید مثلا وبسایت فلش شما در مرورگر نیز امکان تمام صفحه شدن را داشته باشد می بایست یک بخش به تگ Object مربوطه به کد HTML صفحه خود اضافه کنید ، این بخش کد برای تگ Object به این صورت می باشد :

<param name="allowFullScreen" value="true" />

و در صورتی که از تگ Embed (توصیه نمی شود) استفاده می کنید به این صورت :

<embed ... allowfullscreen="true" />

سه نقطه (…) مربوطه به بخش ها و پارامترهایی دیگری می باشد که در کد قرار داده نشده است.

حال می توانید پروژه خود را توسط فایل HTML آن تست نمایید ، برای ایجاد خودکار فایل HTML کلید F12 را بفشارید و البته به یاد داشته باشید فایل ایجاد شده را ویرایش کرده و خط کد مربوطه به allowfullscreen را به پارامترهای کد صفحه اضافه کنید

نمونه ای برای بهتر متوجه شدن محل اضافه کردن کد :

...
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="allowScriptAccess" value="sameDomain" />
<!--محل افزودن کد-->
<param name="allowFullScreen" value="true" />
...

سه نقطه (…) مربوطه به بخش ها و پارامترهایی دیگری می باشد که در کد قرار داده نشده است.

البته توجه داشته باشید که محل قرار گرفتن پارامتر بالاتر و یا پایین تر از دیگر پارامترها مهم نیست.

کد نهایی پروژه :

//وارد کردن کلاس های مورد نیاز
import flash.events.MouseEvent;
import flash.display.Stage;
import flash.display.StageDisplayState;
import flash.display.StageScaleMode;

//ایجاد رویداد کلیک برای دکمه
fullscreen_btn.addEventListener(MouseEvent.CLICK , switchFullScreen , false , 0 , true);
//ایجاد حالت دکمه ای برای مووی کلیپ
fullscreen_btn.buttonMode =true;

function switchFullScreen(e:MouseEvent)
{
	if (stage.displayState == StageDisplayState.NORMAL)
	{
		//مقدار دهی تمام صفحه
		stage.displayState = StageDisplayState.FULL_SCREEN;
		//برای حفظ ساختار بعد از تمام صفحه شدن - در صورت نیاز
		stage.scaleMode = StageScaleMode.NO_SCALE;
		//نمایش حالت عادی برای دکمه
		fullscreen_btn.gotoAndStop(2);
	}
	else
	{
		//مقدار دهی حالت نرمال
		stage.displayState = StageDisplayState.NORMAL;
		//نمایش تمام صفحه برای دکمه
		fullscreen_btn.gotoAndStop(1);
	}
}

دانلود سورس پروژه : fullscreen_as3_iflashlord.zip

در این مطلب می خواهیم به روشی ساده برای اعمال افکت blur به یک شی از نوع BitmapData بپردازیم. توجه داشته باشید این نوع اعمال افکت با افکت ها و Filterهای معمول فلش متفاوت هست و بر روی خود BitmapData اعمال می شود و نه بر روی MovieClip ی که تصویری در آن قرار دارد.

دانلود سورس : blur_effect_bitmapdata_iflashlord.zip 

یک پروژه جدید در نرم افزار ادوبی فلش ایجاد نمایید و یک تصویر را وارد برنامه کنید (Ctrl+R) در این مثال ما از تصویر زیر استفاده کرده ایم.

و کلاس های مورد نیاز را import می کنیم :

import flash.display.BitmapData;
import flash.display.Bitmap;
import flash.geom.Rectangle;
import flash.geom.Point;

در مرحله بعد تابعی با نام blurApply ایجاد می کنیم و آرگمان آن را bmd و از نوع BitmapData قرار می دهیم.

function blurApply(bmd:BitmapData):BitmapData
{
	var effectBlur:BlurFilter = new BlurFilter(4,4,3);
	var rect:Rectangle = new Rectangle(0,0,bmd.width ,bmd.height );
	var point:Point = new Point(0,0);

	bmd.applyFilter(bmd , rect , point , effectBlur);

	return bmd;
}

در این تابع ابتدا یک متغیر با نام effectBlur می سازیم و نوع آن را BlurFilter قرار می دهیم و یک نمونه از کلاس BlurFilter را ایجاد می کنیم ، آرگمان های ورودی این کلاس سه مورد می باشد که دو مورد اول برای ایجاد افکت blur در طول و عرض می باشد و مورد سوم مربوطه به کیفیت این افکت که بر روی شی ما اعمال می شود.

در خط بعد ما یک متغیر از نوع Rectangle با نام rect ایجاد می کنیم ایم متغیر در واقع وظیفه مشخص کردن محدوده ای می باشد که قرار است افکت بر روی آن اعمال شود به همین دلیل دو مقدار اولیه که x, y می باشند و محل شروع را مشخص می کنند با ۰ و ۰ مقدار دهی شده اند و دو مقدار بعدی که مربوطه به عرض و طول می باشند با عرض و طول BitmapData که آرگمان ورودی این تابع می باشد مقدار دهی شده اند.

در خط بعد یک Point نیز با مقدار ۰,۰ ایجاد می کنیم که مشخص کننده گوشه سمت چپ و بالایی شی می باشد. به جای این بخش می توانیم از rect.topLeft نیز استفاده کنیم.

در خط بعد توسط applyFilter اقدام به اعمال افکت بر روی شی خود می نماییم، این متد مربوطه به BitmapData می باشد و آرگمان های ورودی آن به ترتیب مربوطه به شی BitmapData و محدوده مشخص کننده ، point و افکت تعریف شده ، می باشد.

تغییرات مورد نظر ما در این تابع بر روی bmd انجام شده است ، حال bmd را به عنوان مقدار بازگشتی تابع در خط آخر تابع return می کنیم.

تا این مرحله تابع مورد نظر ما ایجاد شد ، حال به نحوه استفاده آن می پردازیم. تصویری که در ابتدا در پروژه وارد کردیم را از stage حذف می کنیم به بخش Library می رویم و AS Linkage آن را با  MyPic مقدار دهی می کنیم.

حال یک متغیر با نام myPic و از نوع MyPic ایجاد می کنیم و آن را با یک نمونه از MyPic مقدار دهی می کنیم.

var myPic:MyPic = new MyPic();//دریافت تصویر از کتابخانه

سپس یک متغیر با نام bit می سازیم و آن را از نوع کلاس Bitmap قرار می دهیم و یک نمونه از کلاس Bitmap را به آن نسبت می دهیم در آرگمان اول مربوطه با کلاس Bitmap مقدار myPic را وارد می کنیم.

var bit:Bitmap = new Bitmap(myPic);

در مرحله بعد نیز خصوصیت BitmapData مربوطه به متغیر bit را توسط تابع ایجاد شده مقدار دهی می کنیم.

bit.bitmapData = blurApply(bit.bitmapData);
addChild(bit);

و در آخر نیز bit را توسط addChild به شی نمایشی (DisplayObject) اضافه می کنیم تا در صفحه نمایش داده شود.

نتیجه به این شکل خواهد بود :

حال اگر در تابع در بخش rect که مربوطه به محدوده ای می باشد که افکت بر روی آن اعمال می شود ، مقدارهای عرض و طول را تقسیم بر ۲ کنیم در واقع افکت بر روی یک چهارم تصویر اعمال می شود.

function blurApply(bmd:BitmapData):BitmapData
{
	var effectBlur:BlurFilter = new BlurFilter(4,4,3);
	var rect:Rectangle = new Rectangle(0,0,bmd.width/2 ,bmd.height/2 );
	var point:Point = new Point(0,0);

	bmd.applyFilter(bmd , rect , point , effectBlur);

	return bmd;
}

و نتیجه خروجی به این شکل خواهد بود :

شما این امکان را دارید که با مقدار دهی دو آرگمان اول rectangle در بخش نمایشی تصویر جا به جایی ایجاد کنید و توسط مقدار دهی دو آرگمان point مختصات محل نمایش بخشی که افکت بر روی آن اعمال شده را تغییر دهید.

در پایان تمام کدهایی که برای این پروژه نیاز می باشد را در زیر قرار می دهیم:

import flash.display.BitmapData;
import flash.display.Bitmap;
import flash.geom.Rectangle;
import flash.geom.Point;

function blurApply(bmd:BitmapData):BitmapData
{
	var effectBlur:BlurFilter = new BlurFilter(4,4,3);
	var rect:Rectangle = new Rectangle(0,0,bmd.width ,bmd.height);
	var point:Point = new Point(0,0);

	bmd.applyFilter(bmd , rect , point , effectBlur);

	return bmd;
}

var myPic:MyPic = new MyPic();//دریافت تصویر از کتابخانه
var bit:Bitmap = new Bitmap(myPic);

bit.bitmapData = blurApply(bit.bitmapData);
addChild(bit);

دانلود سورس : blur_effect_bitmapdata_iflashlord.zip 

همان طور که می دانید درون کلاس ها دسترسی مستقیم به stage و root وجود ندارد به طور مثال در یک کلاس که از یک MovieClip گشترش (extends) داده شده است ، شما نمی توانید stage.stageWidth را trace کنید و در واقع آن را دریافت کنید و مقداری که در زمان trace به شما نشان داده می شود null می باشد. در این مطلب ما به راه حل ساده ای برای این موضوع می پردازیم که توسط آن می توانید به راحتی به stage و root مربوطه به DisplayObject خود دسترسی داشته باشید.

دانلود سورس : stage_root_access_in_class_as3_iflashlord.zip

ابتدا به یک مثال برای مواردی که دسترسی وجود ندارد می پردازیم تا در صورتی که تا به حال با این مورد رو به رو نشده اید ، موضوع بیشتر برای شما باز شود.

package
{
	import flash.events.Event;
	import flash.display.MovieClip;

	public class MyClass extends MovieClip
	{
	   public function MyClass()
		{

		trace(stage);//null
		//trace(stage.stageWidth);//TypeError

		}

	}
}

در مثال بالا شما نمی توانید به stage و stageWidth دسترسی داشته باشید.

حال به راه حل این موضوع می پردازیم ، در صورتی که بخواهیم همین مثال بالا به درستی امکان دسترسی به stage را داشته باشد می بایست ابتدا درون تابع constractor که همیشه هم نام کلاس می باشد (در این مثال MyClsss) ،رویداد (Event.ADDED_TO_STAGE)  را تعریف کرد و آن را به تابعی که در مثال ما added می باشد ارجاع داد ( Event.ADDED_TO_STAGE,added ). حال درون تابع added ما دسترسی کامل به stage داریم و می توانید به طور مثال stage.stageWidth را trace نماییم. در ضمن حال می توانید رویداد تعریف شده را حذف نماییم (removeEventListener).

به کد زیر دقت کنید:

package
{
	import flash.display.MovieClip;
	import flash.events.Event;

	public class MyClass extends MovieClip
	{
	   public function MyClass()
		{
			addEventListener(Event.ADDED_TO_STAGE,added);
		}

		public function added(e:Event):void{
			removeEventListener(Event.ADDED_TO_STAGE,added);
			trace(stage.stageWidth); //محتوای عددی

		}
	}
}

حال این کلاس را می توانیم برای root نیز بیشتر توسعه دهیم و تغییراتی در آن اعمال کنیم، در زیر نمونه کامل شده را مشاهده می کنید :

package {

	import flash.display.DisplayObject;
	import flash.display.MovieClip;
	import flash.display.Stage;
	import flash.events.Event;

	public class MyClass extends MovieClip {

		public static var stage:Stage;
		public static var root:DisplayObject;

		public function MyClass() {
			if (this.stage){
				added();
			}else{
				addEventListener(Event.ADDED_TO_STAGE, added);
			}
			trace(stage); //null
			//trace(stage.width); //TypeError
		}

		private function added(e:Event = null):void {
			if (e){
				removeEventListener(Event.ADDED_TO_STAGE, added);
			}
			MyClass.stage = this.stage;
			MyClass.root = this;

			trace(MyClass.stage)
			trace(MyClass.root)
		}
	}
}

همان طور که در کد بالا مشاهده می کنید دو متغیر static ایجاد شده است که این امکان را به شما می دهد به مقدارهای stage در root بعد از مقدار دهی شدن به راحتی دسترسی داشته باشید.

اگر دوست داشته باشیم کدمان کمی از نمونه کنونی بهینه تر باشد می توانیم با تغییرات کوچکی این کار را انجام دهیم.

package {

	import flash.display.DisplayObject;
	import flash.display.MovieClip;
	import flash.display.Stage;
	import flash.events.Event;

	public class MyClass extends MovieClip {

		public static var stage:Stage;
		public static var root:DisplayObject;

		public function MyClass() {
			if (this.stage){
				added();
			}else{
				addEventListener(Event.ADDED_TO_STAGE, added , false , 0 , true);
			}
			trace(stage); //null
			//trace(stage.width); //TypeError
		}

		private function added(e:Event = null):void {
			if (e){
				removeEventListener(Event.ADDED_TO_STAGE, added);
			}
			MyClass.stage = this.stage;
			MyClass.root = this;

			trace(MyClass.stage)
			trace(MyClass.root)
		}
	}
}

حال شاید این سوال در ذهن شما ایجاد شود که چگونه می توان از این کلاس استفاده نمود ، برای استفاده نیز در زیر به مثالی بسیار ساده می پردازیم.

import MyClass;
var myClass:MyClass = new MyClass();
addChild(myClass);
trace("myClass.stage.stageWidth:"+myClass.stage.stageWidth)

 دانلود سورس : stage_root_access_in_class_as3_iflashlord.zip

کلاس TransitionManager در بسته fl.transitions تعریف شده و برای شبیه سازی جلوه‌های بصری نمایش و مخفی سازی اسلایدها مورد استفاده قرار می‌گیرد.
نوع جلوه‌های بصری این کلاس که  ۱۰ مورد هستند (Blinds, Fade, Fly, Iris, Photo, PixelDissolve, Rotate, Squeeze, Wipe, Zoom)، مشابه effect های نمایشی موجود در برنامه Microsoft PowerPoint است.

برای استفاده از جلوه‌های نمایشی کلاس TransitionManager لازم است که شی جدیدی از نوع کلاس آن تعریف نموده و DisplayObject مورد نظر را به عنوان پارامتر ورودی به ان ارسال نماییم. سپس از متد startTransition استفاده کرده و نوع جلوه ی مذکور را به همراه پارامترهای آن مشخص می‌کنیم.

حال در ادامه به نمونه ای از هر یک از effect های مربوطه به Transition می پردازیم :

توجه نمایید در تمامی مثال های زیر my_mc به MovieClip ی مربوطه می باشد که افکت مربوطه روی آن اعمال می شود.

 Blinds:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Blinds, direction:Transition.OUT, duration:3, easing:None.easeOut, numStrips:50, dimension:1});
}

 Fade:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Fade, direction:Transition.OUT, duration:3, easing:Strong.easeOut});
}

 Fly:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Fly, direction:Transition.OUT, duration:3, easing:Strong.easeOut, startPoint:7});
}

 Iris:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Iris, direction:Transition.OUT, duration:3, easing:Strong.easeOut, startPoint:1, shape:Iris.CIRCLE});
}

 Photo:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Photo, direction:Transition.OUT, duration:3, easing:Strong.easeOut});
}

 PixelDissolve:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:PixelDissolve, direction:Transition.OUT, duration:3, easing:None.easeOut, xSections:35, ySections:35});

 Rotate:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Rotate, direction:Transition.OUT, duration:3, easing:None.easeOut, ccw:false, degrees:720});

 Squeeze:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Squeeze, direction:Transition.OUT, duration:3, easing:None.easeOut, dimension:1});

 Wipe:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Wipe, direction:Transition.OUT, duration:3, easing:Strong.easeOut, startPoint:1});

 Zoom:

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Zoom, direction:Transition.OUT, duration:3, easing:Strong.easeOut});

و در نهایت یک نمونه ترکیبی

import fl.transitions.*;
import fl.transitions.easing.*;

var myTM:TransitionManager = new TransitionManager(my_mc);
myTM.startTransition({type:Zoom, direction:Transition.IN, duration:7, easing:Strong.easeOut});
myTM.startTransition({type:Rotate, direction:Transition.IN, duration:7.5, easing:Bounce.easeOut});
myTM.startTransition({type:PixelDissolve, direction:Transition.IN, duration:5, easing:Strong.easeOut});
myTM.startTransition({type:Fly, direction:Transition.IN, duration:4, easing:Strong.easeOut});

در این مطلب به ایجاد چرخش افقی و یا همان filp horizontal با کمک گرفتن از کلاس Matrix می پردازیم و در این میان به توضیحی بر نحوه تعیین کردن مرکز چرخش یک شی به صورت پویا توسط کد اکشن اسکریپت ۳ نیز می پردازیم.

دانلود سورس : flipHorizontal_cs4.zip

ابتدا کلاس های مورد نیاز را import می کنیم ، البته توجه داشته باشید در صورتی که کدها را در محیط های برنامه فلش و یا دیگر IDE های اکشن اسکریپت می نویسید در زمان نوشتن کد و در زمانی که توسط ( : ) نوع متغییر ها را مشخص می کنید به صورت خودکار کلاسه مورد نظر شما در ابتدای پروژه Import می شود و خط کد مربوطه به صورت خودکار در ابتدای پروژه شما قرار می گیرد. (البته توجه داشته باشید این امکان در نسخه های قدیمی برنامه های فوق الذکر وجود ندارد)

import flash.geom.Matrix;
import flash.geom.Point;
import flash.display.Graphics;
import flash.display.MovieClip;

حال برای ایجاد چرخش و برای این که بتوانیم از آن برای اشیای متعدد استفاده کنیم ،آن را به صورت یک تابع ایجاد می کنیم و نام آن را filpHorizontal قرار می دهیم.

آرگمان اصلی این تابع displayObject هست که شی مورد نظر شما را شامل می شود و آرگمان اختیاری بعدی که برای نمایش مرکز چرخش است که توسط کد ما به شی اعمال می شود در صورتی که این گزینه true باشد در مرکز چرخش شی ما یک دایره سیاه رنگ ایجاد می شود که نمایش دهنده مرکز چرخش کنونی است.

همان طور که در کد مشخص است این دایره یک MovieClip هست که دایره ای با استفاده از فرامین graphics و استفاده از متد drawCircle در آن ایجاد شده است و به محل مربوطه به مرکز چرخش تغییر مختصات داده شده است و به شی اصلی ما addChild شده است.

حال بهتر هست کمی در مورد Matrix ها توضیح داده شود تا با ذهنی باز تر به تحلیل کد بپردازیم:

یک ماتریس (matrix) دگرگونی شی یک ماتریس ۳ در ۳ با محتویات زیر می باشد.

در ماتریس های دگرگونی u ، v و w خواص ارائه قابلیت های اضافی است. کلاس ماتریس (matrix) تنها در فضای دو بعدی عمل می کند ، بنابر این همواره فرض می شود خصوصیت u و v مقدار ۰.۰ و خصوصیت w مقدار ۱.۰ می باشد. در نتیجه ماتریس ما به صورت زیر است :

شما می توانید ۶ خصوصیت دیگر را در ماتریس شی خود (a,b,c,d,tx,ty) را مقدار دهی کنید (set) و یا مقدار آن را دریافت کنید (get).

function flipHorizontal(displayObject:MovieClip , visiblePoint = true):void
{
	//دریافت متریکس کنونی شی و قرار دادن آن در یک متغیر
	var matrix:Matrix = displayObject.transform.matrix;

	trace(matrix.toString());//(a=1, b=0, c=0, d=1, tx=60.55, ty=207.5)
	//[ a  c  tx ]   =>   [ 1  0  60.55 ]
	//| b  d  ty |   =>   | 0  1  207.5 |
	//[ 0  0   1 ]   =>   [ 0  0   1    ]

	//مشخص کردن محل مرکز به صورت پویا
	var pointX:Number = displayObject.width / 2;
	var pointY:Number = displayObject.height / 2;

	//شعاع دایره مشخص کننده مرکز
	var pointRadius:Number = 5;

	var dspWidthDivide:Point = new Point(pointX,pointY);
	matrix.transformPoint(dspWidthDivide);

	if (visiblePoint)
	{

		//ایجاد دایره مربوطه به نمایش مرکز
		var point:MovieClip = new MovieClip();
		point.graphics.beginFill(0x000000);
		point.graphics.drawCircle(0 , 0 , pointRadius);
		point.graphics.endFill();
		//مختصات دهی دایره با توجه به مرکز تعیین شده;
		point.x = pointX - (pointRadius / 2);
		point.y = pointY - (pointRadius / 2);
		//افزودن دایره به شی مربوطه
		displayObject.addChild(point);
	}

	if (matrix.a > 0)
	{
		matrix.a = -1 * matrix.a;
		matrix.tx = displayObject.width + displayObject.x;
	}
	else
	{
		matrix.a = -1 * matrix.a;
		matrix.tx = displayObject.x - displayObject.width;
	}

	//اعمال ماتریکس جدید به شی مربوطه
	displayObject.transform.matrix = matrix;
}

//usuage
flipHorizontal(myMC1);
myMC1.rotation = 15;

حال ما برای چرخش افقی از ترکیب ماتریس دَوران و انعکاس استفاده می کنیم ، ابتدا مقدار مربوطه به ماتریس شی را گرفته (displayObject.transform.matrix) و در یک متغیر قرار می دهیم و حال می توانید همان طور که در بالا گفته شد به مقدارهای مربوطه به این شی دسترسی داشته باشیم و آنها را تغییر دهیم.

در مرحله بعد در کد زیر ماتریس دریافت شده را trace می کنیم تا از دریافت درست داده ها اطمینان حاصل کنیم. در کد برای درک بیشتر به صورت ماتریس هم توضیح داده شده است.

در کد زیر در مرحله بعد دو متغیر برای مشخص کردن وسط شی با تقسیم عرض و طول شی بر ۲ ایجاد می کنیم.

در مرحله بعد شعاع مربوطه به دایره مجازی که مشخص کننده مرکز چرخش هست را مشخص می کنیم.

سپس متغیر dspWidthDivide را که یک point است را ایجاد می کنیم و مقدارهای دو متغییر pointX و pointY را به عنوان آرگمان های آن وارد می کنیم ، حال می توانیم توسط این متغیر و متد matrix.transforPoint مرکز چرخش را به مختصات مورد نظرمان به صورت پویا تغییر دهیم.

در بخش بعدی کد ،اقدام به ایجاد شی دایره برای مرکز و مختصات دهی آن می کنیم.

در مرحله بعدی که مرحله اصلی می باشد ابتدا مقدار a شی خود را چک می کنیم در صورتی که بزرگتر از صفر باشد tx را برابر با عرض شی به اضافه مختصات x شی می کنیم و در غیر این صورت مختصات x شی را منهای عرض شی می کنیم و در هر دو حالت a را برابر با a*-1 مقدار دهی می کنیم.

در آخر نیز به خصوصیت transform.matrix شی displayObject مان مقدار جدید متغیر matrix را اعمال می کنیم.

در پایان نیز برنامه را تست می کنیم ، myMC1 یک MovieClip هست که توسط تابع برای ایجاد چرخش افقی در آن انتخاب شده است و در آخر نیز برای متوجه شدن چرخش و مبنای چرخش توسط متد rotation چرخشی در شی ایجاد شده است تا با توجه به دایره مشکی متوجه چرخش بر مبنای مرکز چرخش شوید.

در این مطلب نحوه ذخیره محتویات یک MovieClip به صورت عکس با فرمت JPEG در Air آموزش داده می‌شود. برای این کار با استفاده از  کلاسه Adobe Encoder یک ByteArray از محتویات MovieClip می‌سازیم و در ادامه این ByteArray را با فرمت JPEG ذخیره می‌کنیم.

دانلود کلاس های مورد نیاز : corelib.zip

1- برای شروع فایل corelib.zip را دانلود کرده و آن را Extract کنید.

۲- برنامه Flash را اجرا کنید و یک پروژه جدید از نوع Air بسازید.

۳- از منوی File گزینه ActionScript Settings را انتخاب کنید.

۴- از پنل Library path روی دکمه Add New Path کلیک کنید سپس روی دکمه Browse to SWC file کلیک کنید و فایل corelib.swc را انتخاب کنید.

۵- روی دکمه OK کلیک کنید تا پنجره ActionScript Settings بسته شود.

۶- روی فریم اول کلیک کنید و پنل Actions را باز کنید.

۷- کلاسه‌های مورد نیاز را Import کنید.

import flash.display.BitmapData;
import com.adobe.images.JPGEncoder;
import flash.filesystem.File;
import flash.filesystem.FileMode;
import flash.filesystem.FileStream;

8- یک متغیر از نوع BitmapData ایجاد کنید و طول و عرض آن را به اندازه MovieClip در نظر بگیرید و با دستور Draw محتویات MovieClip را به BitmapData منتقل کنید. (به جای my_mc نام MovieClip خود را وارد نمایید)

var bd:BitmapData = new BitmapData(my_mc.width, my_mc.height);
bd.draw(my_mc);

9- یک متغیر جدید از نوع JPGEncoder ایجاد کنید. (عدد داخل پرانتز کیفیت فایل خروجی را مشخص می‌کند و ماکزیمم آن ۱۰۰ می‌باشد)، در ادامه یک متغیر ByteArray هم بسازید.

var jpgEncoder:JPGEncoder = new JPGEncoder( 100 );
var byteArray:ByteArray = jpgEncoder.encode( bd );

• به وسیله متغیرJPGEncoder محتویات BitmapData به فرمت JPEG تبدیل می‌شود و سپس در متغیر ByteArray قرار می‌گیرد.

var file:File = new File();
file = file.resolvePath("c:/test.jpg");
var stream:FileStream = new FileStream();

11- به وسیله کدهای زیر مراحل ذخیره سازی را به اتمام برسانید. در این کدها ابتدا File به صورت FileMode.WRITE در پروژه جاری می‌شود سپس به وسیله دستور writeBytes اطلاعات تبدیل شده ByteArray ذخیره می‌شود. دستور try و catch هم به منظور نمایش خطاهای احتمالی به کار گرفته شده است.

try
{
	stream.open( file , FileMode.WRITE);
	stream.writeBytes(byteArray);
	stream.close();
}
catch (e:Error)
{
	trace("Error: " + e.message);
}

در این مطلب نحوه اتصال به یک Web Service و دریافت اطلاعات آن توسط برنامه Air آموزش داده می‌شود. برای این کار از کلاسه‌های Flex در پروژه Flash استفاده خواهد شد. برای مثال در این درس درجه حرارت سلسیوس را به کمک Web Service به درجه فارنهایت تبدیل می‌کنیم.

دانلود سورس : source.zip

1- برنامه Flash را اجرا کنید و یک پروژه از نوع Air بسازید.

۲- از منوی File گزینه ActionScript Settings را انتخاب کنید.

۳- وارد بخش Library Path شوید و روی دکمه Browse To Path کلیک کنید.

۴- حالا پوشه libs را با توجه به آدرس و نسخه نصب شده برنامه Adobe Flash Builder انتخاب کنید. برای مثال:

(Install Path:)\Adobe\Adobe Flash Builder 4\sdks\4.0.0\frameworks\libs

5- بعد از انتخاب این آدرس در پایین پنجره ActionScript Settings وضعیت Default linkage را روی Merged into code قرار دهید.

۶- روی OK کلیک کنید تا کلاسه Flex در پروژه تعریف شود.

۷- حالا از پنل Components و با استفاده از شاخه User Interface یک Button، دو Text Input و دو Label به داخل صفحه Drag کنید و یک فرم شبیه فرم زیر بسازید.

۸- در ادامه تنظیمات این Component‌ها را به صورت زیر تغییر دهید.

۹- حالا روی فریم اول کلیک کنید و پنل Actions را باز کنید.

۱۰- در ابتدا لازمه که کلاسه‌های مورد نیاز را Import کنید.

import flash.display.MovieClip;
import flash.events.MouseEvent;
import mx.rpc.soap.*;
import mx.rpc.events.*;

11- حالا یک متغیر WebService ایجاد می‌کنیم.

var webService:WebService;

12- در این آموزش بعد از کلیک روی دکمه convert اطلاعات فیلد متنی درجه سلسیوس به Web Service فرستاده می‌شود و سپس اطلاعات دریافتی از Web Service در فیلد متنی درجه فارنهایت نشان داده می‌شود. پس یک Event Listener برای دکمه تعریف می‌کنیم.

startButton.addEventListener(MouseEvent.CLICK, SetupWebService);

13- برای ادامه باید تابع SetupWebService را تعریف کنیم که بعد از کلیک روی دکمه convert فراخوانی می‌شود.

function SetupWebService(event:MouseEvent):void
{
	webService = new WebService();
	webService.loadWSDL("http://www.w3schools.com/webservices/tempconvert.asmx?WSDL");
	webService.addEventListener(LoadEvent.LOAD, BuildServiceRequest);
}

در این تابع:

• لینک http://www.w3schools.com/webservices/tempconvert.asmx فراخوانی می‌شود. به جای این آدرس می‌توانید از هر آدرس دیگری استفاده کنید. دستور ?WSDL این آدرس را به صورت XML تعریف می‌کند تا در Flash قابل استفاده باشد.
• بعد از Load شدن محتویات لینک با تعریف یک Event Listener برای webService تابع BuildServiceRequest فراخوانی می‌شود.

function BuildServiceRequest(evt:LoadEvent)
{
	webService.CelsiusToFahrenheit(c.text);
	webService.CelsiusToFahrenheit.addEventListener(ResultEvent .RESULT, onResult);
	webService.CelsiusToFahrenheit.addEventListener(FaultEvent. FAULT, onFault);
}

در این تابع:

• اطلاعات فیلد متنی سلسیوس (c.text) به اپراتور CelsiusToFahrenheit که در لینک Web Service قابل مشاهده است، فرستاده می‌شود.
• دو Event Listener برای webService تعریف شده است که اولی بعد از کامل شدن عملیات و دومی‌درصورت بروز خطا فراخوانی می‌شوند.

function onResult(event:ResultEvent)
{
	f.text = String(event.result);
}

function onFault(event:FaultEvent)
{
	trace("error");
	trace(event.fault.getStackTrace());
}

در تابع onResult:

• اطلاعات دریافتی از Web Service در فیلد متنی فارنهایت نمایش داده می‌شود.

در تابع onFault:

• خطای به وجود آمده در فرایند ارسال و دریافت اطلاعات نمایش داده می‌شود.

در این مطلب با نحوه پرینت گرفتن از یک MovieClip آشنا می‌شوید. برای این کار از کلاسه PrintJob استفاده می‌شود و مطابق با عرض صفحه کاغذ، اندازه MovieClip تغییر می‌کند.

۱- ابتدا باید کلاسه‌های مورد نیاز import شوند.

import flash.printing.PrintJob;
import flash.geom.Rectangle;

2- حالا تابع printMovieClip را به صورت زیر تعریف کنید:

function printMovieClip(clip:MovieClip)
{
	var printJob:PrintJob = new PrintJob();
	var numPages:int = 0;
	var printArea:Rectangle;
	var printHeight:Number;
	var printY:int = 0;
	if (printJob.start())
	{
		/* تغییر سایت مووی کلیپ برای فیت شدن در عرض صفحه */
		if (clip.width > printJob.pageWidth)
		{
			clip.width = printJob.pageWidth;
			clip.scaleY = clip.scaleX;
		}
		/*  با توجه به طول و عرض صفحه و کشیدگی ایجاد شده برای فیت شدن  printArea   تعریف  */
		printArea = new Rectangle(0,0,printJob.pageWidth / clip.scaleX,printJob.pageHeight / clip.scaleY);
		/* محاسبه تعداد صفحات مورد نیاز با توجه به طول مووی کلیپ */
		numPages = Math.ceil(clip.height / printJob.pageHeight);

		/* print job افزودن صفحه ها به */
		for (var i:int = 0; i < numPages; i++)
		{
			printJob.addPage(clip, printArea);
			printArea.y +=  printArea.height;
		}
		/* به پرینتر print job ارسال  */
		printJob.send();
		/* از حافظه print job حذف   */
		printJob = null;
	}
}

در این تابع:

• ابتدا متغیرهای لازم برای صفحه بندی و چاپ MovieClip ایجاد شده است.
• سپس با دستور printJob.start عملیات ارسال صفحات به متغیر printJob آغاز می‌شود.
• درصورتی که عرض MovieClip از عرض صفحه کاغذ بزرگتر باشد، عرض MovieClip به اندازه عرض کاغذ در آمده و ارتفاع MovieClip به نسبت عرض کوچک می‌شود تا MovieClip کاملا در کاغذ قرار گیرد.
• سپس ناحیه ای از MovieClip که باید چاپ شود، تعیین می‌شود. این ناحیه فضایی است که در یک صفحه کاغذ جا می‌شود.
• در ادامه با توجه به ارتفاع تبدیل شده MovieClip تعداد صفحات مورد نیاز در متغیر numPages قرار می‌گیرد.
• به کمک یک حلقه for و با دستور printJob.addPage صفحات برای چاپ شدن به متغیر printJob اضافه می‌شود و در هر بار ناحیه مورد نیاز برای چاپ با تغییر ارتفاع printArea، تغییر می‌کند.
• در ادامه با دستور printJob.send اطلاعات به پرینتر ارسال می‌شود و در نهایت متغیر printJob از حافظه پاک می‌شود.

برای استفاده از این تابع فقط کافیست آن را فراخوانی کنید و نام MovieClip مورد نظر را به آن نسبت دهید.

printMovieClip(my_mc);

+ منبع

هرگاه نیاز به چیدمان‌های دوار و کنترل شکل‌های دایره ای باشد، بهتر است که از مختصات قطبی استفاده شود. با توجه به این که فلش از مختصات کارتزین استفاده می‌کند، باید مختصات قطبی را به مختصات کارتزین تبدیل کرد. در این درس نحوه استفاده از این تبدیل برای دستیابی به آرایش حلزونی MovieClip‌ها آموزش داده می‌شود که یک نمونه از آن در شکل۱ آمده است.

دانلود سورس : source_pole_to_2d

شکل ۱- آرایش حلزونی MovieClip‌ها

در شکل ۲ محورهای مختصات کارتزین و قطبی و نحوه تبدیل آن‌ها آمده است.

شکل ۲- نحوه تبدیل مختصات قطبی به کارتزین

مراحل کار به شرح زیر می‌باشد:

۱- یک پروژه جدید Action Script 3.0 ایجاد کنید و برای مثال اندازه آن را ۸۰۰ در ۶۰۰ پیکسل در نظر بگیرید.

۲- در این درس بعنوان مثال ۶۰ MovieClip ایجاد شده است و به ترتیب از mc1 تا mc60 نامگذاری شده اند. توجه کنید که نقطه مبدا این MovieClip‌ها باید در گوشه چپ و وسط باشد (به فایل sample.zip توجه کنید).

۳- پنل Actions را باز کنید.

۴- کلاسه MovieClip را Import کنید.

var holder:MovieClip = new MovieClip();

5- حالا یک آرایه از MovieClip‌ها بسازید.

var fields:Array = [mc1, mc2, mc3, mc4, mc5, mc6, mc7, mc8, mc9, mc10, mc11, mc12, mc13, mc14, mc15, mc16, mc17, mc18, mc19, mc20, mc21, mc22, mc23, mc24, mc25, mc26, mc27, mc28, mc29, mc30, mc31, mc32, mc33, mc34, mc35, mc36, mc37, mc38, mc39, mc40, mc41, mc42, mc43, mc44, mc45, mc46, mc47, mc48, mc49, mc50, mc51, mc52, mc53, mc54, mc55, mc56, mc57, mc58, mc59, mc60];

6- در ادامه سه متغیر یرای شعاع، زاویه و محور سوم (در مختصات استوانه ای) ایجاد می‌شود. در این مثال از متغیر scaleX , scaleY برای محور سوم استفاده می‌شود. مقادیر اولیه برای این ۳ متغیر را تعیین کنید.

var radius:Number = 150;
var theta:Number = 0;
var scale:Number = 1;

7- یک متغیر از نوع MovieClip بعنوان حامل ایجاد کنید.

var holder:MovieClip = new MovieClip();

8- سپس به وسیله یک حلقه، MovieClip‌ها در حامل چیده می‌شود.

for (var i:Number = 0; i < fields.length; i++)
{
	var item_holder:MovieClip = MovieClip(fields[i]);
	var radian:Number = theta * Math.PI / 180;
	item_holder.x = radius * Math.cos(radian);
	item_holder.y = radius * Math.sin(radian);
	item_holder.rotation = theta;
	item_holder.scaleX = scale;
	item_holder.scaleY = scale;
	radius -=  2;
	theta +=  7;
	scale -=  0.01;
	holder.addChild(item_holder);
}

در این حلقه:

• ابتدا item_holder بعنوان شاخص هر MovieClip تعریف شده است.
• در خط دوم مقدار زاویه از درجه به رادیان تبدیل شده است.
• سپس با توجه به شکل ۲ مقادیر شعاع و زاویه در مختصات قطبی به مقادیر x و y در مختصات کارتزین تبدیل شده است.
• در ادامه اندازه هر MovieClip بعنوان محور سوم تعریف شده است.
• در نهایت به منظور دستیابی به چیدمان حلزونی مقادیر شعاع، زاویه و اندازه تغییر کرده است تا MovieClip بعدی با مقادیر جدید چیده شود.
• سپس MovieClip به حامل اضافه شده است.

۹- در آخر موقعیت حامل تعیین و به stage اضافه می‌شود.

holder.x = 350;
holder.y = 250;
addChild(holder);

//ساخت یک شی از نوع کلاس بارگزارنده
var my_Loader:Loader = new Loader();

//تعریف متغییری از نوع مووی کلیپ
var my_loadedSwf:MovieClip;

//با تعریف رویداد برای بارگزارنده زمان پایان بارگزاری فایل فلش خارجی (خارج از پروژه) خود را متوجه می شویم
my_Loader.contentLoaderInfo.addEventListener(Event.COMPLETE, finishLoading);

//توسط این خط رویداد های مربوطه به خطا ها را دریافت می کنیم
my_Loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, errorHandler);

//سپس توسط فرمان زیر فایل مورد نظر خودمان را در بارگزارنده بارگزاری می کنیم
my_Loader.load(new URLRequest("test.swf"));

// به طور ما درون فایل مربوطه تابعی با نام
//testing()
// تعریف کرده ایم و برای دریافت آن محتوای بارگزاری شده را به یک متغییر انتقال می دهیم.

//تابع مربوطه به زمان بارگزاری کامل
function finishLoading(loadEvent:Event) {
my_loadedSwf = loadEvent.currentTarget.content;

addChild(my_loadedSwf);

//توسط خط زیر تابع درون فایل خارجی ما فراخوانی می شود
my_loadedSwf.testing();
}

// هندل کردن رویدادهای خطا
function errorHandler(errorEvent:Event):void {
trace("فایل یافت نشد!");
}