در این مطلب به ساخت StyleSheet داخلی (INTERNAL) در اکشن اسکریپت ۳ می پردازیم ، این موارد برای زمانی که شما نیازی به فایل CSS خارجی نداشته باشید و بخواهید از فرامین قالب بندی CSS درون اکشن اسکریپت استفاده کنید، برای این کار از کلاس StyleSheet استفاده می کنیم.

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

import flash.text.StyleSheet;

در مرحله بعد متغییر css را تعریف می کنیم و نوع آن را StyleSheet قرار می دهیم و یک نمونه از کلاس StyleSheet را به عنوان مقدار آن قرار می دهیم.

var css:StyleSheet = new StyleSheet();
css.setStyle("p", {color: "#FF0000"});

example_txt.styleSheet = css;
example_txt.text = "<p>iflashlord.com</p> sample text!"

سپس با استفاده از متد setStyle فرامین مربوطه به css را مقدار دهی می کنیم ، در این مثال به تگ پاراگراف در HTML می باشد که با (p) مشخص می شود ، خصوصیت color که مربوطه به رنگ می باشد به آن نسبت داده شده است. توجه نمایید مقدارهای هر تگ یا کلاس یا شناسه در CSS به صورت یک Object به عنوان آرگمان دوم متد setStyle مقدار دهی می شود. آرگمان اول نیز به صورت رشته متنی (String) می باشد و مربوطه به نام تگ (به طور مثال p) نام کلاس (به طور مثال .test ) و نام شناسه (به طور مثال #test ) و… می باشد.

در مرحله بعد متغیر css را به عنوان متد styleSheet مربوطه به تکست فیلد مقدار دهی می کنیم.

و در مرحله آخر محتوای متنی HTML خود را به فیلد متنی نسبت می دهیم و نتیجه را مشاهده می کنیم ، طبق کد بالا می بایست متن iflashlord.com به صورت قرمز (FF0000) چاپ شود و باقی متون با رنگ پیش فرض تکست فیلد.

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

ویژگی پویایی، از جمله امکاناتی است که در گذشته در زبان اکشن اسکریپت وجود نداشت، اما از نسخه ۳ و FP9 به آن اضافه شد.

تنها تفاوت یک کلاس پویا، با کلاس غیر پویا در این است که کلاس پویا می‌تواند در زمان اجرا، صفات جدیدی را بپذیرد. در واقع به سادگی مقدار دهی به یک متغیر، می‌توان یک صفت جدید (property یا function یا حتی object) را به اشیائی که از یک کلاس پویا ایجاد شده‌اند اضافه نمود.

این تفاوت کوچک در عمل، کار و تعامل با کلاس‌های پویا را تا حد زیادی ساده می‌کند. از آنجا که شئ‌گرایی در AS 3.0 حد و مرز ندارد، در حین طراحی یک برنامه واقعی به دفعات اتفاق می‌افتد که بخواهیم صفات جدیدی را در زمان اجرا و تحت شرایطی خاص، به یک شئ اضافه نموده و یا از آن به عنوان یک حامل یا ظرف (Container) استفاده کنیم.

تعریف کلاس پویا:

package {
public dynamic class TestClass {
//defenition
}
}

اضافه کردن صفت در زمان اجرا:

var dynaObject: TestClass = new TestClass();

var obj:Object = new Object();
var idx:Array = new Array(1,2,3,4,5,6,7,8,9);

dynaObject.propTest = "newProperty";
dynaObject.obj = obj;
dynaObject["idx"] = idx;

trace(dynaObject.propTest, dynaObject.obj, dynaObject.idx);
//newProperty [object Object] 1,2,3,4,5,6,7,8,9

در استفاده از کلاس‌های پویا این دو نکته را به خاطر داشته باشید که:

- صفات پویا به instance اضافه می‌شوند نه خود کلاس.

- ویژگی پویایی در کلاس‌ها به ارث برده نمی‌شود.

توضیح: مقصود از “صفت” در AS 3.0، هم property و هم function یا method است.

+منبع

بهینه سازی در فلش یک اصل مهم به حساب می آید و افزایش و کار بر روی آن برای توسعه دهندگان فلش امری الزامی است. به عنوان یک توسعه دهنده فلش و به عنوان کسی که برای آینده این نرم افزار بزرگ احساس مسئولیت می کند ، ما وظیفه داریم در ساخت عناصر فلش که کارایی بهتری دارند پیش گام باشیم و همواره بهترین و بهینه ترین روش را استفاده کنیم. در این مجموعه آموزشی بهینه سازی فلش به نکات مهم برای مدیریت بر عناصر و حافظه ها … می پردازیم و تلاش می کنیم که بتوانیم با استفاده از نکات ارائه شده خروجی بهینه تر و سبک تری از پروژه فلش خود داشته باشیم.

بخش هفتم – انجماد (ثابت کردن) اشیاء و آزاد کردن اشیاء

برای بهینه سازی کد خود ، سعی کنید همیشه ازثابت کردن (Freeze) و آزاد کردن (Unfreeze) اشیاء استفاده کنید. این موارد برای همه اشیاء مهم هستند ، اما به صورت ویژه برای Display Object ها مهم هستند. حتی اگر شی نمایشی (Display Object) مدت زیادی در لیست نمایشی (Display List) نباشد و در انتظار جمع آوری زباله (Garbage collection) باشد ، این اشیاء می توانند هنوز حافظه و  CPU را درگیر خود کنند.

برای مثال ، ما می توانید با استفاده از Event.ENTER_FRAME رویدادی کیبورد را کنترل کنید ، در نتیجه شما امکان freeze کردن و unfreeze کردن را با رویداد های Event.REMOVE_FROM_STAGE و Event.ADDED_TO_STAGE در اختیار دارید.

مثال زیر نمونه این کار را در قالب Movie Clip ی که در حال پخش در stage هست و با کنترلر کیبورد در تعامل می باشد ، را مشاهده می کنید :

// تعریف رویداد های کیبورد

stage.addEventListener(KeyboardEvent.KEY_DOWN, keyIsDown);

stage.addEventListener(KeyboardEvent.KEY_UP, keyIsUp);

// ساخت یک شی برای ذخیره کردن کلید تعیین شده

var keys:Dictionary = new Dictionary(true);

function keyIsDown(e:KeyboardEvent):void
{

	// به یاد داشتن کلیدی که فشرده شده است

	keys[e.keyCode] = true;

	if (e.keyCode == Keyboard.LEFT || e.keyCode == Keyboard.RIGHT)
	{

		runningBoy.play();

	}

}

function keyIsUp(e:KeyboardEvent):void
{

	// به یاد داشتن کلیدی که بعد از فشرده شدن رها شده است

	keys[e.keyCode] = false;

	for each (var value:Boolean in keys)
	{

		if (value)
		{
			return;
		}
	}

	runningBoy.stop();

}

runningBoy.addEventListener(Event.ENTER_FRAME, handleMovement);

runningBoy.stop();

var currentState:Number = runningBoy.scaleX;

var speed:Number = 15;

function handleMovement(e:Event):void
{

	if (keys[Keyboard.RIGHT])
	{

		e.currentTarget.x +=  speed;

		e.currentTarget.scaleX = currentState;

	}
	else if (keys[Keyboard.LEFT])
	{

		e.currentTarget.x -=  speed;

		e.currentTarget.scaleX =  -  currentState;

	}

}

زمانی که روی دکمه مربوطه به حذف با نام  removeBtn کلیک شود ، Movie Clip از لیست نمایش (Display List) حذف می شود:

// نمایش یا حذف مووی کلیپ توسط رویداد های دکمه های مربوطه

showBtn.addEventListener(MouseEvent.CLICK,showIt);

removeBtn.addEventListener(MouseEvent.CLICK,removeIt);

function showIt(e:MouseEvent):void
{

	addChild(runningBoy);

}

function removeIt(e:MouseEvent):void
{

	// حذف مووی کلیپ در صورتی موجود بودن

	if (contains(runningBoy))
	{
		removeChild(runningBoy);
	}

}

زمانی که Movie Clip از لیست نمایش حذف می شود ، Movie Clip هنوز رویداد Event.ENTER_FRAME را ارسال می کند. Movie Clip اجرا می شود ولی رندر (Render) نمی شود. برای ایجاد دستگیره به این وضعیت به صورت درست ، می بایست رویداد های دیگری را برای حذف تعریف کنیم ، برای پیش گیری از فشاری که این مساله به CPU وارد می آورد :

// Listen to Event.ADDED_TO_STAGE and Event.REMOVED_FROM_STAGE

runningBoy.addEventListener(Event.ADDED_TO_STAGE,activate);

runningBoy.addEventListener(Event.REMOVED_FROM_STAGE,deactivate);

function activate(e:Event):void
{

	// باز نشانی همه چیز

	e.currentTarget.addEventListener(Event.ENTER_FRAME,handleMovement);

}

function deactivate(e:Event):void
{

	//فریز کردین مووی کلیپ برای داشتن کمترین مصرف از سی پی یو در حالتی که مووی کلیپ حذف شده است

	e.currentTarget.removeEventListener(Event.ENTER_FRAME,handleMovement);

	e.currentTarget.stop();

}

زمانی که دوباره روی دکمه showBtn کلیک می شود ، Movie Clip باز نشانی می شود و رویداد Event.ENTER_FRAME دوباره به آن داده می شود ، و کیبورد به صورت درست باز هم امکان کنترل Movie Clip را دارد.

نکته : اگر شی نمایشی از لیست نمایش حذف شده است ،به مرجع آن مقدار null (تهی) بدهید تا اطمینان داشته باشید که شی freeze شده است. اگر جمع آورنده زباله (garbage collector) اجرا نشود ، شی همچنان به مصرف حافظه و پردازش CPU ادامه می دهد، حتی اگر شی نمایش داده نشود.

برای اطمینان از این که شی کمترین مصرف حافظه و پردازش CPU را دارد ، می بایست زمانی که شی از لیست نمایش حذف می شود ، کاملا freeze شده باشد.

از نسخه ۱۰ فلش پلیر ، در صورتی که پخش کننده اصلی در فریم ها به فریم خالی برسد ، شی نمایشی به صورت خودکار freeze می شود، حتی اگر شما هیچ کاری برای انجماد (freeze) کردن اشیاء انجام ندهید.

مفهوم انجماد در هنگام بارگزاری از دور(یا خارج) توسط کلاس Loader نیز مهم می باشد. زمانی که از کلاس Loader توسط فلش پلیر ۹ استفاده می کنید ، نیاز هست که به صورت دستی محتوا را در زمانی که رویداد Event.UNLOAD توسط شی LoaderInfo ارسال می شود freeze کنید. هر شی ی می بایست به صورت دستی freeze شود ، که کار سخت و بیهوده می باشد.

فلش پلیر ۱۰ متدی جدیدی برای کلاس Loader با نام unloadAndStop() معرفی کرده است. که این متد به شما این امکان را می دهد که فایل swf در زمان unload به صورت خودکار تمامی اشیاء بارگزاری شده را  freeze کند و فلش پلیر را مجبور به اجرای جمع آورنده زباله (garbage collection) بعد از عمل freeze کند.

در کد زیر یک فایل SWF توسط متد unload() بعد از بارگزاری شدن unload می شود ، که نیاز به پردازش بیشتر و freeze دستی دارد :

var loader:Loader = new Loader();

loader.load( new URLRequest ( "content.swf" ) );

addChild( loader );

stage.addEventListener( MouseEvent.CLICK, unloadSWF );

function unloadSWF( e:MouseEvent ):void
{

	// Unload the SWF file with no automatic object deactivation

	// All deactivation must be processed manually

	loader.unload();

}

بهترین راه استفاده از متد unloadAndStop() ، که یک دستگیره بومی برای اجبار جمع آوری زباله در روند اجرا ایجاد می کند ، می باشد:

var loader:Loader = new Loader();

loader.load( new URLRequest ( "content.swf" ) );

addChild( loader );

stage.addEventListener( MouseEvent.CLICK, unloadSWF );

function unloadSWF( e:MouseEvent ):void
{

	// Unload the SWF file with automatic object deactivation

	// All deactivation is handled automatically

	loader.unloadAndStop();

}

در زیر به فهرستی از مواردی که unloadAndStop آنها را برای فایل های swf بارگزاری شده آماده می کند را مشاهده می کنید :

* ایست کردن تمامی MovieClip ها
* ایست کردن تمامی صداهای در حال پخش و Stream (پخش در جریان)
* ایست و حذف همه تایمر (Timer) های استفاده شده
* حذف همه شنونده های رویداد عمومی ، برای enterFrame , exitFrame , frameconstructed , activeate , deactivate
* حدف همه شنونده های مربوطه به  stage که توسط فرزند (child) ایجاده شده است
* بستن همه NetConnection ها و NetStream ها (Video.attachNetStream/attachCamera(0) – Microphone.setLoopback(0))
* حدف فونت های AS3 از جدول فونت های عمومی
* ایست ؛ socket ها ، xmlsocket ها ،دانلودهای filerefrence ، و دیگر اشاء مربوطه به دانلود (grandchildren (سطح نوه والد) ) و…
* آزاد کردن bitmap های در ارتباط با cacheAsBitmap و filterها و…

موفق و پیروز باشید.

بهینه سازی در فلش یک اصل مهم به حساب می آید و افزایش و کار بر روی آن برای توسعه دهندگان فلش امری الزامی است. به عنوان یک توسعه دهنده فلش و به عنوان کسی که برای آینده این نرم افزار بزرگ احساس مسئولیت می کند ، ما وظیفه داریم در ساخت عناصر فلش که کارایی بهتری دارند پیش گام باشیم و همواره بهترین و بهینه ترین روش را استفاده کنیم. در این مجموعه آموزشی بهینه سازی فلش به نکات مهم برای مدیریت بر عناصر و حافظه ها … می پردازیم و تلاش می کنیم که بتوانیم با استفاده از نکات ارائه شده خروجی بهینه تر و سبک تری از پروژه فلش خود داشته باشیم.

بخش پنجم – آزاد سازی حافظه (Memory)

شما نمی توانید جمع آور زباله (garbage collector) را به صورت مستقیم در فلش پلیر اجرا کنید. برای این که اطمینان پیدا کنید که یک شی جمع آوری شده است می بایست تمامی منابع آن را حذف کنید. به یاد داشته باشید که عملگر مورد استفاده در اکشن اسکریپت ۱ و ۲ رفتار متفاوتی در اکشن اسکریپت ۳ دارد. این مورد را تنها می توان برای حذف خصوصیات پویا (Dynamic) از یک شی پویا استفاده نمود.

توضیح : جمع آوری زباله (Garbage collection) یک اصطلاح می باشد که به عمل پاک سازی و جمع آوری اشیاء  (object) هایی که استفاده ای نمی شوند و حافظه را اشغال کرده اند ، اطلاق می شود.

تذکر: شما می توانید جمع آوری کننده زباله (garbage collector) را در ادوبی ایر (Adobe AIR) و نسخه  (Debug) فلش پلیر به صورت مستقیم فراخوانی کنید.

به عنوان مثلا ،در کد زیر منابع یک Sprite را برابر با null قرار می دهیم ؛ و با این کار جمع آور زباله آن را از حافظه حذف می کند.

var mySprite:Sprite = new Sprite();

// منابع مربوطه با نال (تهی) مقدار دهی شد و در نتیجه جمع آور زباله این مورد را از حافظه حدف می کند.
mySprite = null;

به یاد داشته باشید زمانی که به یک شی مقدار null را می دهید ، لزوما از حافظه حذف نخواهد شد. بعضی اوقات اگر حافظه موجود کمتر از مقدار کافی به نظر نرسد جمع آور زباله (garbage collector) اجرا نمی شود. جمع آوری زباله (Garbage collection) قابل پیشبینی نیست.

تخصیص درست حافظه ، ترجیح داده می شود به حذف شی (obejct) و آغاز جمع آوری زباله.

زمانی که جمع آورنده زباله (garbage collector) اجرا می شود ،فهرستی از اشیاء ی که جمع آوری نشده است را ایجاد می کند. حال اشیاء غیر فعال درون فهرست که دیگر استفاده نمی شوند ، با تشخیص منابع اشیاء در دیگر اشیاء ، مشخص می شود ، اشیاء غیرفعال شناسایی شده از این راه حذف می شوند.

در برنامه های بزرگ ، این فرایند می تواند باعث تشدید فشار بر پردازنده (CPU-intensive) ، تاثیر بر کارایی برنامه (performance) و کاهش قابل توجه سرعت در برنامه شود. سعی کنید به منظور محدود کردن جمع آوری زباله (garbage collection) تا آن جا که امکان پذیر است از ، استفاده دوباره از اشیاء استفاده کنید.

همچنین از دادن مقدار null به منابع بی استفاده ، در زمانی که امکان دارد ، استفاده کنید. با این کار جمع آورنده زباله (garbage collector) پردازش کمتری برای پیدا کردن اشیاء خواهد داشت. می توان به جمع آوری زباله (garbage collection) مثل بیمه حافظه مصرفی یک برنامه نگاه کرد ، و در ضمن همیشه سعی کنید به مدیریت طول عمر اشیاء (در صورت امکان) دقت کنید.

تذکر : تعیین یک مرجع از یک شی نمایشی (display object) با مقدار null تضمینی برای این که آن شی منجمد (freeze) شده باشد نیست. شی همچنان به مصرف پردازنده (CPU) در سیکل زمانی  ادامه می دهد تا زمانی که جمع آوری زباله انجام شود. قبل از مقدار دهی منابع به null ،  اطمینان حاصل کنید که شی شما به درسی غیر فعال شده است.

جمع آورنده زباله را می توانید با استفاده از متد System.gc() فراخوانی کنید ، البته توجه داشته باشید این فراخوانی مستقیم مربوطه به Adobe Air و فلش پلیر نسخه Debug می باشد. Profiler toolbar ی که همراه برنامه Adobe Flash Builder می باشد به شما این امکان را می دهد که به صورت دستی جمع آور زباله (garbage collector) را شروع کنید. با اجرای جمع آورنده زباله شما این امکان را دارید که مشاهده کنید که چگونه برنامه شما پاسخ می دهد و آیا اشیاء به درستی از حافظه حذف شده است یا خیر.

تذکر : اگر یک شی به عنوان یک شنونده (listener) رویداد استفاده شده است ، شی دیگر می تواند به آن ارجاع شود. اگر این حالت باشد ، می بایست رویداد شنوندها توسط متد removeEventListener() قبل از مقدار دهی null به شی حذف شود.

خوشبختانه ، مقدار حافظه استفاده شده توسط bitmap ها را می توان مستقیم کاهش داد. به عنوان مثل کلاس BitmapData دارای متد dispose() می باشد. در مثال بعدی ، یک BitmapData ایجاد می کنیم (۱.۸MB  حافظه). حافظه جاری به مقدار ۱.۸MB افزایش پیدا می کند. توسط خصوصیت System.totalMemory می توانیم خروجی حافظه اشغال شده را مشاهده کنیم :

trace(System.totalMemory / 1024);
// خروجی : ۴۳۱۰۰

//  ساخت یک نمونه BitmapData
var image:BitmapData = new BitmapData(800, 600);

trace(System.totalMemory / 1024);
// خروجی : ۴۴۹۶۴

در مثال بعدی BitmapData ساخته شده به صورت دستی از حافظه حذف می شود (با کمک متد dispose) و دوباره مقدار حافظه چک می شود :

trace(System.totalMemory / 1024);
// خروجی: ۴۳۱۰۰
//  ساخت یک نمونه BitmapData
var image:BitmapData = new BitmapData(800, 600);

trace(System.totalMemory / 1024);
// خروجی : ۴۴۹۶۴

image.dispose();
image = null;

trace(System.totalMemory / 1024);
// خروجی : ۴۳۰۸۴

اگر چه متد dispose() پیکسل ها را از حافظه حذف می کند ،  می بایست هنوز به مرجع مقدار null (تهی) داده شود تا رها سازی به صورت کامل انجام شود. همیشه سعی کنید زمانی که نیازی به شی BitmapData ندارید از متد dispose() استفاده کنید و به مرجع نیز مقدار تهی (null) اختصاص دهید ، با این کار حافظه بلافاصله آزاد می شود.

تذکر : فلش پلیر ۱۰.۱ و ادوبی ایر ۱.۳.۲ متد جدیدی با نام disposeXML() بر روی کلاس های System معرفی نموده اند. این متد به شما این امکان را می دهد که با مقدار دهی XML tree به عنوان پارامتر آن ، شی XML را بلافاصله برای جمع آوری زباله (garbage collection) آماده کنید.

موفق و پیروز باشید.

بهینه سازی در فلش یک اصل مهم به حساب می آید و افزایش و کار بر روی آن برای توسعه دهندگان فلش امری الزامی است. به عنوان یک توسعه دهنده فلش و به عنوان کسی که برای آینده این نرم افزار بزرگ احساس مسئولیت می کند ، ما وظیفه داریم در ساخت عناصر فلش که کارایی بهتری دارند پیش گام باشیم و همواره بهترین و بهینه ترین روش را استفاده کنیم. در این مجموعه آموزشی بهینه سازی فلش به نکات مهم برای مدیریت بر عناصر و حافظه ها … می پردازیم و تلاش می کنیم که بتوانیم با استفاده از نکات ارائه شده خروجی بهینه تر و سبک تری از پروژه فلش خود داشته باشیم.

بخش چهارم – فعال سازی(Activate) و غیر فعال سازی(Deactivate) رویدادها

از زمان انتشار فلش پلیر ۹ (Flash Player 9) دو رویداد (Event) به فلش افزوده شد (رویداد Event.ACTIVATE و رویداد Event.DEACTIVATE) این رویداد ها می توانند برای شما امکان تنظیم برنامه خود برای استفاده از کمترین میزان سیکل پردازنده (CPU) را امکان پذیر سازند.

این رویداد ها این امکان را به شما می دهند که زمانی که روی فلش شما تمرکز (فوکوس) می شود و یا زمانی که تمرکز (فوکوس) از روی آن خارج می شود را تشخیص دهید. در نتیجه ، می توان کد را برای نشان دادن واکنش به تغییرات فعال و غیر فعال شدن بهینه سازی نمود.

نکته : استفاده از رویدادهای Event.ACTIVATE و Event.DEACTIVATE برای تشخص عدم فعالیت برنامه ای که در پس زمینه کاری قرار دارد و بهینه سازی برنامه شما مناسب می باشد.

در کد زیر از هر دو رویداد استفاده می کنیم و به صورت پویا نرخ فریم (Frame rate) را در زمانی که فوکوس (Focus) از برنامه خارج شود روی صفر تنظیم می کنیم. به عنوان مثال زمانی که شما به تب دیگر از مرورگر می روید و یا خارج از محیط قرار گیری فلش در صفحه کلیک می کنید و یا برنامه را در پس زمینه کاری قرار می دهید برنامه شما از فوکوس خارج می شود.

//تعریف متغییر نرخ فریم جاری و نرخ فریم حالت غیر فعال
var originalFrameRate:uint = stage.frameRate;
var standbyFrameRate:uint = 0;

stage.addEventListener( Event.ACTIVATE, onActivate );
stage.addEventListener( Event.DEACTIVATE, onDeactivate );

function onActivate( e:Event ):void
{
	// بازگرداندن نرخ فریم اصلی
	stage.frameRate = originalFrameRate;
}

function onDeactivate( e:Event ):void
{
	// تنظیم نرخ فریم بر روی صفر
	stage.frameRate = standbyFrameRate;
}

زمانی که روی برنامه شما دوباره فوکوس می شود ، نرخ فریم به حالت اصلی بازگردانده می شود و برنامه شما به کارش ادامه می دهد. در ضمن شما به جای استفاده از تغییر نرخ فریم به صورت پویا می توانید بهینه سازی های دیگر مانند فریز کردن اشاء ، دادن افکت بلور و… را درون برنامه خود در نظر بگیرید.

این رویداد ها به شما این امکان را می دهد که مکانیزمی شبیه به Pause و Resume که در واقع امکان ایجاد مکث و وقفه در برنامه و امکان ادامه دادن آن در زمان دلخواه می باشد را ایجاد کنید. نمونه ی این ویژگی را شاید گاهی اوقات در برنامه های تلفن های همراه و یا نت بوک های دیده باشید ، شما هم می توانید به برنامه خود اینچنین امکانی را اضافه کنید.

موفق و پیروز باشید.

بهینه سازی در فلش یک اصل مهم به حساب می آید و افزایش و کار بر روی آن برای توسعه دهندگان فلش امری الزامی است. به عنوان یک توسعه دهنده فلش و به عنوان کسی که برای آینده این نرم افزار بزرگ احساس مسئولیت می کند ، ما وظیفه داریم در ساخت عناصر فلش که کارایی بهتری دارند پیش گام باشیم و همواره بهترین و بهینه ترین روش را استفاده کنیم. در این مجموعه آموزشی بهینه سازی فلش به نکات مهم برای مدیریت بر عناصر و حافظه ها … می پردازیم و تلاش می کنیم که بتوانیم با استفاده از نکات ارائه شده خروجی بهینه تر و سبک تری از پروژه فلش خود داشته باشیم.

بخش دوم – استفاده دوباره از Object ها

راه دیگر برای بهینه سازی حافظه (memory) استفاده دوباره از اشیاء و اجتناب از ساختن دوباره و استفاده از آنها در هر زمان ممکن ، می باشد. می بایست تا جایی که می شود از ساختن دوباره object ها برای استفاده اجتناب نمود.

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

const MAX_NUM:int = 18;

const LINE_WIDTH:int = 30;
const LINE_HEIGHT:int = 400;

const COLOR:uint = 0xCCCCCC;

var myBitmapData:BitmapData = new BitmapData(stage.stageWidth,stage.stageHeight,false,COLOR);//200 , 200 , true);
var myBitmap:Bitmap;

var area:Rectangle;
for (var i:int = 0; i < MAX_NUM; i++)
{

	//نمونه روش غلط - از کد زیر استفاده نکنید

	area = new Rectangle(i*LINE_WIDTH,0,LINE_WIDTH,LINE_HEIGHT);

	myBitmapData.fillRect(area,Math.random()*COLOR);
	myBitmap = new Bitmap(myBitmapData);
	addChild(myBitmap);

}

بازسازی شی Rectangle در هر تکرار حلقه مقدار بیشتری حافظه را استفاده می کند و اجرا را کند تر می کند ، زیرا شی جدید ساخته می شود.

به روشی که در کد زیر استفاده شده است دقت کنید :

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

const MAX_NUM:int = 18;

const LINE_WIDTH:int = 30;
const LINE_HEIGHT:int = 400;

const COLOR:uint = 0xCCCCCC;

var myBitmapData:BitmapData = new BitmapData(stage.stageWidth,stage.stageHeight,false,COLOR);
var myBitmap:Bitmap;

// ساخت شی خارج از حلقه
var area:Rectangle = new Rectangle(0,0,LINE_WIDTH,LINE_HEIGHT);

for (var i:int = 0; i < MAX_NUM; i++)
{

	//تغییر مختصات به صورت مجزا
	area.x = i * LINE_WIDTH;

	myBitmapData.fillRect(area,Math.random()*COLOR);

}

myBitmap = new Bitmap(myBitmapData);
addChild(myBitmap);

همان طور که مشاهده می کنید این کد هم همان خروجی و نتیجه مورد اول را دارد ولی بهینه سازی در آن انجام شده و حافظه کمتری را اشغال می کند.

-

مثال قبلی شی مربوطه ، تاثیر نسبتا کمی در استفاده از حافظه داشت ، در مثال بعدی با استفاده از شی BitmapData  تعداد زیادی مربع توسط یک حلقه ایجاد می شود

کد زیر مربع هایی را به حالت موزاییک به صفحه اضافه می کند :

var myImage:BitmapData;

var myContainer:Bitmap;

const MAX_NUM:int = 300;

for (var i:int = 0; i< MAX_NUM; i++)
{

	// ساخت بیت مپ ۲۰ در ۲۰ پیکسل که شفافیت پس زمینه در آن غیر فعال شده است
	myImage = new BitmapData(20,20,false,0xF0D062);

	// ساخت یک نگه دارند برای هر مورد به صورت مجزا

	myContainer = new Bitmap(myImage);

	// افزودن به لیست نمایش - Display List

	addChild(myContainer);

	// موقعیت دهی هر نگه دارنده

	myContainer.x = (myContainer.width + 8 ) * Math.round(i % 20);

	myContainer.y = (myContainer.height + 8 ) * int(i / 20);

}

در نسخه بهینه سازی شده کد بالا (که در زیر قابل مشاهده است) یک BitmapData ایجاد می شود و برای چندین بار برای هر Bitmap استفاده می شود و نتیجه مشابه مورد قبل نیز خواهیم داشت، البته با اشغال مقدار کمتری از حافظه.

// ساخت بیت مپ ۲۰ در ۲۰ پیکسل که شفافیت پس زمینه در آن غیر فعال شده است
var myImage:BitmapData = new BitmapData(20,20,false,0xF0D062);

var myContainer:Bitmap;

const MAX_NUM:int = 300;

for (var i:int = 0; i< MAX_NUM; i++)
{

	//ساخت یک نگه دارنده که به بیت مپ کلاس تعریف شده ارجاع می شود

	myContainer = new Bitmap(myImage);
	// افزودن به لیست نمایش - Display List
	addChild(myContainer);
	// موقعیت دهی هر نگه دارنده
	myContainer.x = (myContainer.width + 8 ) * Math.round(i % 20);

	myContainer.y = (myContainer.height + 8 ) * int(i / 20);

}

در این مورد با بهینه سازی انجام شده نزدیک به ۶۵۰ تا ۷۰۰ کیلوبایت در حافظه (memory) فلش بهینه سازی انجام شده است که مقدار قابل توجهی می باشد به خصوص برای برنامه هایی که برای گوشی ها و دستگاه هایی به غیر کامپیوتر ها آماده می شود.

روش دست یابی به مقدار حافظه مصرفی در فلش:

از کد ساده زیر استفاده کنید در در پنجره خروجی output مقدار حافظه مصرفی را مشاهده کنید.

trace(Number( System.totalMemory / 1024 / 1024 ).toFixed( 2 ), "Mb");

نکته :

کد زیر که در نمونه اول ذکر شده است برای تولید یک رنگ تصادفی استفاده می شود در واقع مقدار یک رنگ که به عنوان ثابت در ابتدا تعریف شدن در فرمان random ضرب می شود که حاصل آن یک رنگ اتفاقی می باشد.

Math.random()*COLOR;

موفق و پیروز باشید.

طبق آمار گرفته شده در صفحه اصلی از بین ۲۰۰ رای داده شده بعد از گزینه همه موارد با ۵۱ رای گزینه آموزش های کاربردی فلش قرار دارد با ۴۰ رای ، با توجه به این موضوع و با توجه به احترام به نظر و خواست کاربران ، مجموعه ای از آموزش های بهینه سازی فلش را قرار می دهم که برای همه کاربران فلش مفید و کاربردی می باشد ، البته در این موارد رتبه سوم با برنامه نویسی اکشن اسکریپت ۳ با ۳۷ رای می باشد به همین دلیل در بهینه سازی روش هایی در اکشن اسکریپت ۳ پرداخته می شود. در اینجا باز هم عرض می کنم که نظر شما عزیزان برای بنده بسیار ارزشمند و مهم می باشد.

بهینه سازی در فلش یک اصل مهم به حساب می آید و افزایش و کار بر روی آن برای توسعه دهندگان فلش امری الزامی است. به عنوان یک توسعه دهنده فلش و به عنوان کسی که برای آینده این نرم افزار بزرگ احساس مسئولیت می کند ، ما وظیفه داریم در ساخت عناصر فلش که کارایی بهتری دارند پیش گام باشیم و همواره بهترین و بهینه ترین روش را استفاده کنیم. در این مجموعه آموزشی بهینه سازی فلش به نکات مهم برای مدیریت بر عناصر و حافظه ها … می پردازیم و تلاش می کنیم که بتوانیم با استفاده از نکات ارائه شده خروجی بهینه تر و سبک تری از پروژه فلش خود داشته باشیم.

بخش اول – Display Objects

یکی از ساده ترین بهینه سازی ها راه ها و روش هایی است که برای محدود کردن استفاده از حافظه (memory) با استفاده از اختصاص دادن نوع خاصی از Display Object می باشد (مثلا MovieClip , Shape , Sprite ).

به عنوان مثال:

shape ها تعاملی (interactive) نیستند در مواردی مثل اشکال ساده و طرح هایی که نیازی به خصوصیات تعاملی ندارد از این نوع استفاده کنید.

برای موارد تعاملی که نیازی به تایم لاین نیست از Sprite استفاده کنید.

برای انیمیشن ها که از تایم لاین استفاده می شود ، MovieClip را انتخاب نمایید.

همیشه سعی کنید بهترین و کارآمد ترین نوع شی را در بخش های مختلف برنامه خود اعمال کنید.

کد های زیر مقدار مصرفی حافظه انواع متفاوت display object ها را نشان می دهد :

trace(getSize(new Shape()));
// خروجی: ۲۳۶

trace(getSize(new Sprite()));
// خروجی: ۴۱۲

trace(getSize(new MovieClip()));
// خروجی: ۴۴۰

متد  (method) ؛ getSize() مورد استفاده در کد بالا ، نشان دهنده مقدار استفاده از حافظه بر مبانی بایت (byte) می باشد. شما می توانید به جای استفاده از چند MoiveClip در موارد درست که استفاده امکانات MovieClip نیاز نمی باشد از شی Shape استفاده کنید و با این کار از حافظه کمتری استفاده کنید. البته شاید در مورد یک شی این موارد تفاوت زیادی نداشته باشند ولی این مورد خودش را با بزرگ و بزرگ تر شدن پروژه به خوبی نشان خواهد داد.

استفاده از XML یکی از بهترین راه ها برای ساختار بندی اطلاعات به صورت خارجی (External) و به صورت منطقی و قابل درک به صورت ساده ، برای پردازش و به روز رسانی اطلاعات می باشد.

در این مطلب به مباحث زیر پرداخته می شود :

۱ – XML چیست ؟
۲ – نوشتن یک فایل XML برای فلش
۳ – بارگزاری فایل XML در فلش
۴ – پردازش XML  در فلش

XML چیست ؟

XML  یک زبان علامت گذاری قابل بسط (Extensible Markup Language) می باشد، این یک زبان علامت گذاری برای استفاده از ساختار منطقی داده ها که با استفاده از تگ ها (tag) بسیار به HTML شبیه می باشد.
به هر حال، زمانی که از HTML استفاده می کنید ، شما تعدادی تگ تعریف شده برای ایجاد صفحه وب خود دارید، ولی در XML شما تگ های خودتان را می سازید و به دلخواه آنها را در برنامه خود مورد استفاده قرار می دهید.

این موضوع امکان ساخت تگ هایی متناسب با پروژه خودتان که قابل درک برای  هر فردی حتی به صورت مبتدی ، هم باشد را دارید
برای مثال ، شما نیازی به هیچ اطلاعات مقدماتی درباره XML و یا نرم افزاری خاص برای استفاده ندارید . به کد زیر دقت نمایید :

<?xml version="1.0" encoding="utf-8"?>
<GALLERY>
	<IMAGE TITLE="school">image1.jpg</IMAGE>
	<IMAGE TITLE="garden">image2.jpg</IMAGE>
	<IMAGE TITLE="shop">image3.jpg</IMAGE>
</GALLERY>

XML برای شما امکانی را فراهم می کند تا نام  برچسب های (Tag) خود را با قوانین ساده این زبان بسازند.
ویژگی دیگر یک سند XML این می باشد که عناصر آن بر اساس ساختار (والد / فرزند) Parent / child می باشد ، هر تگ می تواند تعدادی فرزند داشته باشد و تگ های فرزند می توانند یک والد داشته باشند.
برای درک بیشتر به تصویر زیر دقت نمایید :

روی محتوای واقعی در یک فایل XML ، هر تگ XML در اکشن اسکریپت به عنوان یک node فراخوانی می شود.
یک node همچنین دارای یک node value  می باشد که بین تگ های node قرار می گیرد ، هر node می تواند به تعداد دلخواه خصوصیت attributes داشته باشد که هر attribute  دارای یک attribute value که درون کوتیشن (“”) مقدار دهی می شود ، است.
تمامی موارد گفته شده عموما می بایست چیزی شبیه به کد زیر باشد :

<ROOT-NODE>
	<CHILD-NODE ATTRIBUTE="value">sub-child-node-or-node-value</CHILD-NODE>
	<CHILD-NODE ATTRIBUTE="value">sub-child-node-or-node-value</CHILD-NODE>
	<CHILD-NODE ATTRIBUTE="value">sub-child-node-or-node-value</CHILD-NODE>
</ROOT-NODE>

کد بالا شامل ۳ اصل مهم می باشد که باعث می شود در نهایت شما کد XML صحیحی داشته باشید :

۱. فایل XML شما می بایست شامل یک تگ اصلی (root level XML tag) باشد ، در مثال بالا این مورد با (<ROOT-NODE></ROOT-NODE>) نمایش داده شده است که خط اول و خط آخر را شامل می شود.
۲. تمامی تگ های تکی می بایست بسته شوند ، این کار می بایست با نوع بسته تگ مربوطه انجام شود ، در مثال بالا (مثلا </CHILD-NODE>) ، و یا می بایست توسط تگ های خود بسته (self-closing) این کار انجام شود ، در این روش در انتهای تگ از یک بک اسلش (/) استفاده می شود ( این مورد در مثال بالا وجود ندارد ، برای مثال : <NODE ATTIRIBUTE=”value” /> )

3. اگر شما بخواهید از یک attribute  و یا بیشتر استفاده نمایید ، شما می بایست که مقدار های هر attribute در بین دو کوتیشن (“”) قرار دهید.

نوشتن یک فایل XML  برای Flash

با توجه به این که XML فقط از متن تشکیل شده است شما می توانید از هر ویرایش گر متنی برای ساخت یک فایل XML استفاده نمایید.
Notepad خود را باز نمایید و کد زیر را Copy  و برای ساخت فایل XML درون برنامه Paste  نمایید.
فایل را با نام iflashlord.xml در پوشه ای که می خواهیم فایل فلش خود را ایجاد نماییم ذخیره می کنیم.

<?xml version="1.0" encoding="utf-8"?>
<GALLERY>
	<IMAGE TITLE="school">image1.jpg</IMAGE>
	<IMAGE TITLE="garden">image2.jpg</IMAGE>
	<IMAGE TITLE="shop">image3.jpg</IMAGE>
</GALLERY>

خط اول فایل XML  ما در کد بالا یک پارامتر دلخواه برای تنظیمات مربوطه به ورژن فایل XML و Encoding فایل XML ما می باشد. بهتر هست از این مورد استفاده شود ، حتی اگر در نتیجه ای که در فلش مشاهده می شود تاثیری نداشته باشد.

بارگزاری XML در Flash

کار را با ایجاد پروژه جدید فلش با اکشن اسکریپت ورژن ۳ نمایید. روی تنها فریم موجود در تایم لاین TimeLine راست کلیک کرده و Actions را انتخاب نمایید ( یا کلید F9 را بفشارید)
کاری که می خواهیم در این آموزش در این پنجره انجام دهیم :

۱.     ساخت یک variable برای نگه داشتن یک نمونه  (instance) از کلاس XML

2.     ساخت یک نمونه از کلاس URLLoader برای بارگزاری فایل XML

3.     پاس دادن اطلاعات موجود در فایل XML به نمونه متغیر (variable) آن در زمانی که فایل XML به صورت کامل بارگزاری شد.

اکش اسکریپت ۳ ویژگی های دیگری برای کار با XML توسط کلاس XMLDocument را دارا می باشد .

در ابتدا می بایست یک متغیر(variable)  از نوع XML ایجاد نماییم ، برای این کار به راحتی می توان از var  برای تعریف استفاده نمود :

var myXML:XML;

عملگر کلون ((: برای قفل کردن نوع  متغیر بر روی XML استفاده می شود و این به این معنا می باشد که این متغیر نمی تواند چیزی به جز اطلاعات مربوطه به XML را نگه داری کند. در صورتی که سعی نمایید که داده ای با نوع دیگری به ای متغیر بدهید با خطای در زمان کامپایل compile-time error مواجه می شوید برای مشخص کردن نوع متغیر از قالب زیر استفاده می شود.

var variableIdentified:DataType;

که به ترتیب از سمت چپ شناسه متغیر : نوع داده متغیر می باشد

در مرحله بعد می بایست یک نمونه از کلاس  URLLoader  برای بارگزاری فایل XML ایجاد کنیم ، URLLoader  یک کلاس می باشد که عهده دار بارگزاری همه داده های باینری و متنی می باشد، ابتدا می بایست یک نمونه ساخته شود و در مرحله بعد توسط متد load فایل XML بارگزاری شود ، به کد زیر دقت نمایید :

var myXML:XML;
 var myLoader:URLLoader = new URLLoader();
 myLoader.load(new URLRequest("iflashlord.xml"));

همان طور که در کد بالا مشاهده می کنید ما فایل iflashlord.xml را توسط متد load مربوطه به کلاس URLLoader بارگزاری نمودیم ، کلاس URLLoader برای دریافت URL مربوطه به فایل ما نیاز دارد که داده مربوطه را توسط نمونه ای که از کلاس URLRequest ساخته شده دریافت نماید به همین منظور آدرس فایل مربوطه با استفاده از کلاس URLRequest به متد load  کلاس URLLoader مقدار دهی شده است ، نکته: شما می توانید URLRequest را به صورت جدا در یک متغیر ایجاد نمایید و آن را در مراحل مختلف در کد خود استفاده نمایید می توانید نوع متغییر را هم URLRequest تعیین نمایید.

بعد از این مرحله ما می بایست اطمینان حاصل کنیم که فایل XML ما به صورت کامل بارگزاری شده است تا به مراحل بعدی کار بر روی محتوای فایل بپردازیم برای این کار نیاز به ساخت یک شنونده (Listener) داریم تا فرایند بارگزاری را چک نماید و بعد از تکمیل روند بارگزاری فایل XML تابعی را صدا بزند ، Listener ما می بایست به نمونه ای که از کلاس URLLoader ساخته شده است (در این مثال myLoader) پیوست داده شود.
Listener ما توسط رویدادی که به آن افزوده می شود گیره ای با Listener  تابع processXML ایجاد می نماید تا در زمان تکمل بارگزاری تابعی که با نام processXML تعریف می نماییم اجرا شود.
چگونگی انجام این کار را می توانید در زیر مشاهده نمایید:

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);

رویداد های مختلفی برای افرودن به شنونده وجود دارد که می توانند رویداد های مختلفی که برای شی (Object) موردی نظر ما موجود می باشد را تحت پوشش قرار دهد برای اطلاع بیشتر از این رویداد ها می توانید در راهنمای اکشن اسکریپت نرم افزار فلش بخش مربوطه به کلاس URLLoader را چک نمایید.

کد بالا بعد از اتمام بارگزاری فایل XML تابع processXML را فراخوانی می نماید. ما نیاز داریم ، همان طور که در روش مورد استفاده ما در بالا مشخص شد ،تابعی برای این منظور ایجاد کنیم ، ما نیاز داریم در این تابع  محتوای فایل XML را دریافت نماییم و این محتوا را از طریق مسیری که توسط رویداد تابع می باشد دریافت می کنیم :

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML);
}

اشاره ما در کد بالا توسط e.target به شی (Object) فایل XML ی که بارگزاری شده است می باشد.

شما می توانید تا این مرحله را تست نمایید و محتوای کامل فایل XML را در پنجره خروجی Output فلش مشاهده نمایید.

پردازش فایل  XML

در صورتی که نتیجه خروجی را مشاهده کرده باشید ، محتوای فایل XML را بدون هیچ گونه پردازشی دیده اید، تا ایجا این مثال مانند فایل متنی ساده ای بود که شما می توانستید محتوای آن را توسط کلاس LoadVars و یک فیلد متنی بارگزاری نمایید و نمایش دهید.

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

ما برای استفاده از E4X به ازای هر گره (node) در فایل XML مان یک مقدار دریافت می کنیم و یا از یک node خاصی در فایل مقداری را دریافت می کنیم و سپس با استفاده از آن node خاص صفات (attributes) مربوطه به آن را دریافت می کنیم.

در ابتدا ما می خواهیم که همه فرزندان (children) یک گره (node) را دریافت نماییم برای این کار ما می توانیم از عملگر (Operator) ستاره (*) استفاده نماییم.

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.*);
}

به جای ستاره استفاده شده در کد بالا را می توان از متد   .children()استفاده نمود که نتیجه ای مشابه خواهد داشت.

ما می توانیم به نوبت فقط گره های خاصی را انتخاب نماییم ، در نمونه کد ما این مورد به خوبی احساس نمی شود زیرا همه فرزندان گره های ما از یک نوع هستند ، اما اگر ما انواع گره های مختلفی داشته باشیم و به دنبال آن باشیم که فقط دسته ای انتخاب شده از آن ها را دریافت نماییم ، می توانیم از نام گره (node name) استفاده نماییم و این دسته را دریافت نماییم. برای مثال ما برای دریافت گره IMAGE به تنهایی ،  از کلمه IMAGE استفاده می کنیم :

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.IMAGE);
}

خروجی کد در زمان تست :

<IMAGE TITLE="school">image1.jpg</IMAGE>
<IMAGE TITLE="garden">image2.jpg</IMAGE>
<IMAGE TITLE="shop">image3.jpg</IMAGE>

برای جلو تر روفتن و دریافت محتوای متنی از هر مقدار هر گره ما می توانیم با استفاده دوباره از ستاره (*) این کار را انجام دهیم ، به نمونه دقت کنید :

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.IMAGE.*);
}

خروجی کد در زمان تست :
image1.jpgimage2.jpgimage3.jpg

نتجه بالا در واقع کمکی برای استفاده نمی کند ، بنابر این برای دریافت مقدار گره ها به صورت انتخاب شده از عملگر براکت ([]) استفاده می کنیم و با عددی که در مایل براکت ها قرار می دهیم موقعیت فرزند مورد نظرمان در فایل XML را مشخص می کنیم.

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.IMAGE[0]);
}

خروجی کد در زمان تست :

image1.jpg

می بایست به یاد داشته باشید که عناصر یک XML List به صورت Zero-relative می باشند (مانند آرایه ها) ، بنابراین اولین آیتم (item) لیست ما در موقعیت ۰ می باشد و نه ۱. و آیتم بعدی در موقعیت ۱ می باشد و بعدی ۲ و به همین صورت تا انتها.

دریافت محتوای یک گره بسیار ساده می باشد. و دریافت مقدار صفات (attributes) نیز خیلی سختر از مورد  قبلی نمی باشد. برای این کار می بایست از علامت (@)  به همراه نام صفت (attribute) استفاده نماییم. برای پردازش می توانیم برای گروهی از گره ها و یا یک گره انتخاب شده استفاده نماییم. برای گروهی از گره ها می توانیم این کد را به کار ببریم :

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.IMAGE.@TITLE);
}

خروجی کد در زمان تست :

Schoolgardenshop

این مورد را می توانیم برای گره ی انتخاب شده ای با استفاده از براکت و عدد نیز استفاده نماییم :

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.IMAGE[0].@TITLE);
}

خروجی کد در زمان تست :

school

با کنترل کننده هایی که در اکشن اسکریپت ۳ برای XML ایجاد شده است ، به ما این امکان را می دهد که گره ها را با جستجو به دنبال مقدار صفتی خاص فیلتر کنیم و  نتیجه را دریافت نماییم. برای مثال ما مقدار گره IMAGE را که صفت title آن برابر با ‘school’ می باشد را دریافت می نماییم :

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.IMAGE.(@TITLE=="school"));
}

خروجی کد در زمان تست :

image1.jpg

یک متد قابل توجه و مورد استفاده متد .length() می باشد ، این متد می تواند برای شمارش تعداد فرزندان یه گره و یا تعداد نوع انتخاب های از فرزندان یک گره استفاده شود. به عنوان مثال ، برای چک کردن این که چه تعداد گره  IMAGE در Gallery ما موجود می باشد می توانیم از متد length() استفاده نماییم :

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.IMAGE.length());
}

خروجی کد در زمان تست می بایست عدد ۳ باشد.

ما همچنین به راحتی می توانیم تعداد فرزندان موجود در فایل XML مان را بدون توجه به نوع آنها با استفاده از ستاره (*)  مشخص نماییم:

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	trace(myXML.*.length());
}

خروجی کد در زمان تست می بایست عدد ۳ باشد.

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

برای درک بیشتر استفاده از XML به یک تمرین در این مورد می پردازیم.

تمرین

در کد تمرین زیر محتوای فایل XML در پنجره خروجی Output نمایش داده می شود برای این تمرین از یک حلقه (loop) استفاده شده است که توسط آن به محتوای موجود در فایل XML دسترسی پیدا می کنیم و تک تک همه  آنها را به همراه صفت و شماره در خروجی به نمایش می گذاریم ، این مثال کاربردی بوده یک روش معمول برای استفاده در اکثر پروژه ها می باشد.

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("iflashlord.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);
function processXML(e:Event):void
{
	myXML = new XML(e.target.data);
	for (var i:int = 0; i<myXML.*.length(); i++)
	{
		trace("My image number is " + (i+1) + ", it's title is " + myXML.IMAGE[i].@TITLE + " and it's URL is " + myXML.IMAGE[i]);
	}
}

در این مطلب با موارد مهمی که در کار با XML  به صورت ابتدای نیاز هست آشنا شدیم.

با توجه به مطلب قبلی که در مورد ارتباط فلش با جاوااسکریپت و فراخوانی توابع جاوا اسکریپت با اکشن اسکریپت ۳ بود

شاید این موضوع  که آیا امکان برقرای ارتباط به صورت معکوس این قضیه یعنی ایجاد ارتباط از جاوااسکریپت به فلش وجود دارد یا خیر…
به همین منظور به این ارتباط که به طور مثال شما با کلیک بر روی لینکی که درون صفحه HTML سایت شما هست بتوانید محتوایی درون Text Field فلش که به صورت Dynamic هست رو تغییر بدید ( از این خصوصیت به خلاقیت خودتان می تواند برای فرا خوانی هر تابعی درون فلش نیز استفاده کنید)

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

import flash.external.ExternalInterface;
 

در این مرحله می بایست بازخورد مربوطه را در کلاس ExternalInterfrace ثبت کنیم :

ExternalInterface.addCallback("changeText",changeTheText);
 

خوب همان طور که می بینید متد addCallback دو آرگمان اصلی دارد
changeText : نام تابعی است که ما می بایست درون کد جاوا اسکریپت خود از آن استفاده کنیم
changeTheText : نام تابعی است در فلش که با فراخوانی مورد قبلی در جاوا اسکریپت درون فلش فراخوانی می شود

این تابع را در این مثال مشاهده می کنید :

function changeTheText(t:String):void
{
	txtText.text = t;
}
 

این تابع نیز یک آرگمان دارد که شما می بایست مقدار آن را درون کد جاوا اسکریپت توسط تابع رابط که در این مثال changeText می باشد مقدار دهی نمایید
txtText هم یک فیلد متنی داینامیک در فلش می باشد instance Name آن برابر txtText مقدار دهی شده است
.text هم طبق آموزش های قبلی برای مقدار دهی به فیلد به صورت متنی می باشد

خوب در نهایت کد مربوطه به بخش HTML ما کدی شبیه به کد زیر می باشد :

<p><a href=”#” onClick=”JavascriptPopup.changeText(‘it  works for iflashlord.com!’);”>IFLashLord Click me!</a></p>

نکته مهم » JavascriptPopup چیست ؟ یک نام دلخواه می باشد که شما به عنوان شناسه یا همان id کد تگ Object خود تعریف می کنید و از آن برای اشاره به فلش مورد نظر استفاده می کنید

به کد زیر توجه کنید :

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="224" height="69" align="middle">        <param name="allowScriptAccess" value="always" />       <param value="false" />  <param value="JavascriptPopup.swf" /><param value="high" /><param name="bgcolor" value="#ffffff" /> <embed src="JavascriptPopup.swf" quality="high" bgcolor="#ffffff" width="224" height="69" name="JavascriptPopup" align="middle" allowScriptAccess="always" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </object>

id برابر با JavascriptPopup مقدار دهی شده پس در نتیجه کدHTML قبلی ما اشاره به این فلش در صفحه دارد و شما می توانید بر تعداد زیاد فلش در یک صفحه نیز کنترل داشته باشید
توجه داشته باشید از هر نوع روش برای قرار دادن فلش در صفحه استفاده می کنید می بایست خصوصیت id را مقدار دهی نمایید تا بتوانید در کد خود به فلش مورد نظر اشاره کنید.

ساختار کلی :

تابع اکشن اسکریپت ۳ خروجی عدد

indexOf(searchElement:*, fromIndex:int = 0):int

searchElement : عنصری که برای پیدا کرد آن جستجو می کنیم
fromIndex : شروع کردن از اندیس

تابع اکشن اسکریپت ۳ خروجی عدد

lastIndexOf(searchElement:*,  fromIndex:int = 0x7fffffff):int

searchElement : عنصری که برای پیدا کرد آن جستجو می کنیم
fromIndex : شروع کردن از اندیس

نحوه استفاده از این متد مثل استفاده از String.indexOf و String.lastIndexOf می باشد و شما می توانید به طور مثال محل قرار گیری یک Object در یک Array را بدست آورید و یا محل قرار گیری یک sprite در یک آرایه (چندمین عنصر بودن آن) را بدست آورید
در صورتی که عنصر مورد نظر شما در آرایه موجود نباشد خروجی -۱ می باشد

حال به مثالی در این مورد توجه کنید:

var sprite:Sprite = new Sprite();
var  object:Object = new Object();
var boolean:Boolean = true;
var  number:Number = 10;

var array:Array = new Array(sprite, object,  number);
trace(array.indexOf(sprite)); // 0
trace(array.indexOf(number));  // 2
trace(array.indexOf(boolean)); // -1

موفق و پیروز باشید