TRƯỜNG ĐẠI HỌC KHOA HỌC TỰ
NHIÊN KHOA CÔNG NGHỆ
THÔNG TIN

VŨ TẤN HƯNG
NGUYỄN THỊ MINH TỒN

TÌM HIỂU NGƠN NGỮ LẬP TRÌNH TRONG ADOBE FLASH
VÀ XÂY DỰNG ỨNG DỤNG MINH HỌA

KHÓA LUẬN TỐT NGHIỆP CỬ NHÂN CNTT

TP. HCM, NĂM ….


VŨ TẤN HƯNG – 05HC084
NGUYỄN THỊ MINH TỒN – 05HC192

TÌM HIỂU NGƠN NGỮ LẬP TRÌNH TRONG ADOBE FLASH
VÀ XÂY DỰNG ỨNG DỤNG MINH HỌA

KHÓA LUẬN TỐT NGHIỆP CỬ NHÂN CNTT

GIÁO VIÊN HƯỚNG DẪN
Thạc sĩ LƯƠNG HÁN CƠ

KHÓA ….


Tìm hiểu ngơn ngữ lập trình trong Adobe Flash - Xây dựng ứng dụng minh họa

LỜI CÁM ƠN

Chúng em chân thành cám ơn các Thầy Cô Khoa Công nghệ Thông tin trường Đại
học Khoa học Tự Nhiên đã hướng dẫn, giảng dạy tận tình và truyền đạt cho chúng
em những kiến thức vô cùng quý báu trong suốt những năm học vừa qua.
Chúng em xin gửi lời cám ơn chân thành và sâu sắc nhất đến Thầy Lương Hán Cơ
đã tận tụy hướng dẫn, động viên và giúp đỡ chúng em trong suốt thời gian thực
hiện đề tài.
Chúng em xin cám ơn sự giúp đỡ tận tình của Thầy Lương Vĩ Minh.
Chúng con xin gửi lịng biết ơn đến Ơng Bà, Cha Mẹ đã ln chăm sóc, ủng hộ
chúng con trên suốt những bước đường học vấn.
Xin cám ơn các anh chị và bạn bè đã động viên và giúp đỡ chúng em trong suốt
thời gian học tập và nghiên cứu.
Mặc dù chúng em đã cố gắng hết sức để hoàn thành luận văn một cách tốt nhất
nhưng chắc chắn sẽ khơng tránh khỏi những thiếu xót. Chúng em kính mong nhận
được sự cảm thơng và tận tình chỉ bảo của quý Thầy Cô và các bạn.
Sinh viên thực hiện
Vũ Tấn Hưng – Nguyễn Thị Minh Toàn

Vũ Tấn
Hưng

3

Nguyễn Thị Minh Toàn


MỤC LỤC
Chương 1. Tổng quan.......................................................................................... 8
Chương 2. FLEX................................................................................................ 11

2.1.
2.1.1.
2.1.2.
2.1.3.
2.1.4.
2.1.5.
2.1.6.

2.2.
2.2.1.
2.2.2.
2.2.3.

2.3.
2.3.1.
2.3.2.
2.3.3.

2.4.
2.4.1.
2.4.2.
2.4.3.
2.4.4.

2.5.
2.5.1.
2.5.2.
2.5.3.

2.6.

2.6.1.
2.6.2.
2.6.3.
2.6.4.
2.6.5.
2.6.6.
2.6.7.

2.7.
2.7.1.
2.7.2.

Giới thiệu........................................................................................................................... 11
Những công nghệ trong ứng dụng Flex....................................................................................... 11
Sử dụng những phần tử của Flex................................................................................................ 14
Bảo mật của Flash Player........................................................................................................... 15
Làm việc với dịch vụ dữ liệu - Data services.............................................................................. 15
Sự khác biệt giữa ứng dụng HTML và ứng dụng Flex Web......................................................... 16
Cách làm việc của ứng dụng Flex............................................................................................... 16

Làm việc với dữ liệu......................................................................................................... 17
Sử dụng mơ hình dữ liệu............................................................................................................ 17
Kết buộc dữ liệu......................................................................................................................... 19
Kết buộc dữ liệu cho lớp tự định nghĩa.......................................................................................21

Giao tiếp dữ liệu từ xa.....................................................................................................21
Việc yêu cầu và nhận giao tiếp dữ liệu........................................................................................ 22
Kết nối Real-Time/ Socket......................................................................................................... 27
Tải file lên và tải file xuống........................................................................................................ 27


Các thành phần giao diện................................................................................................28
Khái quát.................................................................................................................................... 28
Khởi tạo các thành phần giao diện.............................................................................................. 30
Các thuộc tính phổ biến của các thành phần giao diện................................................................30
Xử lý sự kiện.............................................................................................................................. 31

Làm việc với Media..........................................................................................................33
Những kiểu Media được hỗ trợ trong Flex..................................................................................33
Cách thêm Media vào ứng dụng................................................................................................. 33
Làm việc với các loại Media khác nhau......................................................................................36

Quản lý các trạng thái.....................................................................................................41
Khởi tạo trạng thái...................................................................................................................... 42
Áp dụng các trạng thái................................................................................................................ 42
Định nghĩa các trạng thái dựa trên các trạng thái có sẵn..............................................................42
Thêm bớt các thành phần............................................................................................................ 43
Thiết lập các thuộc tính.............................................................................................................. 44
Thiết lập các kiểu....................................................................................................................... 45
Thiết lập bộ điều khiển sự kiện - Event Handlers........................................................................45

Sử dụng các hiệu ứng và sự chuyển tiếp giữa các trạng thái.........................................46
Sử dụng hiệu ứng....................................................................................................................... 46
Transitions - Sự chuyển tiếp giữa các trạng thái..........................................................................49

Chương 3. ActionScript.....................................................................................51
3.1.

Giới thiệu..........................................................................................................................51



3.2.
3.2.1.
3.2.2.
3.2.3.

3.3.

Các thành phần cơ bản trong ActionScript....................................................................51
Lớp và đối tượng........................................................................................................................ 51
Packages.................................................................................................................................... 53
Hàm và biến............................................................................................................................... 53

Sự kiện và xử lý sự kiện...................................................................................................57

3.3.1. Sự kiện ActionScript cơ bản....................................................................................................... 57
3.3.2. Đăng ký một phương thức đăng ký sự kiện - Event listener........................................................58
3.3.3. Hủy đăng ký một phương thức đăng ký sự kiện - Event listener.................................................61
3.3.4. Đối tượng Target........................................................................................................................ 61
3.3.5. Quyền ưu tiên đối với phương thức đăng ký sự kiện - Event Listener.........................................61

3.4.
3.4.1.
3.4.2.
3.4.3.

3.5.

ActionScript động.............................................................................................................62
Biến động................................................................................................................................... 63
Tự động thêm hành vi mới cho một thể hiện...............................................................................63

Tham chiếu động cho biến và phương thức.................................................................................64

XML và E4X.....................................................................................................................65

3.5.1. Dữ liệu phân cấp XML............................................................................................................... 65
3.5.2. Truy cập dữ liệu XML................................................................................................................ 67
3.5.3. Thao tác dữ liệu XML với câu lệnh for-each-in và for-in............................................................69
3.5.4. Trích lọc dữ liệu XML................................................................................................................ 69
3.5.5. Thay đổi hoặc tạo mới nội dung XML........................................................................................71
3.5.6. Thêm thuộc tính hoặc thành phần mới........................................................................................72
3.5.7. Xóa thành phần và thuộc tính..................................................................................................... 73
3.5.8. Nạp dữ liệu XML....................................................................................................................... 73

Chương 4. Ứng dụng..........................................................................................75
4.1.

Giới thiệu ứng dụng.........................................................................................................75

4.2.

Yêu cầu chức năng...........................................................................................................75

4.3.

Yêu cầu phi chức năng.....................................................................................................76

4.4.

Mô hình use case...............................................................................................................76


4.5.

Mơ tả ứng dụng................................................................................................................77

4.5.1.
4.5.2.
4.5.3.
4.5.4.
4.5.5.

4.6.
4.6.1.
4.6.2.
4.6.3.

Màn hình đăng nhập................................................................................................................... 77
Màn hình đăng ký....................................................................................................................... 79
Màn hình quản lý....................................................................................................................... 80
Màn hình xem ảnh...................................................................................................................... 86
Màn hình tạo slideshow.............................................................................................................. 90

Cơ sở dữ liệu.....................................................................................................................93
Mơ hình quan hệ........................................................................................................................ 93
Thuyết minh mơ hình quan hệ và thuộc tính...............................................................................94
Mơ tả ràng buộc về khóa............................................................................................................ 95

Chương 5. Tổng kết............................................................................................96
Chương 6. Danh mục tài liệu tham khảo..........................................................97
Chương 7. Phụ lục..............................................................................................98
Phần 1: FLEX........................................................................................................98



7.1.

Các sự kiện hiệu ứng........................................................................................................98

7.2.

Chuẩn hóa và định dạng dữ liệu.....................................................................................99

7.2.1.
7.2.2.

7.3.

Chuẩn hóa dữ liệu người dùng nhập vào..................................................................................... 99
Định dạng dữ liệu..................................................................................................................... 101

Tùy biến giao diện..........................................................................................................102

7.3.1.
7.3.2.
7.3.3.
7.3.4.

Sử dụng các Style..................................................................................................................... 102
Sử dụng Skin............................................................................................................................ 102
Dùng Themes........................................................................................................................... 103
CSS thực thi............................................................................................................................. 104


Phần 2: ActionScript............................................................................................105
7.4.

Điều kiện – Vịng lập – Tốn tử.....................................................................................105

7.4.1.

Điều kiện.................................................................................................................................. 105

7.5.

Phương thức tĩnh và biến tĩnh.......................................................................................106

7.6.

Kế thừa............................................................................................................................106

7.6.1.
7.6.2.
7.6.3.
7.6.4.

7.7.

Tái định nghĩa – ghi đè một phương thức.................................................................................. 107
Phương thức Super()................................................................................................................ 108
Ngăn chặn kế thừa và phương thức định nghĩa lại.....................................................................108
Composition............................................................................................................................. 109

Interfaces........................................................................................................................109


7.7.1.
7.7.2.
7.7.3.

7.8.

Tại sao phải dùng Interface?..................................................................................................... 110
Cú pháp và cách sử dụng interface............................................................................................ 110
Kế thừa interface...................................................................................................................... 111

Mảng................................................................................................................................112

7.8.1. Thêm phần tử vào mảng........................................................................................................... 112
7.8.2. Xóa bỏ phần tử trong mảng:...................................................................................................... 114
7.8.3. Phương thức toString():............................................................................................................ 114
7.8.4. Mảng đa chiều.......................................................................................................................... 115

7.9.

Xử lý lỗi...........................................................................................................................115

7.10.

XML và E4X...................................................................................................................116

7.10.1.
7.10.2.
7.10.3.
7.10.4.

7.10.5.

Truy cập những nút văn bản...................................................................................................... 116
Truy cập nút cha....................................................................................................................... 117
Truy cập nút anh em................................................................................................................. 118
Truy cập những thuộc tính........................................................................................................ 118
Truy cập các nút hậu duệ........................................................................................................... 119


DANH MỤC CÁC BẢNG

Bảng 1: Các thành phần giao diện.......................................................................29
Bảng 2: Một số sự kiện của thành phần chuẩn trong Flex.................................33
Bảng 3: Những kiểu media được hỗ trợ trong Flex............................................33
Bảng 4 : Một số hiệu ứng cơ bản..........................................................................46
Bảng 5: Các lớp tự nhiên của ActionScript.........................................................52
Bảng 6: Điều khiển truy xuất biến.......................................................................54
Bảng 7: Điều khiển truy xuất hàm.......................................................................54
Bảng 8: Mô tả chi tiết màn hình đăng nhập........................................................77
Bảng 9: Mơ tả chi tiết màn hình đăng ký.............................................................80
Bảng 10: Mơ tả chi tiết màn hình quản lý...........................................................83
Bảng 11: Mơ tả chi tiết màn hình xem ảnh dạng thumbnail..............................87
Bảng 12: Mơ tả chi tiết màn hình xem ảnh dạng carousel..................................87
Bảng 13: Mơ tả chi tiết màn hình xem ảnh dạng list..........................................89
Bảng 14: Mơ tả chi tiết màn hình xem thơng tin ảnh..........................................89
Bảng 15: Mơ tả chi tiết màn hình tạo slideshow..................................................91
Bảng 16:Thuyết minh bảng NGUOIDUNG.........................................................94
Bảng 17:Thuyết minh bảng HINH.......................................................................94
Bảng 18:Thuyết minh bảng ALBUM...................................................................94
Bảng 19:Thuyết minh bảng CHITIETALBUM..................................................95

Bảng 20: Mơ tả ràng buộc khóa chính.................................................................95
Bảng 21: Mơ tả ràng buộc khóa ngoại.................................................................95


DANH MỤC CÁC HÌNH

Hình 1: Silverlight................................................................................................... 8
Hình 2: Flex............................................................................................................. 9
Hình 3: Những ứng dụng sử dụng cơng nghệ Flex.............................................. 10
Hình 4: Flex SDK................................................................................................... 11
Hình 5: Flex Framework....................................................................................... 12
Hình 6: Flex Builder 2........................................................................................... 13
Hình 7: Mơ hình nguồn – biên dịch – triển khai của ứng dụng Flex................16
Hình 8: Mối quan hệ giữa các thành phần giao diện và các lớp Flash Player. .29
Hình 9: Mơ hình use case......................................................................................76
Hình 10: Màn hình đăng nhập.............................................................................77
Hình 11: Màn hình đăng ký..................................................................................79
Hình 12: Màn hình quản lý...................................................................................81
Hình 13: Màn hình xem ảnh dạng thumbnail.....................................................86
Hình 14: Màn hình xem ảnh dạng carousel.........................................................87
Hình 15: Màn hình xem ảnh dạng list..................................................................88
Hình 16: Màn hình xem thơng tin ảnh.................................................................89
Hình 17: Màn hình tạo slideshow.........................................................................90
Hình 18: Mơ hình quan hệ....................................................................................93


TĨM TẮT KHĨA LUẬN
Nội dung khóa luận được chia làm 7 chương:
Chương 1: Tổng quan
Phân tích đánh giá các hướng nghiên cứu đã có liên quan đến đề tài.

Lí do chọn đề tài, mục đích, đối tượng và phạm vi nghiên cứu.
Chương 2: Tìm hiểu cơng nghệ Flex
Giới thiệu về cơng nghệ Flex.
Lí do vì sao chọn cơng nghệ Flex để triển khai ứng dụng cùng với những ưu
khuyết điểm của Flex.
Các kỹ thuật trong cơng nghệ Flex.
Chương 3: Tìm hiểu ngôn ngữ ActionScript
Giới thiệu về ngôn ngữ ActionScript.
Các thành phần cơ bản và kỹ thuật trong ActionScript.
Chương 4: Mô tả ứng dụng
Giới thiệu về ứng dụng.
Các yêu cầu trong ứng dụng.
Phân tích ứng dụng theo mơ hình UML (Unified Model Language).
Một số thành phần, đối tượng và kỹ thuật tiêu biểu sử dụng trong ứng dụng.
Chương 5: Tổng kết
Tổng kết những kết quả đạt được và mặt hạn chế của đề tài đồng thời đưa ra
hướng phát triển cho hệ thống sau này.
Chương 6: Danh mục tài liệu tham khảo
Chương 7: Phụ lục
Giới thiệu thêm một số thành phần và kỹ thuật trong ActionScript và Flex.


Chương 1. Tổng quan
Trong thời gian gần đây, hạ tầng CNTT phát triển với những băng thông kết nối
Internet rộng được triển khai đại trà dẫn đến nhu cầu sử dụng các ứng dụng trực
tuyến (RIA: Rich Internet Appliacation) gia tăng mạnh mẽ. RIA là những ứng dụng
triển khai trên nền Web, được thi hành trên các trình duyện Web nhưng có tính
năng và đặc điểm như các ứng dụng trên nền máy đơn thông thường (Desktop
Application). Những ưu điểm của các chương trình RIA là người dùng khơng cần
cài đặt chương trình, việc cập nhật chương trình dễ dàng, nhanh chóng, người dùng

có thể sử dụng chương trình từ bất kỳ một máy tính nào có kết nối Internet,vv…
RIA sẽ làm mờ ranh giới giữa các ứng dụng trên nền desktop và trực tuyến. Đây
được cho là tương lai của các ứng dụng trực tuyến. Để tạo RIA, các nhà phát triển
có thể sử dụng những giải pháp sauc:
Một là dùng DHTML (gồm HTML, CSS, Javascript) kết hợp với AJAX. Đây là
công cụ rất mạnh, tuy nhiên HTML không phải là một cơng cụ trình diễn, mà là một
chuẩn tài liệu. Javascript chưa đủ mạnh, và thiếu chặt chẽ. DHTML thường gặp vấn
đề về tương thích với các trình duyệt.
Giải pháp thứ hai là sử dụng công nghệ SilverLight
của Microsoft, một plug-in hoạt động trên đa nền
tảng, đa trình duyệt cho các chuyên gia phát triển
ứng dụng. Plug-in này có thể cho phép phát triển các
ứng dụng một cách phong phú gồm có media, khả
năng tương tác và hoạt ảnh. Silverlight plug-in có thể
làm việc trên các trình duyệt Internet Explorer và
Firefox trong Windows và Firefox cũng như trình
duyệt Safari trên hệ điều hành Mac.
Hình 1: Silverlight


Nhưng dường như công nghệ này chỉ đang trong giai đoạn phát triển, các tài liệu hỗ
trợ kĩ thuật cho công nghệ chưa thật sự đầy đủ, phong phú; công nghệ chưa hỗ trợ
hệ điều hành Linux và người sử dụng cần thêm thời gian để đánh giá và lựa chọn.
Giải pháp thứ ba là dùng Flash (công nghệ ảnh động vector của Adobe). Trước đây,
Flash được phát triển nhằm mục đích phục vụ xây dựng hoạt họa, quảng cáo hay
các thành phần trang trí của các trang Web. Sau nhiều thập kỷ thành cơng, tới nay
có tới 97% (theo Adobe Flex 2: Training from the Source) các chương trình duyệt
trang Web có cài đặt Flash. Các tập tin Flash, mang phần mở rộng là .swf và có thể
hiện thị bởi các chương trình duyệt trang Web hay chương trình Flash Player.
Nhưng Flash sinh ra không phải để làm ứng dụng: cơng cụ lập trình khơng chun

nghiệp, giao diện lập trình hạn chế, chi phí để viết ứng dụng rất lớn do thiếu các
thành phần giao diện, thư viện hỗ trợ…Để khắc phục những nhược điểm này,
Adobe đưa ra công nghệ Flex - một nền tảng công
nghệ, công cụ phát triển ứng dụng RIA chuyên
nghiệp. Với Flex, lập trình viên có thể kết hợp giữa
phương pháp thiết kế kéo - thả và phương pháp viết
mã lệnh, giúp xây dựng từng phần của ứng dụng một
cách thích hợp. Sản phẩm của Flex có thể được xuất
sang thành ứng dụng Desktop (AIR).
Hình 2: Flex
Flex hiện gồm 2 thành phần chính là MXML (Macromedia XML) và ActionScript
3.0 (xây dựng theo ECMAScript 4). ActionScript 3.0 giống Javascript, dễ học và có
thể lập trình hướng đối tượng. Flex có sự hậu thuẫn mạnh mẽ vì phát triển trên nền
tảng Flash nổi tiếng và được nhiều người sử dụng. Xây dựng các ứng dụng hướng
Flash Player, các nhà phát triển có thể tránh được các khơng tương thích về trình
duyệt và nền tảng. Những người dùng Flash nay chuyển lên Flex không cần phải
thay một nền tảng khác.
Hiện tại trên thế giới đã có nhiều hệ thống, Website sử dụng công nghệ Flex như
trang Web giới thiệu sản phẩm của Sony Ericsson, Yahoo Messenger (phiên bản


dành cho Web), www.pikeo.com, một Website chia sẻ hình ảnh và một vài Wesite
thơng dụng được thể hiện trong hình sau:

Hình 3: Những ứng dụng sử dụng cơng nghệ Flex
Với những ưu điểm của các ứng dụng RIA và những đặc tính ưu việt của cơng nghệ
Flex, chúng em đã quyết định thực hiện đề tài: “Tìm hiểu ngơn ngữ lập trình
trong Adobe Flash và xây dựng ứng dụng minh họa”. Trong đề tài này chúng em
tìm hiểu ngơn ngữ lập trình ActionScript 3.0 và cơng nghệ Flex; qua đó xây dựng
chương trình quản lý album ảnh và tạo slideshow hình ảnh trực tuyến.



Chương 2. FLEX
2.1. Giới thiệu
Flex là tập hợp các công nghệ cho phép ta nhanh chóng xây dựng ứng dụng để triển
khai cho Flash Player, là một môi trường thực thi chuyển giao những giao diện và
tương tác của người dùng. Làm địn bẩy cho Flex là những cơng nghệ và tiêu chuẩn
hoàn thiện như XML, dịch vụ web, HTTP, Flash Player và ActionScript. Flex cho
phép ta tạo ra những ứng dụng Internet hoàn thiện, biên soạn ứng dụng nhanh chóng
bằng việc tập hợp các thành phần, bao gồm các điều khiển giao diện, các khung
thiết kế, mơ hình dữ liệu và các thành phần giao tiếp dữ liệu. Hai phiên bản đầu là
Flex 1.0 và Flex 1.5 được Macromedia giới thiệu vào năm 2004 với giá thành rất
cao. Vào tháng 1 năm 2007, Adobe tạo một bước đột phá về vấn đề bản quyền khi
cung cấp SDK (Software Development Kit) của phiên bản Flex 2.0, gồm toàn bộ
thư viện các lớp hỗ trợ và bộ biên dịch bằng dòng lệnh miễn phí. Vào tháng 3 năm
2008, Adobe phát hành phiên bản Flex 3.0 hỗ trợ công nghệ Air. Chương 2 này xin
được giới thiệu một số kĩ thuật làm việc với Flex 2.0.

Hình 4: Flex SDK

2.1.1. Những cơng nghệ trong ứng dụng Flex
2.1.1.1. Flash Player
Flex là một phần của Adobe Flash Platform – một bộ công nghệ với Flash Player là
trung tâm. Flash Player chạy tất cả các ứng dụng Flex. Hầu hết các máy tính kết nối
Internet đều có cài đặt Flash Player và một số thiết bị di động có tích hợp Flash. Vì
vậy Flash Player là một phần mềm có mặt hầu hết mọi nơi.


Nội dung Flex 2 được thể hiện trọn vẹn trên Flash Player 9. Nghĩa là người dùng
phải chạy từ Flash Player 9 trở lên nếu muốn xem nội dung Flex 2 chính xác.

Sử dụng Flex framework ta có thể xây dựng và biên dịch sang định dạng tập tin
.swf. Tập tin .swf là định dạng mã nhị phân mà Flash Player có thể đọc.
Flash Player 9 giới thiệu máy ảo ActionScript AVM2 (ActionScript Virtual
Machine 2). AVM2 hoạt động khác với các phiên bản Flash Player trước. Với
AVM2, nội dung .swf được biên dịch và chạy tương tự như cách làm việc của các
ứng dụng trong Java và .NET

2.1.1.2. Flex Framework
Flex framework đồng nghĩa với một thư viện lớp của Flex và là một tập hợp các lớp
ActionScript được sử dụng bởi các ứng dụng Flex. Flex framework được viết hoàn
toàn bằng các lớp ActionScript, định nghĩa các điều khiển và quản lý thiết kế để xây
dựng một ứng dụng Internet.

Hình 5: Flex Framework
Flex framework bao gồm các mục sau:
Các điều khiển của form: Button, text input, text area, list, radio button, checkbox,
combo box, rich text editor, a color selector, a date selector, …
Các điều khiển menu: pop-up menu, menu bar
Các thành phần truyền thơng: Hỗ trợ âm thanh, hình ảnh, video.
Các khung thiết kế: Grid, form, box, canvase, …
Thành phần dữ liệu và kết buộc dữ liệu


Định dạng và chuẩn
hóa Quản lý con trỏ
Quản lý trạng thái
Các hiệu ứng
Quản lý kéo thả
Ghi chú (Tool tips)
Quản lý các kiểu định dạng


2.1.1.3. Flex Builder 2

Hình 6: Flex Builder 2
Flex Builder 2 là một môi trường phát triển ứng dụng (IDE - Integrated
Development Environment) dành cho việc xây dựng và tìm lỗi trong ứng dụng Flex.
Dựa trên Eclipse IDE, Flex Builder có những cơng cụ sẵn có để viết mã, sửa lỗi, và
xây dựng ứng dụng sử dụng công nghệ Flex như MXML và ActionScript.
Flex framework được tích hợp vào Flex Builder. Nhưng khơng có nghĩa muốn dùng
Flex framework thì ta phải dùng Flex Builder. Ta có thể cài đặt miễn phí Flex SDK.
Flex SDK gồm bộ biên dịch và Flex framework. Hoặc cũng có thể tích hợp Flex
framework với một IDE khác hoặc dùng công cụ soạn thảo để viết MXML và
ActionScript sao đó biên dịch nó bằng command line.
Flex Builder là một sản phẩm thương mại. Để biết thêm thơng tin có thể tham khảo
tại />
2.1.1.4. Dịch vụ dữ liệu – Data service
Data services là một bộ phận quan trọng của hầu hết các ứng dụng Flex. Nó là cách
mà ứng dụng Flex có thể tải và gửi dữ liệu từ cơ sở dữ liệu. Flash Player cung cấp


dữ liệu văn bản, định dạng truyền tin nhị phân - AMF (binary messaging format) và
những kết nối bảo đảm cho dữ liệu truyền từ server đến client trong thời gian thực.
Ứng dụng Flex yêu cầu dữ liệu XML từ tài nguyên tĩnh hoặc tài nguyên động như
trang PHP

2.1.1.5. Media Servers
Ứng dụng Flex sử dụng Flash Player để phát lại các đoạn Flash video hoặc các đoạn
nhạc MP3.

2.1.1.6. Các thành phần và thư viện khác cho Flex

Như là bộ Flex Charting Components (hỗ trợ lập biểu đồ).

2.1.2. Sử dụng những phần tử của Flex
2.1.2.1. MXML
MXML dựa trên nền tảng ngôn ngữ XML để mơ tả màn hình thiết kế. Nó tương đối
giống HTML. Sử dụng thẻ MXML , ta có thể thêm các thành phần như form, phát
lại media.
Ngoài ra, MXML cịn dùng để mơ tả các hiệu ứng, các giao tác, kiểu dữ liệu và sự
kết buộc dữ liệu.
Flex Builder cho phép ta xây dựng MXML với WYSIWYG. WYSIWYG cho phép
ta xây dựng một ứng dụng Flex cơ bản mà khơng cần viết một dịng mã nào.
MXML tạo khung và giao diện một cách nhanh chóng và hiệu quả. MXML được
dịch qua rất nhiều bước và bước đầu tiên là chuyển MXML thành lớp ActionScript.

2.1.2.2. ActionScript
ActionScript là ngôn ngữ lập trình trong Flash Player và là cơng cụ chủ yếu trong
các ứng dụng Flex. ActionScript có thể làm nhiều việc mà MXML khơng thể.
Mặc dù có thể xây dựng một ứng dựng dụng thuần MXML hoặc thuần ActionScript
nhưng thông thường và hợp lý hơn nếu ta xây dựng ứng dụng với cả MXML và
ActionScript. MXML đơn giản hóa việc thiết kế giao diện và thực hiện những tác


vụ cơ bản. ActionScript thích hợp cho sự tương tác với người dùng, các thao tác dữ
liệu phức tạp và các chức năng khơng có trong thư viện lớp của Flex.

2.1.3. Bảo mật của Flash Player
Tính bảo mật của Flash Player là bảo mật về dữ liệu. Các ứng dụng Flex chỉ có thể
truy xuất các nguồn dữ liệu trên cùng một domain. Nếu khác domain thì việc truy
xuất dữ liệu không được chấp nhận trừ khi được sự cho phép của domain đó thơng
qua file cross-domain policy. Đây là một file XML trên server tiếp nhận nguồn dữ

liệu. Định dạng của cross-domain policy file như sau:
<?xml version="1.0"?>
" /><cross-domain-policy>
<allow-access-from domain=”*.example.com" />
</cross-domain-policy>

2.1.4. Làm việc với dịch vụ dữ liệu - Data services
Các ứng dụng Flex có một tầng client chạy trên máy của người dùng bằng Flash
Player. Tầng client liên lạc với server để gửi và nhận dữ liệu. Các server cung cấp
các dịch vụ dữ liệu. Về bản chất, dịch vụ dữ liệu cung cấp các giao diện được định
nghĩa là public - public interfaces (APIs) nhờ đó mà client có thể đưa yêu cầu đến
phương thức của chương trình đó bằng những lời gọi hàm từ xa (remote procedure
call: RPC)
Có nhiều loại dịch vụ dữ liệu. Đơn giản nhất là tập tin văn bản hoặc tài liệu XML
tĩnh nhận từ web server. Phức tạp hơn là XML động được phát sinh qua server-side
script hoặc chương trình như là trang PHP hoặc ASPX. Một trong các dạng phức
tạp đó là dịch vụ web. Dịch vụ web dùng XML (thường là trong dạng SOAP –
Simple Object Access Protocol) như là định dạng truyền tin, và cho phép lời gọi
hàm từ xa (RPC) dùng giao thức HTTP để yêu cầu và phản hồi.


Flash Player có thể thực hiện RPCs đến nhiều loại dịch vụ dữ liệu. Lớp thư viện
Flex cũng có thể gửi yêu cầu đến hầu hết dịch vụ dữ liệu. Hơn nữa, ứng dụng Flex
cịn có thể gọi đến các phương thức của các lớp trên server bằng cách sử dụng kỹ
thuật Flash Remoting. Flash Remoting dùng định dạng truyền tin nhị phân AMF
được cung cấp bởi Flash Player. AMF có mọi lợi ích của SOAP, nhưng vì nó là nhị
phân nên băng thông được giảm đáng kể.

2.1.5. Sự khác biệt giữa ứng dụng HTML và ứng

dụng Flex Web
Cả ứng dụng HTML và Flex đều có n tầng. Ít nhất là 3 tầng
HTML

Flex

Tầng dữ liệu

Tầng dữ liệu

Tầng giao tiếp

Tầng giao tiếp

Tầng thể hiện

Tầng client

Tầng dữ liệu gồm cơ sở dữ liệu hoặc tài nguyên.
Tầng giao tiếp nhận yêu cầu từ tầng thể hiện hoặc client, truy vấn xuống tầng dữ
liệu và trả về dữ liệu được yêu cầu.
Tầng thể hiện bao gồm HTML, CSS, JavaScript, JSP, ASP, PHP …
Tầng client cho phép client offload q trình tính tốn từ server, ngầm giải phóng
tài nguyên mạng và đáp ứng tốt sự tương tác với giao diện người dùng.

2.1.6. Cách làm việc của ứng dụng Flex
Nguồn
ActionScript3

Biên dịch


ActionScript
+
Mã nhị phân AVM2
ActionScript được phát sinh

MXML
Tài nguyên (PNG, Gif,…)

Triển khai

+
Tài nguyên
Tài nguyên (PNG, Gif,…)

Hình 7: Mơ hình nguồn – biên dịch – triển khai của ứng dụng Flex


2.2. Làm việc với dữ liệu
2.2.1. Sử dụng mơ hình dữ liệu
Ta có thể dùng mơ hình dữ liệu để chứa dữ liệu nhận từ RPC – Remote Procedure
Call, hoặc chứa dữ liệu người dùng nhập vào trước khi gửi nó cho server.

2.2.1.1. Dùng thẻ <mx:Model>
Thẻ <mx:Model> cho phép ta tạo một đối tượng đại diện cho cấu trúc dữ liệu.
Trong thẻ này, cấu trúc dữ liệu chỉ được xây dựng bằng những thẻ XML.
Ví dụ:
<mx:Model id="userData">
<user>
<email></email>

123 555-1212</phone>
…
</user>
</mx:Model>
Thẻ này chỉ có một nút gốc. Do đó khi tham chiếu, ta khơng cần dùng nút gốc.
Ví dụ:
<mx:Button click="trace(userData.email)" />
Nếu dùng mơ hình dữ liệu để chứa dữ liệu tĩnh thì nạp dữ liệu từ file bằng thuộc
tính source của thẻ <mx:Model> sẽ tốt hơn là định nghĩa một cấu trúc và khởi tạo
đối tượng dữ liệu. Ví dụ như khi ta định nghĩa cấu một cấu trúc gồm 50 bang nước
Mỹ thì ta nên nạp dữ liệu từ file nếu khơng tài liệu MXML của ta sẽ rất dài và
không hợp lý.
Ví dụ:
<mx:Model id="statesModel" source="states.xml" />
Khi đó, dữ liệu sẽ được nạp vào lúc biên dịch. Tất cả dữ liệu sẽ được biên dịch
thành .swf


Khơng giống như nhưng thẻ khác, thẻ <mx:Model> khơng có lớp cùng tên bên
ActionScript, mà nó là thể hiện của lớp ObjectProxy. Mục đích chính của lớp này là
để kết buộc dữ liệu.

2.2.1.2. Dùng XML
Nếu làm việc với dữ liệu định dạng kiểu XML thì ta phải dùng thẻ <mx:Xml> mơ
hình cấu trúc dựa trên XML.
Ví dụ:
<mx:XML id="chaptersXml" xmlns="">
<chapters label="Chapters">
<chapter label="Chapter 1">
<file label="File 1.1" />

</chapter>
…
</chapters>
</mx:XML>
Thẻ XML có một namespace riêng nên Flex Builder thêm xmlns=”” để phân biệt
với namespace của những thẻ khác.
Cũng giống như thẻ <mx:Model>, thẻ này cũng chỉ có một nút gốc nên khi tham
chiếu ta bỏ qua nút gốc.
Ví dụ:
<mx:Button click="trace(chaptersXml.chapter[0].@label)" />

2.2.1.3. Dùng ActionScript
Hai thẻ <mx:Model> và <mx:XML> chỉ thích hợp với những dữ liệu tĩnh, khơng
thích hợp với dữ liệu phức tạp, dữ liệu động.
Ví dụ: Định nghĩa mơ hình dữ liệu cho người dùng
package com.oreilly.programmingflex.data {
public class User {
private var _nameFirst:String;
private var _nameLast:String;