Đăng ký Đăng nhập
Trang chủ Giáo dục - Đào tạo Cao đẳng - Đại học Sư phạm Nghiên cứu công nghệ flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho kh...

Tài liệu Nghiên cứu công nghệ flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa cntt trường đh tdm

.PDF
93
1
135

Mô tả:

TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT KHOA CÔNG NGHỆ THÔNG TIN BÁO CÁO TỔNG KẾT ĐỀ TÀI KHOA HỌC VÀ CÔNG NGHỆ CẤP TRƯỜNG NGHIÊN CỨU CÔNG NGHỆ FLEX, ỨNG DỤNG XÂY DỰNG PHẦN MỀM QUẢN LÝ TRẮC NGHIỆM CHO KHOA CNTT TRƯỜNG ĐH TDM Mã số: Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Bình Dương, 03/2013 TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT KHOA CÔNG NGHỆ THÔNG TIN BÁO CÁO TỔNG KẾT ĐỀ TÀI KHOA HỌC VÀ CÔNG NGHỆ CẤP TRƯỜNG NGHIÊN CỨU CÔNG NGHỆ FLEX, ỨNG DỤNG XÂY DỰNG PHẦN MỀM QUẢN LÝ TRẮC NGHIỆM CHO KHOA CNTT TRƯỜNG ĐH THỦ DẦU MỘT Mã số: Xác nhận của đơn vị chủ trì đề tài (chữ ký, họ và tên) ThS. Đinh Thị Thu Hương Bình Dương, 03/2013 Chủ nhiệm đề tài (chữ ký, họ và tên) KS. Bùi Sỹ Vương Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một MỤC LỤC DANH MỤC BẢNG BIỂU, HÌNH ẢNH ........................................................................... 4 1. Danh mục bảng biểu ........................................................................................................ 4 2. Danh mục hình ảnh .......................................................................................................... 4 Hình ảnh phần Phụ lục ........................................................................................................ 4 DANH MỤC CÁC CHỮ VIẾT TẮT ................................................................................. 5 THÔNG TIN KẾT QUẢ NGHIÊN CỨU .......................................................................... 6 MỞ ĐẦU ............................................................................................................................... 8 1. Tổng quan tình hình nghiên cứu thuộc lĩnh vực đề tài ................................................ 8 2. Mục tiêu của đề tài ........................................................................................................... 8 3. Cách tiếp cận và phương pháp nghiên cứu ................................................................... 9 4. Nội dung nghiên cứu ........................................................................................................ 9 CHƯƠNG 1: TỔNG QUAN VỀ FLEX, MXML, ACTIONSCRIPT ........................... 10 1.1. Tổng quan về Flex ....................................................................................................... 10 1.1.1. Sự ra đời của công nghệ Flex ..................................................................10 1.1.2. Công nghệ Flex ........................................................................................10 1.1.3. Đặc điểm của công nghệ Flex ..................................................................11 1.2. Tổng quan MXML ...................................................................................................... 12 1.2.1. Lịch sử XML............................................................................................12 1.2.2. Khái niệm chung về XML .......................................................................12 1.2.3. Sơ lược về MXML ...................................................................................13 1.2.4. Cấu trúc của một ứng dụng Flex ..............................................................14 1.3. ActionScript trong Flex .............................................................................................. 14 1.3.1. Phát sinh ActionScript .............................................................................15 1.3.2. Sử dụng ActionScript để xử lý sự kiện MXML ......................................16 1.3.3. Sử dụng các khối ActionScript trong file MXML ...................................17 1.3.4. Làm việc với các component Flex ...........................................................18 1.3.5. Include và import code ActionScript .......................................................20 1.3.6. Tạo các component ActionScript .............................................................20 1.3.7. Các sự kiện trong ứng dụng Flex .............................................................23 CHƯƠNG 2: GIAO DIỆN NGƯỜI DÙNG (USER INTERFACES) ........................... 32 2.1. Visual component (Thành phần trực quan) ............................................................. 32 2.2. Data Provider và Collections ..................................................................................... 36 2.2.1. Collections ...............................................................................................36 Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 1 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một 2.2.2. Data Provider Component .......................................................................37 2.2.3. Chỉ định data provider trong ứng dụng MXML ......................................37 2.2.4. Thiết lập data provider trong ActionScript ..............................................38 2.2.5. Các phương thức truy cập dữ liệu đơn giản .............................................39 2.3. Các control thường dùng ........................................................................................... 41 2.4. Container ..................................................................................................................... 42 2.5. Load một trang web từ ứng dụng Flex .................................................................... 42 2.5.1. Gửi biến khi gọi các trang web ................................................................43 2.5.2. Gọi JavaScript với navigateToURL ........................................................44 2.6. Gửi biến bên trong file SWF ...................................................................................... 45 2.6.1. Sử dụng tham số chuỗi truy vấn (querystring parameter) ......................45 2.6.2. Sử dụng flashVars ....................................................................................47 2.7. Tìm hiểu External API ............................................................................................... 48 2.7.1. Scripting the ExternalInterface class .......................................................49 2.7.2. Gọi hàm JavaScript bằng cách sử dụng ActionScript .............................50 2.7.3. Gọi hàm ActionScript với JavaScript ......................................................51 2.7.4. Hạn chế của External API ........................................................................51 CHƯƠNG 3: TRUY CẬP VÀ KẾT NỐI DỮ LIỆU....................................................... 53 3.1. Các component truy cập dữ liệu ................................................................................ 53 3.1.1. HTTPService component .........................................................................53 3.1.2. WebService component ...........................................................................54 3.1.3. RemoteObject component........................................................................55 3.2. Truy cập dữ liệu server-side bằng component HTTPService................................. 55 3.2.1. Tạo 1 HTTPService request .....................................................................59 3.2.2. Making the request...................................................................................60 3.2.3. Nhận phản hồi ..........................................................................................60 3.2.4. Xác định kiểu trả về .................................................................................60 3.2.5. Truy cập nội dung load ............................................................................62 3.2.6. Gửi các biến với request ..........................................................................62 3.2.7. Chỉ định phương thức request và định dạng ............................................63 3.2.8. Phương thức của lớp HTTPService .........................................................63 3.2.9. Event của lớp HTTPService ....................................................................64 3.3. Tìm hiểu lớp URLLoader ......................................................................................... 64 3.3.1. Tạo URLLoader request ..........................................................................64 Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 2 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một 3.3.2. Thực hiện request .....................................................................................64 3.3.3. Nhận Response ........................................................................................65 3.3.4. Xác định kiểu trả về ................................................................................65 3.3.5. Gửi biến cùng với request ........................................................................65 3.3.6. Xác định phương thức request .................................................................66 3.3.7. Các thuộc tính của lớp URLLoader .........................................................66 3.4. Biểu diễn dữ liệu (representing data) ........................................................................ 67 3.4.1. Liên kết dữ liệu (data binding) ................................................................68 3.4.2. Lưu trữ dữ liệu (data models) ..................................................................68 3.4.3. Định dạng dữ liệu (data formatting) ........................................................69 3.4.4. Kiểm tra tính hợp lệ của dữ liệu (data validation) ...................................70 CHƯƠNG 4: ỨNG DỤNG XÂY DỰNG WEBSITE PHẦN MỀM .............................. 72 4.1. Phân tích, thiết kế cơ sở dữ liệu ................................................................................. 72 4.1.1. Mô hình quan hệ giữa các thực thể ..........................................................72 4.1.2. Mô tả chi tiết về các thực thể ...................................................................72 1.2. Giao diện chức năng của phần mềm ......................................................................... 81 KẾT LUẬN VÀ KIẾN NGHỊ ........................................................................................... 83 1. Kết luận........................................................................................................................... 83 2. Kiến nghị và đề xuất ...................................................................................................... 83 TÀI LIỆU THAM KHẢO ................................................................................................. 84 PHỤ LỤC ........................................................................................................................... 85 Hướng dẫn sử dụng phần mềm ........................................................................................ 85 1. Giao diện đăng nhập ...................................................................................................... 85 2. Các module quản lý của phần mềm ............................................................................. 86 Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 3 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một DANH MỤC BẢNG BIỂU, HÌNH ẢNH 1. Danh mục bảng biểu Bảng 2.1: Mô tả cú pháp cấu hình các Component bằng MXML và ActionScript. Bảng 3.1: Tổng hợp các loại giá trị của thuộc tính ResultFormat. Bảng 3.2: Mô tả các phương thức của lớp HTTPService. Bảng 3.3: Mô tả các event của lớp HTTPService. Bảng 3.4: Mô tả các giá trị của thuộc tính dataFormat của lớp URLLoader. Bảng 3.5: Mô tả thuộc tính của lớp URLLoader. Bảng 4.1: Mô tả thực thể KHOA. Bảng 4.2: Mô tả thực thể BOMON. Bảng 4.3: Mô tả thực thể MONHOC. Bảng 4.4: Mô tả thực thể LOP. Bảng 4.5: Mô tả thực thể DSMH. Bảng 4.6: Mô tả thực thể GIANGVIEN. Bảng 4.7: Mô tả thực thể SINHVIEN. Bảng 4.8: Mô tả thực thể DSMONHOCLAI. Bảng 4.9: Mô tả thực thể NGANHANGCAUHOI. Bảng 4.10: Mô tả thực thể DETHI. Bảng 4.11: Mô tả thực thể PHONGTHI. Bảng 4.12: Mô tả thực thể DANHSACHTHI. 2. Danh mục hình ảnh Hình 3.1: Mô tả cơ chế hoạt động của HTTPService Component. Hình 3.2: Mô tả Databinding chuyển dữ liệu. Hình 3.3: Biểu đồ tạo ứng dụng Flex. Hình 4.1: Mô hình quan hệ giữa các thực thể Hình ảnh phần Phụ lục Hình 1: Giao diện đăng nhập vào phần mềm của Giảng viên. Hình 2: Giao diện đăng nhập vào phần mềm của Sinh viên. Hình 3: Module quản lý thông tin tài khoản. Hình 4: Module quản lý nghiệp vụ giảng dạy. Hình 5: Module quản lý ngân hàng câu hỏi. Hình 6: Thêm câu hỏi mới. Hình 7: Module quản lý giáo dục. Hình 8: Module quản lý đề thi. Hình 9: Tạo đề thi mới. Hình 10: Module thi trắc nghiệm trực tuyến. Hình 11: Tạo phòng thi cho sinh viên dự thi. Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 4 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một DANH MỤC CÁC CHỮ VIẾT TẮT RIA : Rich Internet Application HTML : HyperText Markup Language DHMTL : Dynamic HyperText Markup Language CSS : Cascading Style Sheets XML : eXtensible Markup Language MXML : Minimal XML SWF : Shockwave Flash SGML : Standard Generalized Markup Language DOM : Document Object Model URL : Uniform Resource Locator API : Application Programming Interface SDK : Software Development Kit IDE : Integrated Development Environment HTTP : Hypertext Tranfers Protocol Secure WSDL : Web Services Description Language CSDL : Cơ sở dữ liệu Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 5 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một THÔNG TIN KẾT QUẢ NGHIÊN CỨU 1. Thông tin chung: - Tên đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho Khoa Công nghệ Thông tin Trường ĐH Thủ Dầu Một - Mã số: - Chủ nhiệm: KS. Bùi Sỹ Vương - Đơn vị chủ trì: Khoa Công nghệ thông tin - Thời gian thực hiện: 12 tháng 2. Mục tiêu: - Nghiên cứu, tìm hiểu về công nghệ FLEX, xây dựng Website trắc nghiệm trực tuyến với giao diện đẹp, dễ sử dụng và có nhiều tính năng nổi bật. - Nghiên cứu phương pháp trắc nghiệm khách quan trong thi cử. - Xây dựng một phần mềm quản lý trắc nghiệm ứng dụng trên nền WEB dựa trên công nghệ FLEX đã nghiên cứu. Xây dựng hệ thống ngân hàng câu hỏi trắc nghiệm cho khoa Công nghệ thông tin. Qua đó, giảng viên có thể tạo các đề thi trắc nghiệm tự động từ ngân hàng câu hỏi đó tùy theo mức độ trong thang nhận thức của sinh viên trong quá trình giảng dạy như là mức độ khó dễ và sinh viên cũng có thể tự tạo đề trắc nghiệm để thi thử tùy theo mức độ khó, dễ, nhiều, ít mà người chọn muốn. - Nâng cao chất lượng kiểm tra đánh giá trong dạy – học và thi cử. - Ứng dụng công nghệ mới cho giảng viên – sinh viên làm quen. - Xây dựng một ngân hàng câu hỏi trắc nghiệm khách quan có chọn lọc từ phía giảng viên. 3. Tính mới và sáng tạo: - Công nghệ Flex là một công nghệ mới, được cải tiến dựa trên công nghệ Flash của Adobe. - Ứng dụng công nghệ Flex để xây dựng trang web cho phép người dùng thi trắc nghiệm trực tuyến, giúp tiết kiệm chi phí và thời gian cho người dùng. 4. Kết quả nghiên cứu: nghiên cứu công nghệ Flex. 5. Sản phẩm: Phần mềm thi trắc nghiệm trực tuyến tích hợp trên nền Web. 6. Hiệu quả, phương thức chuyển giao kết quả nghiên cứu và khả năng áp dụng: - Phần mềm có thể chạy ổn định trên tất cả các hệ điều hành hiện nay. - Có thể đưa vào sử dụng cho việc giảng dạy nhằm nâng cao chất lượng giảng dạy và nắm bắt công nghệ, đồng thời thúc đẩy nền giáo dục phát triển. Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 6 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một - Để sử dụng trực tuyến thì phần mềm cần có 1 máy chủ riêng và đường truyền tốt để đảm bảo tính ổn định trong quá trình thi cử. - Phần mềm sẽ được chuyển giao cho Khoa Công nghệ thông tin sử dụng thử. Ngày 08 tháng 03 năm 2013 Đơn vị chủ trì Chủ nhiệm đề tài (chữ ký, họ và tên) (chữ ký, họ và tên) ThS. Đinh Thị Thu Hương KS. Bùi Sỹ Vương Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 7 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một MỞ ĐẦU 1. Tổng quan tình hình nghiên cứu thuộc lĩnh vực đề tài Hiện nay, nền giáo dục Việt Nam đã và đang áp dụng phương pháp trắc nghiệm khách quan và tin học hóa cho cả nước. Vấn đề sử dụng internet để học tập, tìm kiếm thông tin cũng như trao đổi đã rất phổ biến so với những năm về trước. Có rất nhiều phần mềm hỗ trợ cho giảng viên và sinh viên trong việc học cũng như tạo đề thi trắc nghiệm trong quá trình kiểm tra đánh giá nhận thức của sinh viên. Và cũng có nhiều website cho phép sinh viên kiểm tra kiến thức trắc nghiệm của mình trên phương tiện internet tracnghiem.tuoitre.net.vn; (Ví dụ: một số website dayhoctructuyen.org;tracnghiem.com.vn; luyenthi.edu.vn; …). Nhưng hầu hết là dành cho bậc THCS và PTTH, còn dành cho đại học thì rất ít. Hơn nữa cũng chưa hoàn toàn đáp ứng được các yêu cầu mà phương pháp trắc nghiệm khách quan và người sử dụng yêu cầu (Ví dụ : các phần mềm đáp ứng được yêu cầu trắc nghiệm thì không có tiện ích trực tuyến, còn những phần mềm hỗ trợ trực tuyến thì không đáp ứng được yêu cầu của trắc nghiệm về mức độ khó dễ, ngân hàng đề thi …). Ngân hàng câu hỏi trắc nghiệm trên web hiện nay đa số là những đề thi đã có sẵn để tham khảo, không có chức năng quản lý và tạo đề thi tùy theo mức độ người dùng chọn. Một số phần mềm hiện nay: ▪ Phần mềm trắc nghiệm vi tính. ▪ Phần mềm trắc nghiệm EmpTest. ▪ Phần mềm trắc nghiệm Articulate Quizmaker,… Các phần mềm nêu trên chỉ chạy được trên mạng cục bộ và chưa cho phép thi trực tuyến. Không có chức năng tự động tính thời gian trong quá trình thi. Câu hỏi nhập vào chưa phân chia thành các mức độ khó/dễ,chưa phân chia theo chương, theo phần, chủ yếu là nhập thô. 2. Mục tiêu của đề tài Nghiên cứu, tìm hiểu về công nghệ FLEX, xây dựng Website trắc nghiệm trực Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 8 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một tuyến với giao diện đẹp, dễ sử dụng và có nhiều tính năng nổi bật. Xây dựng một phần mềm quản lý trắc nghiệm ứng dụng trên nền WEB dựa trên công nghệ FLEX đã nghiên cứu. Xây dựng hệ thống ngân hàng câu hỏi trắc nghiệm cho khoa Công nghệ thông tin. 3. Cách tiếp cận và phương pháp nghiên cứu Nghiên cứu công nghệ FLEX, nghiên cứu hình thức trắc nghiệm (các yêu cầu, mức độ đánh giá, thang điểm…) hiện nay. Tìm hiểu và nghiên cứu các phần mềm đã có và đang được sử dụng nhiều. Tham khảo ý kiến của các giáo viên, cán bộ chuyên môn để tìm hiểu các yêu cầu cần thiết cho phần mềm quản lý trắc nghiệm. Sử dụng kỹ thuật lập trình và thiết kế cơ sở dữ liệu để xây dựng phần mềm trắc nghiệm trực tuyến trên nền web áp dụng công nghệ Flex. 4. Nội dung nghiên cứu Tìm tài liệu, nghiên cứu về công nghệ FLEX, nghiên cứu hình thức trắc nghiệm khách quan. Nghiên cứu các phần mềm đã có, dựa trên các ưu - khuyết điểm đó để xây dựng một sản phẩm hoàn chỉnh hơn. Xây dựng phần mềm trắc nghiệm dựa trên công nghệ đã nghiên cứu. Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 9 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một CHƯƠNG 1: TỔNG QUAN VỀ FLEX, MXML, ACTIONSCRIPT 1.1. Tổng quan về Flex 1.1.1. Sự ra đời của công nghệ Flex Ngày nay, sự ra đời của web thế hệ mới (web 2.0) hình thành nhu cầu tạo các ứng dụng trên nền web gọi là RIA ( Rich Internet Application), hoạt động tương tự như ứng dụng desktop truyền thống. Để tạo RIA, có 2 giải pháp: ❖ DHTML (HTML, CSS, JavaScript) kết hợp với Ajax: Đây là công cụ mạnh nhưng HTML không phải là công cụ trình diễn, mà là một chuẩn tài liệu. Ngoài ra, JavaScript vẫn chưa đủ mạnh, thiếu chặt chẽ, sự tương thích với các trình duyệt còn hạn chế. ❖ Flash (công nghệ vector của Adobe): Ngày nay, công nghệ này đã được cải tiến rất nhiều, có thể làm ứng dụng RIA khá tốt. Nhưng Flash sinh ra không phải để viết ứng dụng, công cụ lập trình không chuyên nghiệp, giao diện lập trình còn hạn chế, chi phí viết ứng dụng lớn do thiếu thành phần giao diện và các thư viện hỗ trợ. Để khắc phục tình trạng này, Adobe cho ra đời 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, các lập trình viên có thể kết hợp phương pháp thiết kế kéo thả và phương pháp viết source code, giúp xây dựng từng phần của ứng dụng một cách thích hợp. Flex hiện có 2 thành phần chính: MXML và ActionScript 3.0 1.1.2. Công nghệ Flex Flex là một framework mã nguồn mở, miễn phí dùng để xây dựng các ứng dụng web có tính tương tác cao và được triển khai thống nhất trên tất cả các trình duyệt, các máy tính desktop và các hệ điều hành. Flex cung cấp một ngôn ngữ hiện đại dựa theo các quy tắc chuẩn và một mô hình lập trình hỗ trợ các mẫu thiết kế chung. Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 10 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một Các RIA được tạo ra bởi Flex có thể chạy trên các trình duyệt sử dụng phần mềm Adobe Flash Player hoặc sử dụng Adobe AIR bên ngoài trình duyệt. Sử dụng Framework mã nguồn mở Flex, các nhà lập trình có thể tạo ra các ứng dụng web trực quan và hấp dẫn cho phép khách hàng, đối tác và nhân viên diễn đạt thông tin một cách hiệu quả hơn. 1.1.3. Đặc điểm của công nghệ Flex Công nghệ Flex có những đặc điểm chính như sau: ❖ Các ứng dụng Flex cũng là các ứng dụng Flash: ➢ Flex là công nghệ để tạo ra các RIA dựa trên nền tảng Flash ➢ Các ứng dụng Flex sử dụng Flash Player 9 trở lên. ➢ Giống như tất cả các flash RIA, các file flex SWF được tiến hành trên client nhiều hơn trên server. ❖ Flex framework chứa các lớp thư viện được định nghĩa sẵn và các công cụ cần thiết để tạo ra các ứng dụng Flex. ➢ Flex framework có thể là một SDK free hoặc một IDE dựa trên nền Eclipse gọi là Flex Builder. ➢ Flex framework bao gồm cả trình biên dịch ➢ Các thư viện lớp và các ứng dụng dịch vụ cung cấp cho các nhà lập trình các component chuẩn và các công cụ để phát triển nhanh ứng dụng. ❖ Các ứng dụng Flex được viết bằng cách sử dụng MXML và ActionScript 3.0 ➢ MXML là một ngôn ngữ đánh dấu dựa trên XML, được sử dụng chủ yếu để hiển thị layout của các ứng dụng. ➢ ActionScript là một ngôn ngữ lập trình hướng đối tượng ECMAScriptcompliant được sử dụng chủ yếu trong các application logic. ➢ Code MXML và ActionScript được biên dịch thành file binary SWF. Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 11 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một 1.2. Tổng quan MXML 1.2.1. Lịch sử XML XML và HTML đều được phát triển từ SGML (Standard Generalized Markup Language) – ngôn ngữ đánh dấu tiêu chuẩn tổng quát, một ngôn ngữ biểu thị dữ liệu trong những ứng dụng xử lý văn bản đa dạng và có cấu trúc tinh vi. Tuy nhiên, SGML cũng tồn tại những nhược điểm là rắc rối, khó học và khó sử dụng. Vào năm 1990, Tim Berners – Lee đã tạo ra HTML, một phần nhỏ của SGML và rất dễ sử dụng. Tuy nhiên, vào sau đó một thời gian, người ta bắt đầu nhận thấy sự giới hạn của HTML. Vào năm 1996, Jon Bosak đã khởi động nhóm cộng tác W3C SGML, bấy giờ được gọi là nhóm XML. Mục đích là đơn giản hóa SGML để nó dễ dùng như HTML, đồng thời cũng mạnh mẽ hơn. Bản specification đầu tiên của XML ra đời vào tháng 11 năm 1996. Tháng 7 năm 1997, Microsoft làn đầu tiên áp dụng XML. Tháng 1 năm 1998, Microsoft cho ra đời một chương trình miễn phí MSXSL để generate một trang HTML từ cặp trang XML và XSL. Tháng 2 năm 1998, W3C phê chuẩn cho chính thức thi hành version 1.0 của XML Specification. 1.2.2. Khái niệm chung về XML XML là viết tắt của chữ eXtensible Markup Language (ngôn ngữ nâng cấp có thể mở rộng) là một bộ quy luật về cách chia tài liệu ra làm nhiều phần, rối đánh đáu và ráp các phần khác nhau lại để dễ nhận biết chúng. Khác với HTML, XML cho phép người dùng có thể tự do đặt tên các thẻ khi cần. Do đó, XML không giới hạn về con số các thẻ và người dùng cũng không cần phải nhớ bất của thẻ nào. Mỗi trang XML đều bắt đầu bằng một lệnh xử lý XML (XML processing instruction). Nó được đặt trong cặp thẻ Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 12 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một Mỗi trang XML cần phải theo một số quy luật để được xem là “well formed”. Các quy luật mà một trang XML cần phải tuân thủ: 1. Trang XML phải được bắt đầu bằng câu tuyên bố XML (XML declaration) 2. Mỗi bộ phận (element) phải nằm trong một thẻ (tag) 3. Nếu thẻ không chứa gì ở giữa thì phải chấm dứt bằng “/>” 4. Một trang XML phải có một element duy nhất chứa tất cả các element khác (root element) 5. Các thẻ tag không được xen kẽ nhau. 1.2.3. Sơ lược về MXML MXML là ngôn ngữ đánh dấu XML được dùng để bố trí các thành phần giao diện người dùng trong ứng dụng Flex. MXML còn được dùng để khai báo việc truy cập dữ liệu trên server và truyền dữ liệu giữa các thành phần giao diện người dùng và nguồn dữ liệu trên server. Giống như HTML, MXML cung cấp các thẻ để định nghĩa giao diện người dùng. Cách làm việc của MXML tương tự như HTML. Một ứng dụng đơn giản sử dụng MXML: Flex được xem như là thư viện các lớp ActionScript. Thư viện lớp này chứa các component, các thư viện quản lý, các lớp data-service và các lớp cho các chức năng khác. Các thẻ MXML tương ứng với các lớp ActionScript hoặc các thuộc tính của lớp. Flex sẽ phân tích các thẻ MXML và biên dịch thành một file SWF chứa các đối tượng ActionScript tương ứng. 1.2.4. Cấu trúc của một ứng dụng Flex Cấu trúc của một ứng dụng Flex có thể được viết trong một file hoặc nhiều file. Với cấu trúc nhiều file, file chính là file chứa thẻ . Từ file chính, người lập trình có thể tham chiếu đến các file khác được viết bằng MXML, ActionScript hoặc kết hợp cả 2 ngôn ngữ. 1.3. ActionScript trong Flex Các nhà phát triển Flex sử dụng ActionScript để cài đặt các hành vi bên trong ứng dụng Flex. Đầu tiên là sử dụng các thẻ MXML để khai báo các container, control, các hiệu ứng, định dạng và các dịch vụ web mà ứng dụng yêu cầu, đồng thời để bố trí giao diện người dùng. Sau đó, các nhà lập trình sẽ sử dụng ngôn ngữ ActionScript để lập trình các sự kiện cho các component và ứng dụng. Nói một cách tổng quát, MXML cài đặt các trạng thái tĩnh cho ứng dụng, còn ActionScript sẽ cài đặt các trạng thái động cho ứng dụng Flex. ActionScript là một ngôn ngữ lập trình thủ tục hướng đối tượng, dựa trên ECMAScript. Người lập trình có thể ứng dụng nhiều phương pháp để kết hợp ActionScript và MXML: • Sử dụng ActionScript để định nghĩa các sự kiện bên trong các thuộc tính sự kiện của MXML. Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 14 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một • Đặt bên trong thẻ . • Include file ActionScript bên ngoài. • Import các lớp ActionScript. • Tạo các ActionScript component. 1.3.1. Phát sinh ActionScript Khi một file MXML được biên dịch, trình biên dịch sẽ tạo ra một lớp và phát sinh ActionScript để lớp đó sử dụng. Một ứng dụng MXML sẽ định nghĩa các subclass của lớp Application, tương tự, một component MXML sẽ định nghĩa các subclass của component đó. Tên của subclass là tên của file. Lớp cơ sở là lớp của thẻ lớn nhất. Một ứng dụng MXML sẽ định nghĩa : class MyApp extends Application Nếu file myButton.mxml bắt đầu với thẻ , lớp MyButton sẽ được định nghĩa: class MyButton extends Button Các biến và phương thức được khai báo trong khối định nghĩa các thuộc tính và phương thức của subclass. Khi thiết lập thuộc tính id cho các component, người lập trình có thể tham chiếu đến các component khác có chung thuộc tính id Các thuộc tính sự kiện sẽ trở thành các phương thức được phát sinh tự động trong lớp con. Tất cả các đoạn mã ActionScript trong file MXML thực thi với từ khóa this đều tham chiếu đến các instance của subclass. Các component khác có thể truy cập các thuộc tính và phương thức public của một component bất kì. Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 15 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một 1.3.2. Sử dụng ActionScript để xử lý sự kiện MXML Người lập trình có thể dùng ActionScript bằng cách đưa code ActionScript vào bên trong thẻ MXML để xử lý sự kiện, như ví dụ sau: Khi đó, trình biên dịch sẽ lấy thuộc tính click=”…” và phát sinh ra phương thức xử lý sự kiện như sau: public function __myButton_click(event:MouseEvent):void { textarea1.text='Hello World'; } Khi người dùng nhấn nút click, đoạn code này sẽ thiết lập giá trị text cho điều khiển TextArea là chuỗi “Hello World”. Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 16 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một Để có thể xem được code phát sinh, người lập trình phải thiết lập giá trị tùy chọn keep-generated-actionscript là true. Sau đó, trình biên dịch sẽ lưu trữ file *.as trong thư mục generated, là thư mục con của thư mục chứa file SWF. 1.3.3. Sử dụng các khối ActionScript trong file MXML Nhà lập trình có thể chèn một khối ActionScript vào trong file MXML bằng cách đặt chúng bên trong thẻ . Khối ActionScript này có thể chứa các hàm và các biến ActionScript được dùng trong ứng dụng MXML. Ngoài ra, chúng còn có thể chứa các hằng, các namespace, các khai báo include file ActionScript… Thẻ phải nằm bên trong thẻ lớn nhất của file ứng dụng MXML. Việc ghi chú chỉ được cho phép khi chúng nằm trong một hàm. Không thể định nghĩa một lớp hoặc giao diện mới bên trong khối . Thay vào đó, người lập trình phải đặt chúng trong file AS riêng và import chúng. Hầu hết các lệnh phải được đặt bên trong các hàm nằm trong khối . Tuy nhiên, một số lệnh có thể nằm bên ngoài các hàm như: • import • const • var • namespace • include • use namespace Nội dung bên trong khối thường được bao bên trong cấu trúc CDATA. Điều này sẽ ngăn chặn trình biên dịch hiếu đoạn code ActionScript như XML, cho phép code ActionScript được biên dịch chính xác. Cấu trúc thẻ được Adobe khuyến nghị: Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 17 Báo cáo tổng kết đề tài: Nghiên cứu công nghệ Flex, ứng dụng xây dựng phần mềm quản lý trắc nghiệm cho khoa Công nghệ thông tin Trường ĐHThủ Dầu Một 1.3.4. Làm việc với các component Flex Action Script trong Flex được sử dụng chủ yếu để làm việc với các visual control các visual container. 1.3.4.1. Tham chiếu đến các component Để các componet Flex có thể làm việc với ActionScript, các component này phải được thiết lập thuộc tính id Khi đó, trình biên dịch sẽ tự động phát sinh biến public có tên là myButton tham chiếu đến thực thể Button. Biến tự động phát sinh này cho phép truy cập đến các thực thể component bằng ActionScript. Khi đó, người dùng có thể thay đổi các thuộc tính và gọi đến các phương thức của các component thông qua thuộc tính id của chúng. Mỗi component sẽ được thiết lập một giá trị thuộc tính id duy nhất. Do đó, người lập trình có thể truy cập đến một component tại bất kỳ đâu trên ứng dụng. Người lập trình cũng có thể tham chiếu đến các component không có thuộc tính id bằng cách sử dụng các phương thức cúa khung chứa component như getChildAt() hay getChildByName() Từ khóa this dùng để tham chiếu đến các đối tượng hiện tại. 1.3.4.2. Tạo các visual component Flex trong ActionScript Người lập trình có thể tạo các visual component Flex bằng cách sử dụng toán tử new, giống như cách tạo các thực thể của các lớp ActionScript. Các component được tạo ra có các giá trị thuộc tính mặc định. Sau khi các component được tạo ra, người lập trình sẽ thiết lập giá trị các thuộc tính cho các component này. Sau cùng, các component mới sẽ được thêm vào các container bằng cách sử dụng các phương thức của container như addChild() or addChildAt() Khi tạo các visual control, người lập trình sẽ phải import các package thích hợp. Trong nhiều trường hợp, người lập trình sẽ import package mx:controls Đoạn code sau sẽ tạo ra control button trong Hbox: Chủ nhiệm đề tài: KS. Bùi Sỹ Vương Trang 18
- Xem thêm -

Tài liệu liên quan

Tài liệu vừa đăng