Nghiên cứu và phát triển ứng dụng tra cứu trao đổi thông tin tổng hợp cho sinh viên hàng hải trên nền tảng di động

Nghiên cứu và phát triển ứng dụng tra cứu trao đổi thông tin tổng hợp cho sinh viên hàng hải trên nền tảng di động

GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp Mục lục Lời mở đầu Chương 1: Giới thiệu đề tài Mục tiêu: .9 Chương 2: Giới thiệu công cụ cài đặt 10 2.1: Ttìm hiểu Nnative Aapplication, Mmobile Aapplication, Hhybrid Aapplication 10 2.11.1:Native Application : 10 Điểm mạnh yếu Native application: 10 Điểm mạnh 10 Điểm yếu .11 2.21.2: Mobile Applicationn 12 Điểm mạnh yếu Mobile web application 12 Điểm mạnh: 12 Điểm yếu .13 2.31.3: Hybrid .13 2.42 Lập trình PphoneGgap .18 2.1.khái niệm: .18 i.PhoneGap trở thành người bạn tốt bạn bạn: 19 PhoneGap làm việc nào? 19 2.2: Giới thiệu tổng quan API PhoneGap : .21 Điểm khó khăn sử dụng PhoneGap: .23 2.3: Những ưu nhược điểm PhoneGap 23 ưƯuu điểm: 23 2.4: Cài đặt phonegap 25 Chương Pphân tích thiết kế hệ thống 39 3.13.1 Ssơ đồ phân rã chức 39 3.33.2: Sơ đồ mức ngữ cảnh: .41 Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp 3.4 3.3:Sơ đồ mức đỉnh 43 3.53.4: Ssơ đồ mức đỉnh hệ thống .47 3.63.5: Ssơ đồ mức đỉnh tra cứu thông tin 49 3.73.6: Ssơ đồ mức đỉnh trao đổi thông tin 51 51 3.83.6: Ssơ đồ mức đỉnh tìm kiếm 52 Danh mục hình ảnh Tài liệu tham khảo: Hình 1: Ssinh viên tra cứu sinh viên khác mà quan tâm webdsite Hình 2: Sự phát triển điện thoại di động Hình 3: Ứng dụng di động Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp Hình 4: Các môi trường di động 10 Hình 54: Sơ đồ so sánh 16 Hình 65: Bảng so sánh .17 Hình 86 .18 : Hoạt động PhoneGap 18 Hhình 97: So sánh 18 Hình 108: Ứng dụng chạy tảng khác 19 Hình 11: Ngôn ngữ sử dụng 19 Hình 120: Kiến trúc PhoneGap 20 Hhình 13: Sơ đồ ứng dụng PhoneGap1 21 Hình 142: Giới thiệu tổng quan PhoneGap 21 Hình 153: Cách tạo Android Project Eclipse IDE 26 Hình 16Hình 14: Cách thiết lập thông số để tạo Android Project 28 Hình175: Chỉnh sửa để chạy PhoneGap .30 Hình 186 : Ccách chỉnh sửa bên file java 31 Hình 19: Code chèn để chạy PhoneGap 35 Hình 201: Chạy chương trình tảng Android7 37 Hình2118: Hình chạy chương trình Android Emulator .38 Hình 2219: Sơ đồ phân rã chức 40 Hình 230: Sơ đồ mức ngữ cảnh 42 Hình 241: Sơ đồ mức đỉnh 45 Hình 25: Sơ đồ mức đỉnh hệ thống .48 Hình 263: Sơ đồ mức đỉnh tra cứu thông tin 50 Hhình 274: Sơ đồ mức đỉnh trao đổi thông tin 51 Hình 285: Sơ đồ đỉnh tìm kiếm 52 Tài liệu tham khảo: - Trang wed học trực tuyến:http://www.w3schools.com/ -Tài liệu phonegap cho người học Ngô Quang Trung Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp http://www.slideshare.net/myloveforyounqt/phonegap-cho-nguoi-moi-hoc “lập trình hướng đối tượng javascript kiểu mẫu thiết kế”: http://www.slideshare.net/myloveforyounqt/lap-trinh-huong-doi-tuong-trongjavascript-va-cac-kieu-mau-thiet-ke?related=1 Tìm hiểu mã nguồn mở phonegap xây dựng ứng dụng: http://www.slideshare.net/myloveforyounqt/tim-hieu-ma-nguon-mophonegap-va-xay-dung-ung-dung?related=3 Hình ảnh Hình Hình Hình Hình Hình Hình Hình Hình Hình Hình 10 Hình 11 Hình 12 Hình 13 Hình 14 Hình 15 Hình 16 Hình 17 Hình 18 Hình 19 Hình 20 Hình 21 Hình 22 Hình 23 Hình 24 trang 6 12 13 14 14 14 15 15 16 16 21 22 23 23 28 29 32 33 34 35 36 37 Lời mở đầu Điện thoại thông minh hay gọi smartphone thực mang đến cách mạng cho thiết bị di động, thời kì mà công nghệ số phát triển với tốc độ chóng mặt Nhu cầu sử dụng thiết bị di Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp động trở nên phổ biến không Việt Nam mà toàn giới Sự tiến vượt bậc công nghệ làm thay đổi hoàn toàn thói quen hành vi người Trong tương lai, thiết bị di động trở thành phương tiện giao tiếp làm việc chủ yếu người Và phần cốt lõi để tạo sức hấp dẫn từ smartphone hệ điều hành ứng dụng mà chúng chạy Hiện tại, ứng dụng dành cho thiết bị di động bị phân mảnh lớn hãng công nghệ lớn cạnh tranh, ganh đua tạo tảng hệ điều hành di động riêng Do PhoneGgap đời với mục đích “viết lần, biên dịch qua cloud chạy khắp nơi – tương thích với hầu hết tảng hệ điều hành di động tại”, nhận đóng góp nhiều tổ chức cộng đồng công nghệ lớn PhoneGgap giúp giảm nhẹ gánh nặng - cần phải nắm bắt hiểu rõ công nghệ bên tảng – nhà lập trình việc tạo ứng dụng chạy đa tảng di động Giờ đây, với hỗ trợ đắc lực PhoneGgap, nhà lập trình cần nắm bắt chuyên sâu công nghệ Đề tài “nghiên cứu phát triến ứng dụng tra cứu trao đổi thông tin tổng hợp cho sinh viên Hàng Hải tảng di động” giúp cho sinh viên có cách vào mạng khác thông qua máy tính Chương 1: Giới thiệu đề tài Trong năm gần đây, mạng Internet trở thành tảng chi trao đổi thông tin toàn cầu Có thể thấy cách rõ ràng Internet Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp tác động lên nhiều mặt đời sống từ việc tìm kiếm thông tin, trao đổi liệu đến việc hoạt động thương mại, học tập nghiên cứu lam việc trực tuyến… Nhờ Internet mà việc trao đổi thông tin ngày tiện lợi, nhanh chóng hơn, khái niệm thư điện tử (email) không xa lạ với người Điện thoại thông minh hay gọi smartphone thực mang đến cách mạng cho thiết bị di động, thời kì mà công nghệ số phát triển với tốc độ chóng mặt Nhu cầu sử dụng thiết bị di động trở nên phổ biến không Việt Nam mà toàn giới Việc tra cứu thông tin di động ngày phổ biến Đối với sinh viên Hàng Hải việc tra cứu thông tin trang wed: www.vimaru.edu.vn Hình 1: Ssinh viên tra cứu sinh viên khác mà quan tâm webdsite Sinh viên tra cứu văn biểu mẫu cần thiết giúp sinh viên nắm bắt thông tin như: học bổng, điều kiện xét tốt nghiệp, học phí, khoa, phòng ban, thông tin tuyển sinh trường năm năm tới, đề tài nghiên cứu khoa học Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp Những bạn sinh viên nhà có điều kiện mua máy tinh vào mạng thường xuyên nhanh chóng có thông tin webdsite Những sinh viên chưa có máy tính phải quán nét có thông tin cần thiết Máạy tính mang theo bên suốt ngày Những thông tin khẩn cấp, lúc máy tính bên cạnh, sinh viên cập nhật dược thông tin nhanh chóng Những lúc có cố mạng, sinh viên tra cứu phương tiện Những lúc có cố máy tính, sinh viên tra cứu điện thoại kết nối internet sinh viên vào mạng qua phương tiện kết nối internet cả.Những sinh viên quê điều kiện vào mạng internet xem thông tin wedsite trường.Ngooàai việc tra cứu internet sinh viên hỏi thông tin qua cán lớp việc học, sinh hoạt đầu tuần, học phí, văn liêen quan.Với điện thoại di động thông minh có kết nối internet,bạn tìm thông tin cần thiết Trong năm gần điện thoại thông minh phát triển vượt bậc.trong năm Hình 2: Sự phát triển điện thoại di động Và ứng dụng di động Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp Hình 3: Ứng dụng di động Với đề tài “ Nnghiên cứu phát triển ứng dụng tra cứu thông tin cho sinh viên tảng di động” giúp sinh viên đâu vào mạng lây thông tin qua ứng dụng Khi chưa có ứng dụng di động sinh viên thường dùng điện thoại kết nối vào ứng dụng facebook, googlechome điện thoại di động Mục tiêu: Xây dựng ứng dụng di động cho phép sinh viên tra cứu, tìm kiếm nhận thông tin xác kịp thời từ nhà trường Các thông tin bao gồm (tin tức từ nhà trường, thông báo, lịch học, lịch thi, văn biểu mẫu dành cho sinh viên, hướng dẫn cho sinh viên công tác đào tạo, công tác sinh viên, tra cứu kết học tập, ….) Có khả cài đặt đa tảng (Windows Phone, IOS, Android ) Toàn thông tin lấy thông qua dịch vụ Webservice site nhà trường cung cấp lấy thông tin qua RSS XML… Nhiệm vụ nghiên cứu • Tìm hiểu hệ điều hành di động • Tthu thập tìm hiểu ,cách lập trình phonegap • Tìm hiểu lập trình html, css, javaScript • scritp • Phân tích thiết kế hệ thống Phương thức nghiên cứu Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp • Tìm hiểu html5, css, javaScriptscritp • Đọc tài liệu lập trình ứng dụng phonegap • - Tham gia thảo luận, hỏi đáp diễn đàn chuyên môn, tham khảo code ví dụ, hướng dẫn mạng Internet thuật toán, cách xử lý vấn đề gặp phải Do lĩnh vực đề tài tương đối rộng, thân kiến thức có nhiều hạn chế nên đồ án không tránh khỏi nhiều sai sót Em mong góp ý bảo thầy cô bạn sinh viên để nội dung đồ án hoàn thiện phong phú Một lần nữa, em xin chân thành cảm ơn thầy cô giáo khoa Công Nghệ Thông Tin, đặc biệt thầy giáo Đinh Đức Thiện tận tình giúp đỡ, bảo giúp em hoàn thành đồ án Sinh viên: Lê Thanh Tùng Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp Chương 2: Giới thiệu công cụ cài đặt 1: Ttìm hiểu Nnative Aapplication, Mmobile Aapplication, Hhybrid Aapplication 2.11.1:Native Application : Mmột ứng dụng thiết kế đặc biệt chạy hệ điều hành thiết bị thường phải điều chỉnh để chạy thiết bị khác • Được phát triển dành riêng cho tảng cụ thể • Được phát hành thông qua kho ứng dụng • Được xây dựng dược công nghệ môi trường phát triển dành riêng Hình 4: Các môi trường di động Điểm mạnh yếu Native application: Điểm mạnh • Về mặt lợi nhuận quy thành tiền, native app dễ dàng thu phí an toàn với phương thức tóan iTunes Google Checkout, dễ dàng Sinh viên: Lê Thanh Tùng 10 Lớp CNT51DH1 - Nên refresh (F5) trước run để Eclipse update thông tin - Bấm chuột phải vào tên project vào chọn Run As > Android Application - Nếu thiếtiêdt lập đúng, chương trình chạy hoàn chỉnh sau: Hình2118: Hình chạy chương trình Android Emulator Chương Pphân tích thiết kế hệ thống Ứng dụng đặt tên ViMARU, có chức tra cứu thông tin để tìm kiếm trang thông tin cá nhân,trang thông tin trường,trang trao đổi thông tin sinh viên với nhau.Giúp sinh viên có thê tra cứu, trao đổi kịp thời thông tin Ứng dụng phát triển dựa Phonegap framework phiên 2.2.0, sử dụng số plugin cho Phonegap SQLitePlugin, WebIntent, Base64ToPNG, Facebook Connect Plugin Giao diện người dùng ứng dụng xây dựng dựa jQuery Mobile phiên 1.2.0 3.1 3.2 3.1 Ssơ đồ phân rã chức 39 Hình 2219: Sơ đồ phân rã chức 40 3.33.2: Sơ đồ mức ngữ cảnh: 41 Hình 230: Sơ đồ mức ngữ cảnh 42 3.4 3.3:Sơ đồ mức đỉnh 43 44 Hình 241: Sơ đồ mức đỉnh 45 46 3.5 3.4: Ssơ đồ mức đỉnh hệ thống 47 Hình 25: Sơ đồ mức đỉnh hệ thống 48 3.6 3.5: Ssơ đồ mức đỉnh tra cứu thông tin 49 Trong đó: 1; Ttìm thông tin trường 2:Ttìm thông tin cá nhân 3: Ddữ liệu web dservicever Hình 263: Sơ đồ mức đỉnh tra cứu thông tin 50 3.7 3.6: Ssơ đồ mức đỉnh trao đổi thông tin Hhình 274: Sơ đồ mức đỉnh trao đổi thông tin 51 3.8 3.6: Ssơ đồ mức đỉnh tìm kiếm Hình 285: Sơ đồ đỉnh tìm kiếm 52 [...]... khi xây dựng một ứng dụng bằng PhoneGap viết cho iPhone, thì khi biên dịch cho các nền tảng khác như Android, Windows Phone,… cũng cần phải có những tinh chỉnh thích hợp để ứng dụng đó có thể chạy hoàn toàn tính năng Cũng như việc phát triển ứng dụng thông thường, thì ứng dụng sử dụng PhoneGap cũng cần phải quan tâm đến môi trường phát triển trên các nền tảng riêng biệt Khó hoạt động trên các mobile... đội ngũ phát triển ổn định Phiên bản hiện tại PhoneGap 2.7.0 vừa được phát hành, cho phép nhà phát triển sử dụng HTML, CSS và JavaSript để viết và triển khai ứng dụng Hình 86 : Hoạt động trong PhoneGap Phát triển ứng dụng truyền thống sẽ giống như thế này: Hhình 97: So sánh Nếu bạn muốn phát triển ứng dụng trên nhiều nền tảng khác nhau như iOS, Android, Symbian, Windows, BlackBerry ???? Sinh viên: Lê... không thích hợp Một ứng dụng hybrid là một trong đó được viết với cùng một công nghệ được sử dụng cho các trang web và triển khai web di động, và được lưu trữ hoặc chạy bên trong một container có nguồn gốc trên một thiết bị di động Đây là cuộc hôn nhân của công nghệ web và thực hiện bản địa Sinh viên: Lê Thanh Tùng 13 Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp Ứng dụng hybrid sử dụng một... WebKit (cho bạn Windows 8 folks, đây là những gì động cơ IE10 không cho các ứng dụng phong cách Metro sử dụng WinJS) và hiển thị cho người sử dụng một toàn màn hình điều khiển xem web, không phải trong một trình duyệt Không còn là bạn buộc phải sử dụng HTML và JavaScript chỉ trong trình duyệt triển khai thực hiện trên các thiết bị di động Các ứng dụng lai là việc thực hiện một lớp trừu tượng đó cho thấy... 108: Ứng dụng chạy trên các nền tảng khác nhau i PhoneGap có thể trở thành người bạn tốt nhất của bạn nếu bạn: • Bạn muốn phát triển một ứng trên nhiều nền tảng khác nhau • Bạn biết về HTML, Javascript, CSS • Bạn thực sự có một web site, một ứng dụng web Do đó bạn có thể sử dụng lại một phần củ ứng dụng này Hình 9 Hình 11: Ngôn ngữ sử dụng PhoneGap làm việc như thế nào? Kiến trúc PhoneGap: Sinh viên: ... PhoneGap là một nền tảng mã nguồn mở dùng để phát triển ứng dụng mobile cho cả iOS, Android, Windows Phone, BlackBerry, webOS, Bada, Symbian cùng lúc, viết một lần, biên dịch qua cloud và chạy trên nhiều nền tảng smartphone khác nhau Đây là một dự án nguồn mở miễn phí của Nitobi giúp việc phát triển ứng dụng di động dễ dàng hơn đối với mọi hệ điều hành, hiện đã có 40.000 lượt tải về mỗi tháng, tổng cộng... Không có Có Có địa Phát hành qua kho ứng dụng Khả năng mở rộng Hình 65: Bảng so sánh Vậy em chọn hybrib app là ngôn ngữ phát triển trên mobile Ứng dụng lai được xây dựng với công nghệ web có nghĩa là có hàng triệu nhà phát triển web, những người đã có kỹ năng thiết lập cơ sở để xây dựng các ứng Sinh viên: Lê Thanh Tùng 17 Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp dụng di động 2.42 Lập trình... thiết lập cơ sở để xây dựng các ứng dụng di động Hình 54: Sơ đồ so sánh Sinh viên: Lê Thanh Tùng 16 Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp Bảng so sánh giữa Web Hybrid Native Chi phí phát triển Hợp lý Hợp lý Tốn kém Thời gian phát Ngắn Ngắn Dài Cao Cao Không có Nhanh Có tấc độ xử lý giống Rất nhanh triển Tính khả chuyển của ứng dụng Hiệu năng xử lý ứng dụng bản địa nếu cần Các tính... Thầy Đinh Đức Thiện Báo cáo tốt nghiệp trên một môi trường duy nhất như: dùng xcode trên Mac OS (nếu bạn muốn phát triển ứng dụng cho iOS) • Hơn nữa, việc bảo trì hay nâng cấp sẽ làm mất nhiều thời gian Do phải sửa chữa từng app trên từng HDH, thủ tục đưa lên chợ ứng dụng và chờ đợi approval (đôi khi bị reject vì vi phạm một số điều lệ của nhà phát triển chợ ứng dụng) , nên bản cập nhật không đến tay... API JavaScript với các API nền tảng cụ thể Điều này thực sự có nghĩa là, ví dụ nếu tôi xây dựng một ứng dụng điện Sinh viên: Lê Thanh Tùng 14 Lớp CNT51DH1 GVHD: Thầy Đinh Đức Thiện Báo cáo tốt nghiệp thoại di động với Apache Cordova, tôi có thể sử dụng JavaScript để truy cập vào một API bản địa, như máy ảnh, sử dụng một cuộc gọi API duy nhất bất kể nền tảng ứng dụng sẽ chạy trên 01.navigator.camera.getPicture