Citrus Engine چست؟

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

این موتور در گذشته با قیمتی حدود ۴۰۰ دلار در اختیار کاربران و توسعه دهندگان قرار می گرفته است که خوشبختانه هم اکنون به صورت رایگان و اوپن سورس می باشد.

کاربرد اصلی این موتور برای ساخت بازی های پلاتفورمر می باشد ، برای هسته این موتور از زبان اکشن اسکریپت ۳ استفاده شده است که بخش تحلیل فیزیکی آن نیز توسط box2d کنترل می شود ، نمونه ای از این دست بازی ها را می توانید در صفحه اول وب سایت Citrus Engine ببنید.

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

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

فکر می کنم هم اکنون وقت آن باشد که شما هم با این موتور بیشتر آشنا شوید و آن را محکی بزنید.

وب سایت رسمی Citrus Engine

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

برای این کار ما ابتدا بعد از تعریف نام تابع که در این مثال randomBoolean هستند و بعد از () ها توسط علامت ( : ) نوع خروجی بازگشتی تابع را Boolean مشخص می کنیم.

سپس با کمک گرفتم از متد random مربوطه به کلاس Math و ایجاد شرط توسط علامت بزرگتر مساوی و استفاده از خروجی رندوم دریافت شده ، به مقدار true یا false اتفاقی برای بازگشت دادن دسترسی پیدا می کنیم.

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

function randomBoolean():Boolean
{
	return Math.random() >= 0.5;
}
//تست خروجی
trace(randomBoolean());

در این تابع وقتی Math.random() اجرا می شود یک عدد رندوم بین ۰ تا ۱ خروجی می دهد در صورتی که این عدد بزرگتر و یا مساوی ۰.۵ باشد برنامه true را return می کند و در غیر این صورت false را بازگشت می دهد.

در این مطلب نحوه ذخیره محتویات یک 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);
}

در این مطلب به slugify پرداخته می شود ، در کل به آماده کردن یک متن برای استفاده در URL و یا به عنوان نام یک فایل توسط حذف کاراکتر هایی که برای این موارد مجاز نمی باشد در استلاح slugify یا slug کردن نامیده می شود.

در ادامه ما توسط عبارات با قاعده (Regular-Expressions) و تابع replace در اکشن اسکریپت ۳ ، اقدام به ساخت تابعی می کنیم که این کار را برای ما انجام دهد.

در ابتدا دو RegExp که دو پترن مورد نیاز ما می باشند را به عنوان ثابت (const) تعریف می کنیم، مورد اول pattern1 مربوطه به انتخاب همه حروف الفبا و علامت دش (-) یا همان خط تیره می باشد که در کد زیر توسط (\ا-ی) تمامی حروف الفبای فارسی نیز پشتیبانی می شود، و مورد دوم pattern2 می باشد که فاصله ها یا همان Space های موجود در متن توسط آن انتخاب می شوند.

در نهایت توسط تابع replace مربوطه به string ها در اکشن اسکریپت ۳ متون اضافی حذف  ،و فاصله ها با علامت (-) جا به جا می شوند و در نهایت متن توسط toLowerCase به حروف کوچک تبدیل می شود و بازگشت داده می شود.

function slugify(string:String):String
{
const pattern1:RegExp = /[^\w-\ا-ی ]/g;// همه حروف به جز فاصله و علامت دش (-) ؛
const pattern2:RegExp = / +/g;// یک یا بیش از یک فاصله
var s:String = string;
return s.replace(pattern1, "").replace(pattern2, "-").toLowerCase();
}
//مثال
trace(slugify("تست  متن با فاصله"));
//تست-متن-با-فاصله

trace(slugify("test  text with space"));
//test-text-with-space

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

function slugify(string:String):String
{
const pattern1:RegExp = /[^\w- ]/g;// همه حروف انگلیسی به جز فاصله و علامت دش (-) ؛
const pattern2:RegExp = / +/g;// یک یا بیش از یک فاصله
var s:String = string;
return s.replace(pattern1, "").replace(pattern2, "-").toLowerCase();
}
//مثال
trace(slugify("تست  متن با فاصله"));//-
trace(slugify("test  text with space"));//test-text-with-space

این تابع در مواردی که می خواهید متون را در آدرس های وب (URL) و یا به عنوان نام فایل مورد استفاده قرار دهید ،کاربرد دارد.

در این مطلب نحوه برقراری ارتباط بین Air و PHP به منظور Upload فایل روی Server آموزش داده می‌شود. ابتدا یک فرم مخصوص آپلود می‌سازیم، سپس کدهای مربوط به PHP را نوشته و فایل‌های مورد نیاز را روی Server قرار می‌دهیم. در نهایت کدهای مربوط به نرم افزار را در Flash اضافه می‌کنیم. برای آپلود فایل‌ها از FileReference، URLRequest و URLVariables استفاده می‌کنیم.

دانلود سورس : Source CS5.5.zip

1- برای شروع یک پروژه جدید Air ایجاد کنید.

۲- به کمک کامپوننت‌های Button , Text Input و به کمک ابزار Rectangle این فرم را بسازید.

۳- یک برنامه Editor باز کنید و این کدها را در آن بنویسید، سپس فایل را با نام uploader_script.php ذخیره کنید.

<?php $todayDate = $_POST['todayDate'];
$Name = $_POST['Name'];
$Email = $_POST['Email'];
$filename = $_FILES['Filedata']['name'];
$filetmpname = $_FILES['Filedata']['tmp_name'];
$fileType = $_FILES["Filedata"]["type"];
$fileSizeMB = ($_FILES["Filedata"]["size"] / 1024 / 1000);
move_uploaded_file($_FILES['Filedata']['tmp_name'], "images/".$filename);
$myFile = "logFile.txt";
$fh = fopen($myFile, ‘a’) or die("can’t open file");
$stringData = “\n\ntodayDate: $todayDate \n Name: $Name \n Email: $Email \n ssid: $ssid \n FileName: $filename \n TmpName: $filetmpname \n Type: $fileType \n Size: $fileSizeMB MegaBytes”;
fwrite($fh, $stringData);
fclose($fh);
?>

• در این کدها ابتدا اطلاعات با متد POST دریافت می‌شود.
• سپس فایل‌های آپلود شده به داخل فولدر images که در کنار همین فایل PHP باید بسازیم منتقل می‌شوند و نام اصلی فایل برای آن حفظ می‌شود.
• در ادامه اطلاعات مربوط به فایل در یک فایل متنی به نام logFile.txt ذخیره می‌شود.

۴- حالا فایل PHP را در Server خود آپلود کنید. در کنار این فایل یک فولدر به نام images و یک فایل متنی به نام logFile.txt ایجاد کنید و Permission آنها را ۷۷۷ قرار دهید.

۵- پنل Actions را برای فریم اول پروژه فلش فعال کنید.

۶- حالا باید کلاسه مورد نیاز را import کنید:

import flash.net.URLRequest;
import flash.net.FileFilter;
import flash.net.FileReference;
import flash.events.ProgressEvent;
import flash.events.Event;
import flash.net.URLRequestMethod;
import flash.net.URLVariables;

7- اطلاعات اولیه مربوط به دکمه‌ها و سایر قسمت‌هایی را که در فرم بالا قابل مشاهده هستند، به صورت زیر تعریف کنید:

upload_btn.enabled = false;
progressBar.width = 1;
uploadMsg.text = "Select a File …";

۸- متغیر URLRequest را که به آدرس فایل PHP بر روی Server متصل می‌شود، به صورت زیر تعریف کنید:

var URLrequest:URLRequest = new URLRequest("uploader_script.php");

9- در این آموزش در نظر داریم که کاربر فقط بتواند فایل عکس و متن را با برنامه آپلود کند، بنابراین فیلتر فایل‌ها را به صورت زیر تعریف می‌کنیم و هر دو نوع فیلتر را در یک آرایه قرار می‌دهیم:

var imageTypes:FileFilter = new FileFilter("Images (*.jpg, *.jpeg, *.gif, *.png)", "*.jpg; *.jpeg; *.gif; *.png”);
var textTypes:FileFilter = new FileFilter("Text Files (*.txt, *.rtf)", "*.txt; *.rtf");
var allTypes:Array = new Array(imageTypes, textTypes);

10- یک FileReference جدید می‌سازیم و Event Listener‌های مربوط به انتخاب موفق فایل توسط کاربر، کامل شدن آپلود و حین پیشرفت آپلود را برای آن به صورت زیر تعریف می‌کنیم:

var fileRef:FileReference = new FileReference();
fileRef.addEventListener(Event.SELECT, syncVariables);
fileRef.addEventListener(Event.COMPLETE, completeHandler);
fileRef.addEventListener(ProgressEvent.PROGRESS, progressHandler);

11- حالا Event Listener‌های مربوط به کلیک روی دکمه‌ها را تعریف کنید.

browse_btn.addEventListener(MouseEvent.CLICK, browseBox);
upload_btn.addEventListener(MouseEvent.CLICK, uploadVars);

12- تابعی که بعد از کلیک روی دکمه Browse فراخوانی می‌شود، به صورت زیر تعریف می‌شود. بعد از کلیک روی این دکمه کاربر باید پنجره انتخاب فایل را با فیلترهایی که قبلا آماده شدند، ببیند.

function browseBox(event:MouseEvent):void
{
	fileRef.browse(allTypes);
}

13- تابعی که بعد از انتخاب موفق فایل توسط کاربر، فراخوانی می‌شود، به صورت زیر تعریف می‌شود. در این تابع ابتدا آدرس فایل در فیلد مربوطه نشان داده می‌شود. سپس دکمه آپلود فعال و ProgressBar آماده می‌شود، در ادامه اطلاعات مورد نیاز PHP به کمک URLVariables جمع آوری می‌شود و این اطلاعات توسط متد POST برای PHP آماده ارسال می‌شوند.

function syncVariables(event:Event):void
{
	fileDisplay_txt.text = "" + fileRef.name;
	upload_btn.enabled = true;
	progressBar.width = 1;
	var variables:URLVariables = new URLVariables();
	variables.todayDate = new Date();
	variables.Name = "IFLashLord";
	variables.Email = "test@gmail.com";
	URLrequest.method = URLRequestMethod.POST;
	URLrequest.data = variables;
}

14- حالا وقت آن رسیده است تابعی را تعریف کنیم که بعد از کلیک روی دکمه Upload فراخوانی می‌شود و اطلاعات را به PHP می‌فرستد. یکی از این اطلاعات، خود فایل انتخاب شده است که با دستور upload توسط FileReference ارسال می‌شود.

function uploadVars(event:MouseEvent):void
{
	uploadMsg.text = "Uploading …";
	fileRef.upload(URLrequest);
	upload_btn.enabled = false;
}

15- توابع مربوط به کامل شدن و حین پیشرفت آپلود به صورت زیر تعریف می‌شوند.

function completeHandler(event:Event):void
{
	uploadMsg.text = fileRef.name + " has been uploaded.";
	fileDisplay_txt.text = "";
}

function progressHandler(event:ProgressEvent):void
{
	progressBar.width = Math.ceil(241 * (event.bytesLoaded / event.bytesTotal));
}

در صورتی که نیاز داشتید می‌توانید این پروژه را به صورت swf و AS3 در کنار فایل PHP آپلود کنید. اما اگر قرار است این برنامه بر روی Desktop کار کند حتما باید از پروژه Air استفاده کنید.

در این مطلب نحوه اتصال به یک 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:

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

در این مطلب نحوه جستجوی به ترتیب (مشابه Find Next) یک لغت در یک فیلد متنی و انتخاب این لغت آموزش داده می‌شود، به طوری که بعد از هر بار کلیک روی دکمه مربوط به Find Next لغت مورد نظر بعدی انتخاب می‌شود.

۱- ابتدا یک دکمه به نام find_next_btn، یک فیلد متنی به نام target_txt به عنوان فیلد متنی اصلی و یک فیلد متنی برای نوشتن کلمه مورد نظر جستجو به نام search_txt بسازید.

۲- ابتدا یک متغیر برای پیدا کردن اندیس بعدی و یک Event Listener برای دکمه Find Next می‌سازیم.

var i:Number = 0;
find_next_btn.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler);

3- حالا تابعی را که بعد از کلیک روی دکمه فراخوانی می‌شود، تعریف می‌کنیم.

function fl_MouseClickHandler(event:MouseEvent):void
{
	target_txt.alwaysShowSelection = true;
	i = target_txt.text.indexOf(search_txt.text,i) + search_txt.length;
	target_txt.setSelection(i - search_txt.length, i);
	if (target_txt.text.indexOf(search_txt.text,i) < 0)
	{
		i = 0;
	}
}

در این تابع:

• ابتدا با دستور alwaysShowSelection وضعیت نمایش ناحیه انتخاب شده را به صورت همیشه فعال تبدیل می‌کنیم تا حتی زمانی که Focus روی سایر اشیاست هم ناحیه انتخاب شده دیده شود.
• مقدار i را برای پیدا کردن لغت بعدی آماده می‌کنیم. برای این کار طول رشته لغت مورد نظر را به اندیس پیدا شده اضافه می‌کنیم.
• لغت مورد نظر را به کمک دستور setSelection روی target_txt نشان می‌دهیم.
• در صورتی که اندیس آخرین لغت هم پیدا شد، به کمک دستور if جستجو را از ابتدا شروع می‌کنیم. در این دستور فرض شده است که بعد از آخرین لغت پیدا شده، مقدار ۱- برای دستور indexOf برگردانده شود.

در این درس کار با پایگاه داده SQLite در Air  ، نحوه ساختن جدول و فیلدهای مورد نیاز در جدول ساخته شده آموزش داده می‌شود.

۱- برای شروع کار یک پروژه Air ایجاد کنید.

۲- حالا باید کلاسه‌های مورد نیاز را import کنید:

import flash.filesystem.File;
import flash.data.SQLConnection;
import flash.events.SQLEvent;
import flash.events.SQLErrorEvent;
import flash.data.SQLStatement;

۳- برای ادامه نیاز داریم که ۴ متغیر بسازیم. متغیر conn برای برقراری اتصال با اطلاعات فایل پایگاه داده استفاده می‌شود، متغیر query وظیفه به جریان انداختن اطلاعات پایگاه داده و انجام عملیات روی اطلاعات را بر عهده دارد، متغیر dbFile برای ایجاد و کنترل فایل پایگاه داده در سیستم عامل به کار می‌رود و متغیر queryText یک String است که وظیفه متغیر query را در آن می‌نویسیم.

var conn:SQLConnection = new SQLConnection();
var query:SQLStatement;
var dbFile:File;
var queryText:String;

۴- برای شروع کار باید فایل پایگاه داده در صورت عدم وجود ساخته شود. به کمک کد applicationDirectory این فایل در کنار فایل اصلی (پروژه یا خروجی) ساخته می‌شود، همانطور که مشخص است نام فایل test.db خواهد بود.

dbFile = File.applicationDirectory.resolvePath("test.db");

۵- برای مدیریت اتصال باید دو Event Listener به متغیر conn اختصاص داده شود تا از اتصال موفق یا نا موفق با فایل پایگاه داده مطلع شویم.

conn.addEventListener(SQLEvent.OPEN, dbOpened);
conn.addEventListener(SQLErrorEvent.ERROR, dbError);

۶- حالا فایل پایگاه داده را به صورت غیر همزمان (openAsync) باز می‌کنیم. بنابراین می‌توانیم از Listener‌هایی که در بالا برای conn نوشتیم، استفاده کنیم. معمولا برای فایل‌های کم حجم از روش همزمان استفاده می‌شود، درصورت استفاده از روش همزمان امکان استفاده از Listener فراهم نخواهد بود ولی سرعت کار بیشتر و مقدار کدنویسی کمتر می‌شود اما این احتمال وجود دارد که فایل‌های حجیم کامل باز نشوند و اطلاعات به طور کامل در دسترس قرار نگیرد، بنابراین بهتر است برای اطمینان از بارگزاری کامل اطلاعات از روش غیر همزمان استفاده شود.

conn.openAsync(dbFile);

۷- حالا تابعی را تعریف می‌کنیم که بعد از اتصال موفق و کامل شدن بارگزاری اطلاعات توسط conn فراخوانی می‌شود.

function dbOpened(e:SQLEvent):void
{
	createTable();
}

• در این تابع، تابع createTable فراخوانی می‌شود. این تابعی است که برای ساختن Table و فیلدهای آن در ادامه تعریف می‌شود.

۸- سپس تابعی را تعریف می‌کنیم که در صورت اتصال نا موفق conn به فایل پایگاه داده فراخوانی می‌شود.

function dbError(e:SQLErrorEvent):void
{
	trace("Error DB");
	trace(e.error);
}

۹- نوبت به تعریف تابع createTable رسید که برای ساختن جدول (در صورت عدم وجود) بر روی فایل پایگاه داده به  کار می‌رود.

function createTable():void
{
	query = new SQLStatement();
	query.sqlConnection = conn;
	queryText = "CREATE TABLE IF NOT EXISTS 'website' ( id INTEGER PRIMARY KEY AUTOINCREMENT, name TEXT, url TEXT )";
	query.text = queryText;
	query.addEventListener(SQLEvent.RESULT, queryResult);
	query.addEventListener(SQLErrorEvent.ERROR, queryError);
	query.execute();
}

• در این تابع ابتدا یک SQLStatement جدید ساخته می‌شود.
• سپس query اطلاعات conn را به جریان می‌اندازد.
• دستور مورد نظر برای اجرا توسط query، در queryText قرار می‌گیرد. طبق این دستور ابتدا یک جدول (در صورت عدم وجود) به نام website ساخته می‌شود که حاوی سه فیلد است. فیلد اول id است که یک INTEGER است و به صورت اتوماتیک یکی یکی زیاد می‌شود، فیلد دوم name از نوع TEXT و فیلد سوم url از نوع TEXT می‌باشد. در این مثال قرار است که این پایگاه داده مجموعه ای از آدرس‌های چند وبسایت باشد.
• در ادامه queryText به query معرفی شده است.
• برای اطلاع از موفق یا نا موفق بودن فرآیند ساخت جدول، دو Event Listener برای query تعریف شده است.
• در انتها اطلاعات جدید با دستور execute روی فایل پایگاه داده اعمال شده اند.

۱۰- تابعی که در صورت موفق بودن فرآیند ساخت جدول فراخوانی می‌شود، به قرار زیر است:

function queryResult(e:SQLEvent):void
{
	trace("table created.");
}

۱۱- تابعی را که در صورت عدم موفقیت آمیز بودن ثبت اطلاعات فراخوانی می‌شود، به صورت زیر تعریف می‌کنیم:

function queryError(e:SQLErrorEvent):void
{
	trace("Error QUERY");
	trace(e.error);
}

+ منبع

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

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

برای بهینه سازی کد خود ، سعی کنید همیشه ازثابت کردن (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ها و…

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

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

بخش دوم – استفاده دوباره از 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;

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