tinhoctuoixanh@gmail.com

Hiển thị các bài đăng có nhãn FlashLite. Hiển thị tất cả bài đăng
Hiển thị các bài đăng có nhãn FlashLite. Hiển thị tất cả bài đăng

Chủ Nhật, 21 tháng 11, 2010

Ví dụ tạo ứng dụng FlashLite với CS4.0 và AS2.0

Flash Lite runtime đã được tối ưu hóa cho các thiết bị điện tử chủ yếu là thiết bị di động, nó nhẹ hơn nền tảng Adobe Flash thông thường, hỗ trợ sử dụng ít tài nguyên CPU, kích thước file nhỏ hơn, dùng ít bộ nhớ hơn. Có thể tạo mọi kiểu nội dung với FLash Lite từ những trò chơi, hoạt hình màn hình bảo vệ, màn hình, bản đồ... Trong ví dụ này sẽ mô tả từng bước quá trình sáng tạo một ứng dụng FlashLite điển hình cho di động. Ứng dung tự động gửi email đến một địa chỉ định trước.

Có nhiều phiên bản FLashLite khác nhau ứng với các đòng diện thoại khác nhau, trong ví dụ này giới thiệu Flash Lite 3.0 thử nghiệm với trình giả lập Nokia N96. Tuy nhiên ứng dụng này cũng có thể làm việc trên mọi dòng điện thoại hỗ trợ FlashLite 3.0

Yêu cầu

Adobe Flash CS3 / CS4 Professional
  • Adobe Device Central CS3 / CS4
  • Access to PHP server

Download Source Files

Yêu cầu kiến thức

Biết sử dụng Flash CS 4.0 và lập trình ActionScript 2.0


Bước 1 : Tạo một tài liệu mới

Khởi động FLash IDE. Trong màn hình khởi động chọn "Flash File (Mobile) để khởi động ứng dụng Adobe Device Central.

Create a New Flash Lite Document


Bước 2 : Cài đặt thiết bị

Góc trái màn hình là biểu tượng thư viện trực tuyến ”Online Library” cung cấp toàn thể danh sách các điện thoại di động. Tìm thiết bị Nokia N96 và click dúp để cài đặt trình giả lập thiết bị sẽ được cài đặt trên máy tính nhà thiết kế.

Install the Device



Bước 3 : Lựa chọn thiết bị

Góc trên bên phải của Thư viện trực tuyến ”Online Library” tìm trong thư viện địa phương ”Local Library”. Gồm danh sách các trình giả lập thiết bị đã tải về từ thư viện trực tuyến. Click đúp để chọn Nokia N96.

Select the Device


Bước 4 : Xem lại thông tin thiết lập cho thiết bị

Xem lại thông tin của thiết bị Nokia N96. gồm các kiểu thông tin về dòng điện thoại này, kích cỡ màn hình, nền tảng và phiên bản Flash Lite được hỗ trợ.

Check the Device information



Bước 5 : Tạo tài liệu Flash

Chọn ”New Document” để tạo tài liệu mới. Chọn Flash Lite version là Flash Lite 3.0 và ActionScript Version là ActionScript 2.0. Sau khi xác lập các thông số, click đúp vào hình ảnh điện thoại cạnh đó để tạo ra một tài liệu Flash mới với mọi xác lập cần thiết cho dòng điện thoại này. Sau đó ta có thể làm việc với file .fla như một ứng dụng desktop thông thường.Create the Flash Document

Bước 6 : Tạo hình nền cho ứng dụng

Quay trở lại Flash IDE. Đặt tên lớp đầu tiên là ”background”. Chúng ta bắt đầu bằng việc tạo một hình nền cho ứng dụng. Với công cụ vẽ hình chữ nhật rectangle, tạo một hình chữ nhật cùng kích thước trên màn hình. Áp dụng chế độ đổ mầu phù hợp (từ dưới lên trên)

Assign the Background


Bước 7 : Tạo các nhãn cho ứng dụng

Kết tiếp tạo một lớp mới đặt tên là ”form” . Các phần tử của ứng dụng sẽ được bổ sung trên lớp mới này. Tạo ba trường text như trên hình dưới đây


Create the Labels


Bước 8 : Tạo các trường nhập liệu cho ứng dụng

Tạo ba trường nhập liệu kiểu input text như hình dưới, gõ một vài từ trong các trường này để dễ định vị chúng trên màn hình phát triển.

Insert the Input Text Fields

Bước 8 : Đặt tên cho các trường nhập liệu

Đặt tên cho các trường ” emailInput”, ”subjectInput” và ” messageInput”.

Instance Names


Bước 8 : Thêm nút điều khiển cho người sử dụng

Chúng ta muốn gửi mail khi người dùng bấm nút phải (nút mềm softkey) của điện thoại di động. Đặt nhãn Send tại góc dưới cùng bên phải.

Send Button


Bước 9 : Màn hình phản hồi

Sau khi mail được gửi cần cung cấp một thông báo cho người sử dụng. Do vậy trong lớp "form" tạo một keyframe mới tại frame số 2 bằng cách bấm F6. Vì nền hình sẽ cùng kích thước trong cả hai màn hình, tạo một frame thông thường với lớp ”background” ở frame 2 (F5)Bước 10 : Hộp thông báo phản hồi.

Trong frame thứ 2 của lớp "form", tạo một trường text động ở trung tâm của màn hình. Căn chỉnh kích thước trường text đủ lớn để hiển thị thông tin phản hồi. Đặt tên trường text là ”serverResponse”.


The Server Response screen



Bước 10 : Nút thoát ứng dụng

Sau cùng, bạn muốn người dùng có thể thoát khỏi ứng dụng bằng việc bấm phím mềm bên phải. Do vậy trong cùng frame khi hiển thị thông tin đáp ứng từ máy chủ, tạo một trường text ở góc dưới bên phải màn hình với chữ "Quit".


The Quit Button


Bước 10 : Mã ActionScript trong Frame 1

Tạo một lớp mới đặt tên là ”actions”. Trong frame đầu tiên của lớp "actions", gõ đoạn mã dưới đấy.

//Stop the movie
stop();

// sets your content to be full screen
fscommand2("FullScreen", true);

// sets your content to dsiplay at high quality
fscommand2("SetQuality", "high");

// set soft keys
fscommand2("SetSoftKeys", null, "Send");

//We will save the server response to this variable
var serverResponseText = "";

//We use LoadVars to send the data to the server
formData = new LoadVars();

//Create a new object that will listen for the key presses
var myListener:Object = new Object();

//Assign the key listener
Key.addListener(myListener);

//This function is called when a key is pressed
myListener.onKeyDown = function() {

//Check if this is the right side soft key
if (Key.getCode() == ExtendedKey.SOFT2) {

//Assign the values to the LoadVars
formData.email = emailInput.text;
formData.subject = subjectInput.text;
formData.message = messageInput.text;

//Send the data to the server
formData.sendAndLoad('http://flashmymind.com/email.php',formData,"POST");
}
};

//This function is called when we get data from the server
formData.onLoad = function(success) {

//If we have succeeded
if (success) {
serverResponseText = "Email has been sent to " + this.sentTo;
}
else {
serverResponseText = "Could not connect to server!"
}

//Go to the second frame
gotoAndStop(2);
};

Bước 11 : Mã ActionScript trong Frame 2

Tạo một keyframe mới trên frame thứ 2 trong lớp "actions". Nhập đoạn mã dưới đây
//Give feedback to the user
serverResponse.text = serverResponseText;

// set soft keys
fscommand2("SetSoftKeys", null, "Quit");

var myListener2:Object = new Object();

//Assign the key listener
Key.addListener(myListener2);

//This function is called when a key is pressed
myListener2.onKeyDown = function() {

//Check if this is the right side soft key
if (Key.getCode() == ExtendedKey.SOFT2) {

//Quit the application
fscommand("Quit");
}
}

Bước 12 : Chuẩn bị ứng dụng trên máy chủ

Ứng dụng đã hoàn thành trên máy khách. Cần thêm đoạn mã ứng dụng trên máy chủ để email có thể được gửi đi. Có thể sử dụng một ngôn ngữ máy chủ phổ dụng là PHP hoặc bất kỳ ngôn ngữ động nào. Tạo một file .php và nhập dòng mã.
$sendTo = $_POST["email"];
$subject = $_POST["subject"];
$message = $_POST["message"];

mail($sendTo, $subject, $message);

echo "&sentTo=$sendTo";
?>

Ở đây ta chỉ đơn giản gửi các số liệu đến máy chủ và gọi đến dịch vụ gửi mail đến một đỉa chỉ email cụ thể. Sau đó ta gán biến "sentTo” giữ địa chỉ email mà ta vừa gửi đi.

Lưu file này thành ”email.php” và upload lên máy chủ server ứng dụng.

Bước 13 : Chạy thử ứng dụng

Sau khi hoàn thành các bước. Chạy thử ứng dụng với tổ hợp phím Ctrl + Enter để kiểm tra ứng dụng Flash Lite vừa tạo. Cửa sổ Adobe Device Central với trình giả lập Nokia N96 sẽ hiển thị. Để nhập ký tự vào trường nhập liệu, bấm phím lựa chọn ở trung tâm của điện thoại. Trình giải lập sau đó sẽ mô phỏng các tính năng của trường nhập liệu trên điện thoại thực.

Ứng dụng hoàn chỉnh trên hình dưới đây


Final Flash Lite Application

Bây giờ bạn sẽ nhận được email trong hộp thư theo địa chỉ mà bạn đã gửi! Lưu ý trình giả lập không hỗ trợ chức năng "Quit", nên cần thử nghiệm thêm trên thiết bị thực.





Reference :
Creating a Flash Lite Application with Flash CS4 and Actionscript 2.0

Quy trình phát triển ứng dụng Mobile với Adobe CS 4

Mobile Workflow in Adobe Creative Suite 4

Vai trò của thiết bị di động trong khung canh
The role of mobile in the Adobe landscape
Device Central CS4
Flash CS4
Illustrator CS4
Photoshop CS4
After Effects CS4
Q&A

CEO and founder of Moket
Adobe Community Expert (Mobile)
Adobe Instructor (Mobile Developer
Adobe Ambassador
Forum Nokia Champion

Flash technology for Mobile Devices
Optimised version of the Flash player for non-PC devices
Implemented across various device manufacturers and models

The role of mobile in the Adobe landscape
Mobile is now part of the Flash Platform
Open Screen Project bringing it to the forefront
Convergent devices driving a convergent ecosystem of platforms and tools
Late 2009 for FP10 and AIR mobile

The mobile workflow
DESIGN -> DEVELOP -> TEST -> DEPLOY

AI, PS, AE -> Fl, DW -> CD -> APP

Overview of Device Central CS4
Access up-to-date device profiles through online database
Group together project-related files, device profiles and Tasks into a single Project
Take still image snapshots of content and export to HTML
Record video presentations of content
Write and execute test scripts on Flash Lite content
Run scripts across multiple devices at once
Launch new mobile-ready documents for CS4 tools

Mobile Workflow in Adobe CS4 from Adobe Flash Lite on Vimeo.

The Adobe Creative Suite 4 tools offer smooth workflows for both designers and developers creating mobile applications and content. In this episode, we take a walk through the relevant CS4 tools and see this workflow in action.

The "Developing with Flash Lite" video tutorial series by Dale Rankine guides developers of all levels through the tools and techniques used when creating content for the Flash mobile platform. Learn from broad concepts as well as how-to code samples in this easy-to-watch format.

These videos will also be available shortly through AdobeTV and the Mobile and Devices Developer Center

Video

File -> New -> Flash File (Mobile) -> Xác nhận OK để mở Device Central -> thiết lập Device Central Profile trong New Document chọn Player Version là FlashLite 3.0, chọn ActionScript Version là ActionScript 2.0; chọn Content Type là Standalone Player , chọn Full Screen -> chọn trong Local Library profile thiết bị với kích thước màn hình tương ứng ->Chọn Custom Size for All Seleted Devices -> Chọn Create để khởi tạo ứng dụng với các thiết lập đã chọn -> Sau khi khởi tạo thành công chọn Control -> Test Movie để thử nghiệm ứng dụng trong trình mô phỏng thiết bị -> quan sát kiểm tra sự hiển thị trong trình giả lập Emulator -> Ở giai đoạn này có thể chuyển sang thiết kế ảnh nền giao diện trong Photoshop CS4.0, sau khi hoàn thành chuyển sang Flash để lập trình kịch bản -> Trong Device Central có thể chỉnh sửa ảnh trong Scaling thành Stretch to Screen hoặc Fit Proportionaly để khớp ảnh với màn hình thiết bị


Source Mobile Workflow with Creative Suite 4

Thứ Tư, 27 tháng 10, 2010

FlashLite

FlashLite là gì ?

Tại sao lại FlashLite?

Ứng dụng FlashLite khi nào ?

Ứng dụng FlashLite ở đâu ?

FlashLite dành cho những ai ?

Cách phát triển ứng dụng với FlashLite
+ Giao diện người dùng
+ Center Device - mô phỏng ngoại vi
+ Quy trình phát triển ứng dụng
+ Xuất bản ứng dụng
+ Ví dụ
+ Điều hướng trên dế
+ Tạo một menu
+ Tạo một trắc nghiệm đơn giản
+ Tạo một trình diễn trên di động



http://www.forum.nokia.com/Develop/Other_Technologies/Flash_lite/Tutorials.xhtml

http://www.adobe.com/devnet/devices/flashlite.html

http://www.adobe.com/devnet/devices.html

Flash Lite Tutorial
Creating a Flash Lite Game - TutorialFlash Lite Tutorials | Adobe Flash Lite

Flash Lite Tutorial | Mariam Dholkawala's Mobile Blog


Developing with Flash Lite Tutorial


Create a Flash Lite Application with Flash CS4 and Actionscript .


Flash Lite Tutorials & Articles


Flash Lite Tutorials | Adobe Flash Lite


Creating a Flash Lite Game - Tutorial


Flash Lite Tutorial: How to Install Flash Lite Menus



Adobe Flash Lite là phiên bản rút gọn của Adobe Flash Player, phần mềm ứng dụng của Adobe System. Phiên bản này dành cho các thiết bị di động cho phép người dùng xem những nội dung và ứng dụng đa phương tiện dùng công cụ của Adobe Flash, những nội dung trước đây chỉ có thể xem trên máy tính cá nhân.

Công nghệ Flash Lite được thực hiện trên trình duyệt khách, hay lớp giao diện người dùng. Những thay đổi gần đây của ActionScript cho phép tích hợp Flash Lite tốt hơn thậm chí hoàn toàn với công nghệ lớp thiết bị kiểu như Java ME và BREW. Flash Lite không nên xem như hệ điều hành trên điện thoại kiểu như Symbian OS, Window Mobile hay IOS (iPhone OS) hoặc Android, đơn giản nó chỉ là công nghệ để phát triển những ứng dụng chạy trên các hệ điều hành trên thiết bị di động.

Flash Lite 1.1 hỗ trợ Flash 4 ActionScript Flash Lite 2.0 trên trình duyệt Flash Player 7, hỗ trợ những tính năng mới có trong ActionScript 2.0. Cả hai phiên bản hỗ trợ chuẩn WEB SVG Tiny cho thiết bị di động. Không giống như SVG, Flash Lite có thể thêm các phần từ âm thanh và tương tác mà không dùng đến các công nghệ khác như JavaScript. Giống Flash, Flash Lite cũng có thể đọc và vẽ các nội dung XML bên ngoài. Flash Lite 3 xây dựng dựa trên Flash 8, thu hẹp khoảng cách giữa các nội dung trên di động và nội dung trên máy tính bằng việc hỗ trợ chuẩn video H.264, cũng như các mã video On2 VP6 và Sorenson. Các nội dung video FLV cũng được hỗ trợ. FLash Lite 4.0 hỗ trợ ActionScript 3, và là một plugin trình duyệt chứ không còn là một player riêng lẻ nữa.

Flash Lite 3.0 dựa trên Flash Player 8 hỗ trợ FLV giống như định dạng sử dụng trên Youtube và Google Video. Flash Lite 2.0 và 2.1 không hỗ trợ FLV.

Trong năm 2005, Adobe System hoàn tất việc hợp nhất với Macromedia, nhà phát triển ban đầu của Flash. Tại thời điểm đó, Flash Lite đã có thể sử dụng cho những người dùng điện thoại di động ở Nhật bản và châu Âu và sau đó ít lâu với người dùng ở Mỹ. NTT DoCoMo là nhà cung cấp dịch vụ đầu tiên tích hợp Flash Lite vào tháng 5 năm 2003.

Khi tiếp thị cho Flash Lite vào tháng 2 năm 2005, Macromedia đã tổ chức cuộc thi thiết kế nội dung Flash trên Mobile lần đầu tiên. Từ hơn 150 ứng dụng được gửi tới, chín ứng dụng đã được chọn trong số các ứng dụng kinh doanh sản xuất hiệu quả và sáng tạo nhất sử dụng trên công nghệ Flash Lite, Ứng dụng hoạt hình, Ứng dụng kinh doanh, nội dung giáo dụng, game hay nhất, nội dung tương tác, Ứng dụng hiệu quả nhất và Flash Lite tốt nhất về mọi khía cạnh.

Tháng 5 năm 2006, với sự ra đời của iriver U10 (phiên bản của iriver clix) hỗ trợ nội dung FLash Lite trong hướng trang landscape. U10 là trình player âm thanh số đầu tiên hỗ trợ Flash Lite.

Vào năm 2005, hầu như 100% thiết bị hỗ trợ Flash Lite là ở Nhật bản. Vào tháng 2 năm 2007, Adobe công bố trên 70% thiết bị Flash Lite được đưa ra thị trường Nhật bản.

Tháng 10 năm 2006, Verizon Wireless công bố hỗ trợ Flash Lite, trở thành hệ điều hành đầu tiên ở Mỹ hỗ trợ công nghệ này. Flash Lite ban đầu có thể trên bốn mô hình thiết bị (Motorola RAZR V3c và V3m, Samsung SCH - a950 và LG The V (VX9800) cũng như phần mở rộng của BREW. Điều này cho phép người dùng download ứng dụng Flash Lite từ dịch vụ "Get It Now" của Verizon , nhưng chưa cho phép người dùng xem các đối tượng Flash từ trình duyệt thiết bị của họ.
Tháng 2 năm 2007, Adobe công bộ tại hội thảo 3GSM World Congress ở Barcelone về phiên bản Flash Lite mới (version 3) sẽ hỗ trợ video, luồng video streaming. Tháng 10 năm 2007 Adobe ra mắt phiên bản FLash Lite 3.

Tại hội thảo phân tích tài chính Adobe 2007, Al Ramadan, thành viên cao cấp của Adobe Mobile và đơn vị kinh doanh giải pháp âm thanh công bố vào tháng 12 năm 2006, 220M thiết bị Flash Lite đã có mặt trên thị trường. Đồng thời cũng tuyên bố Adobe đã kết hợp công nghệ tạo ảnh vector của Actimagine, nhằm giảm tiêu thụ bộ nhớ của các trình điều khiển Flash Lite trong các phiên bản tương lai.

Cho đến tháng Ba năm 2008, cả Adobe lẫn Verizon Wireless chưa công bố khả năng của Adobe Flash Cast, theo thông cáo tháng 2 năm 2007 về khả năng ra mắt vào cuối năm 2007. Cùng tháng này, Stive Jobs mô tả Flash Lite như là " không khả thi để dùng với Web".

Vào tháng 9 năm 2009, Opera Software tích hợp FLash Lite 3.1 vào ứng dụng Internet Channel cho điều khiển game Wii.

Tháng 9 năm 2010, John Gruber đặc trưng Flash Lite như "nỗ lực chủ yếu để thiết lập một nền tảng phần mềm cho mobile" là "hoàn toàn thất bại"

Các phiên bản
  • Macromedia Flash Lite 1.0 và 1.1
    • Trên trình điều khiển Flash Player 4
  • Macromedia Flash Lite 2.0 (Tháng 12 năm 2005)
    • Ra mắt năm 2005, ra thị trường cùng với trình điều khiển Flash Player 7.
  • Adobe Flash Lite 2.1 (Tháng 12 năm 2006)
    • Chạy trên nền tảng BREW
  • Adobe Flash Lite 3 (Ra mắt vào tháng 2 năm 2007)
    • Hỗ trợ chuyển mã FLV
  • Adobe Flash Lite 3.1 (Tháng 2 năm 2009)

Adobe Flash Lite 4 chưa ra mắt vào tháng 5 năm 2010, mặc dù Adobe đã đưa ra các tài liệu tham khảo cho nhà phát triển trên website của họ

So sánh Flash Lite với các nền tảng phát triển tương tự

Flash Lite là nền tảng phát triển cho thiết bị di động có thể dùng trên cả Java ME lẫn trên trình điều khiển Flash Lite Player mà chạy trên Java ME. Các nền tảng khác có thể kể đến như BREW, Symbian, và Window Mobile. Năm 2006 Qualcomm công bố kết hợp với Adobe đưa trình điều khiển Flash Lite chạy trên môi trường BREW thời gian chạy (runtime).

Nội dung Flash Lite có thể xem trên các thiết bị cầm tay di động cài đặt trình điều khiển Flash Lite cùng với các mà các nội dung Java hiển thị trên các thiết bị đó với Java ME runtime. Cả hai công nghệ này có thể cùng chạy trên cùng một thiết bị không bị tranh chấp trực tiếp.
Các ứng dụng, trò chơi và những nội dung khác cũng có thể phát triển trong những công nghệ khác. Flash Lite có một vài ưu điểm và một số nhược điểm khi so sánh với Java ME.

Ưu điểm:

  • Phát triển nhanh do sự hỗ trợ của Adobe Flash IDE giúp cho quá trình lập trình kiểm thử tương đối dễ dàng
  • Hỗ trợ tốt phương thức WORA viết một lần, chạy mọi nơi (write once, run anywhere) không phụ thuộc vào một API cụ thể nào. Kết quả là không phải xuất bản cho từng nền tảng di động mà là hạn chế chủ yếu khi phát triển với Java ME
  • Độ họa vetor (cũng hỗ trợ bitmap) cho phép dễ dàng phóng to thu nhỏ, xoay góc và các biến đổi khác mà không giảm chất lượng
  • Khả năng đóng gói nhiều hoạt hình, đồ họa vào cùng một kích thước file nhờ sử dụng đồ họa vector
  • Khả năng chuyển đổi nội dung Flash trên máy tính (trên cơ sở web) sang thiết bị di động và ngược lại với rất ít công sức.
  • Kỹ năng phát triển Flash - hiểu biết IDE và các ngôn ngữ kịch bản - sẵn sàng để chuyển từ IDE trên máy tính để ban sang môi trường phát triển trên thiết bị di động

Hạn chế:

  • Đến mùng 2 tháng 10 năm 2008, chỉ có 361 điện thoại hỗ trợ Flash Lite. Tuy nhiên điều này đang nhanh chóng thay đổi ở Bắc Mỹ và Châu Âu với sự vào cuộc của những hãng như Verizon và các nhà sản xuất như Nokia, Sony Ericsson và LG đã công bố thiết bị Flash Lite vào năm 2006 và 2007. Giới hạn này có thể là một hạn chế đối tượng của nó so với Java ME, Symbian, hay BREW
  • Hiệu năng đồ họa tương đối thấp (do yêu cầu quá trình xử lý đồ họa vector phức tạp hơn)
  • Xử lý âm thanh nghèo nàn hơn so với các chương trình khác