Link tải luận văn miễn phí cho ae Kết Nối
MỤC LỤC........................................................................................................................................ 4
PHẦN 0: MỤC ĐÍCH ĐỀ TÀI....................................................................................................... 9
PHẦN 1: TÌM HIỂU IONIC ANGULAR................................................................................... 10
CHƯƠNG 1: TỔNG QUAN IONIC............................................................................................ 10
1. Tổng quan.............................................................................................................................................. 10
1.1 Khái niệm..................................................................................................................................... 10
1.2 Mục Tiêu ...................................................................................................................................... 10
1.3 Ưu điểm........................................................................................................................................ 11
1.4 Nhược điểm.................................................................................................................................. 12
1.5 Giấy phép ..................................................................................................................................... 12
CHƯƠNG 2: TỔNG QUAN ANGULAR.................................................................................... 19
1. Khái niệm .............................................................................................................................................. 19
2. Những đặc điểm nổi bật ........................................................................................................................ 20
3. Ưu điểm ................................................................................................................................................. 21
4. Nhược điểm ........................................................................................................................................... 22
5. Cài đặt ................................................................................................................................................... 22
CHƯƠNG 3: HƯỚNG DẪN CÀI ĐẶT VÀ CHẠY ỨNG DỤNG IONIC............................... 22
1. Cài đặt môi trường ................................................................................................................................ 22
2. Cài đặt CLI............................................................................................................................................ 23
3. Triển khai trên Android........................................................................................................................ 25
3.1. Yêu cầu......................................................................................................................................... 25
3.2. Hướng dẫn thiết lập Android Studio........................................................................................... 25
3.3. Thiết lập dự án............................................................................................................................. 26
3.4. Chạy ứng dụng với Capacitor hay Cordova.............................................................................. 27
4. Triển khai trên iOS ............................................................................................................................... 28
4.1. Yêu cầu......................................................................................................................................... 28
4.2. Thiết lập dự án............................................................................................................................. 28
4.3. Chạy ứng dụng với Xcode............................................................................................................ 29
CHƯƠNG 4: LAYOUT ................................................................................................................ 30
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phi1. Cấu trúc................................................................................................................................................. 30
1.1. Header and Footer Layout .......................................................................................................... 30
1.2. Tabs Layout ................................................................................................................................. 30
1.3. Menu Layout ................................................................................................................................ 31
2. Responsive Grid .................................................................................................................................... 33
3. Css.......................................................................................................................................................... 33
3.1. Colors ........................................................................................................................................... 33
3.2. Text Modification......................................................................................................................... 35
3.3. Element Placement....................................................................................................................... 37
3.4. Element Display ........................................................................................................................... 38
3.5. Content Space .............................................................................................................................. 38
3.6. Flex Properties ............................................................................................................................. 40
3.7. Border Display ............................................................................................................................. 43
3.8. Ionic Breakpoints......................................................................................................................... 44
CHƯƠNG 5: COMPONENTS..................................................................................................... 45
CHƯƠNG 6: NATIVE.................................................................................................................. 48
1. Giới thiệu............................................................................................................................................... 48
2. Thiết lập................................................................................................................................................. 48
2.1. Ionic Native Community là gì?.................................................................................................... 48
2.2. Usage ............................................................................................................................................ 48
3. Ionic Native FAQ................................................................................................................................... 55
3.1. Use the Ionic CLI to add/update/delete plugins. ......................................................................... 55
3.2. Upgrade plugins by removing, then re-adding them. ................................................................. 56
3.3. càiexplicit versions................................................................................................................. 56
3.4. Restore Cordova in an existing Ionic project.............................................................................. 56
3.5. Troubleshoot Cordova issues with Ionic CLI commands ........................................................... 56
PHẦN 2: XÂY DỰNG ỨNG DỤNG MINH HỌA..................................................................... 56
CHƯƠNG 1: PHÁT BIỂU BÀI TOÁN....................................................................................... 56
1.1. Giới thiệu bài toán cần giải quyết ......................................................................................................... 57
1.1.1. Nhu cầu thực tế của đề tài .............................................................................................................. 57
1.1.2 Mục tiêu đề tài............................................................................................................................... 57
1.2. Mô tả quy trình thực hiện ..................................................................................................................... 57
CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG.................................................................................. 58
2.1 Hiện trạng tổ chức..................................................................................................................................... 582.1.1 Sơ đồ tổ chức hệ thống ......................................................................................................................... 58
2.1.2 Chức năng của Người dùng................................................................................................................... 58
2.2 Hiện trạng tin học...................................................................................................................................... 58
2.3 Hiện trạng nghiệp vụ................................................................................................................................. 58
2.3.1 Mô tả nghiệp vụ.................................................................................................................................... 58
2.3.2 Sơ đồ hiện trạng nghiệp vụ ................................................................................................................... 59
2.3.3 Bảng mô tả công việc ........................................................................................................................... 59
CHƯƠNG 3: XÁC ĐỊNH CÁC YÊU CẦU PHẦN MỀM......................................................... 61
3.1 Yêu cầu chức năng ................................................................................................................................ 61
3.2 Yêu cầu phi chức năng .......................................................................................................................... 61
CHƯƠNG 4: MÔ HÌNH USE-CASE .......................................................................................... 63
4.1 Sơ đồ Use-case tổng quát: ......................................................................................................................... 63
4.2 Danh sách các Actor.................................................................................................................................. 63
4.3 Danh sách các Use-case............................................................................................................................. 64
4.4 Đặc tả Use-case.......................................................................................................................................... 65
4.4.1 Đặc tả Use-case “Tìm kiếm liên hệ”...................................................................................................... 65
4.4.2 Đặc tả Use-case “Thêm liên hệ”............................................................................................................ 66
4.4.3 Đặc tả Use-case “Xóa liên hệ” .............................................................................................................. 67
4.4.4 Đặc tả Use-case “Cập nhật liên hệ”....................................................................................................... 68
4.4.5 Đặc tả Use-case “Gọi điện thoại”.......................................................................................................... 69
4.4.6 Đặc tả Use-case “Thêm ưa thích”.......................................................................................................... 70
4.4.7 Đặc tả Use-case “Tìm địa chỉ liên hệ”................................................................................................... 71
CHƯƠNG 5: PHÂN TÍCH........................................................................................................... 72
5.1 Sơ đồ lớp.................................................................................................................................................... 72
5.1.1 Sơ đồ lớp (mức phân tích)..................................................................................................................... 72
5.1.2 Danh sách các lớp đối tượng và quan hệ ............................................................................................... 74
5.1.3 Mô tả chi tiết từng lớp đối tượng........................................................................................................... 74
5.2 Sơ đồ sequence........................................................................................................................................... 75
5.2.1 Cập nhật liên hệ.................................................................................................................................... 75
5.2.2 Thêm mới liên hệ.................................................................................................................................. 76
5.2.3 Xóa thông tin liên hệ ............................................................................................................................ 76
CHƯƠNG 6: THIẾT KẾ DỮ LIỆU............................................................................................ 78
6.1 Sơ đồ logic.................................................................................................................................................. 78
6.2 Danh sách các bảng dữ liệu trong sơ đồ ................................................................................................... 78
6.3 Mô tả chi tiết các kiểu dữ liệu trong sơ đồ logic ....................................................................................... 79
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phi6.3.1 Bảng CONTACT........................................................................................................................... 79
6.3.2 Bảng PHOTO ................................................................................................................................ 80
CHƯƠNG 7: THIẾT KẾ KIẾN TRÚC ...................................................................................... 81
7.1 Kiến trúc hệ thống..................................................................................................................................... 81
7.2 Mô tả chi tiết từng thành phần trong mô hình ......................................................................................... 81
7.2.1 View .................................................................................................................................................... 81
7.2.2 View Model.......................................................................................................................................... 81
7.2.3 Model................................................................................................................................................... 81
CHƯƠNG 8: THIẾT KẾ GIAO DIỆN ....................................................................................... 82
8.1 Sơ đồ liên kết các màn hình ...................................................................................................................... 82
8.2 Danh sách các màn hình ........................................................................................................................... 82
8.3 Mô tả chi tiết các màn hình....................................................................................................................... 84
8.3.1. Màn hình Contacts và Favorite....................................................................................................... 84
8.3.2. Màn hình Thêm liên hệ .................................................................................................................. 85
8.3.3. Màn hình Tìm kiếm liên hệ................................................................................................................. 86
8.3.4. Màn hình Chỉnh sửa liên hệ............................................................................................................ 87
8.3.5. Màn hình gọi thoại......................................................................................................................... 88
8.3.6. Màn hình quét QR code ................................................................................................................. 89
8.3.7. Màn hình QR code......................................................................................................................... 90
8.3.8. Màn hình Chi tiết liên hệ................................................................................................................ 91
8.3.9. Màn hình địa chỉ google map ......................................................................................................... 92
CHƯƠNG 9: NHẬN XÉT VÀ KẾT LUẬN................................................................................ 93
9.1 Môi trường phát triển và Môi trường triển khai.................................................................................. 93
9.1.1 Môi trường phát triển ứng dụng...................................................................................................... 93
9.1.2 Môi trường triển khai ứng dụng ............................................................................................................ 93
9.2 Kết quả đạt được................................................................................................................................... 93
9.3 Nhận xét..................................................................................................................................................... 93
9.3.1 Ưu điểm ............................................................................................................................................... 93
9.3.2 Khuyết điểm......................................................................................................................................... 94
9.4 Hướng phát triển....................................................................................................................................... 94
BẢNG PHÂN CHIA CÔNG VIỆC.............................................................................................. 95
TÀI LIỆU THAM KHẢO ............................................................................................................ 96Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phiPHẦN 0: MỤC ĐÍCH ĐỀ TÀI
- Tìm hiểu khái niệm, các chức năng nổi bật, ưu nhược điểm của Ionic, Angular và
Cordova Framework
- Nắm được các dòng lệnh command-line quan trọng trong Ionic, Angular Framework và
các yêu cầu cần thiết để triển khai cho một ứng dụng trên hai nền tảng iOS và Android
(bao gồm trình mô phỏng và thiết bị ).
- Xây dựng hybrid app minh họa lưu trữ thông tin cá nhân, bạn bè với sự kết hợp giữa
Angular và Ionic với một số API do Cordova cung cấp: Camera, Native Storage, Call
Number,..PHẦN 1: TÌM HIỂU IONIC ANGULAR
CHƯƠNG 1: TỔNG QUAN IONIC
1. Tổng quan
1.1 Khái niệm
Ionic là một Framework cung cấp bộ công cụ giao diện người dùng mã nguồn mở
để xây dựng các ứng dụng di động và máy tính để bàn chất lượng cao sử dụng công
nghệ web - HTML, CSS và JavaScript
Kết hợp với các framework javascript phổ biến khác:
- Vue
- Angular
- React
1.2 Mục Tiêu
a. Đa nền tảng
Xây dựng và triển khai các ứng dụng hybrid trên iOS, Android, máy tính để
bàn và web dưới dạng Progressive Web App - tất cả đều có một cơ sở mã. Viết một
lần, chạy bất cứ nơi nào.
b. Dựa trên Tiêu chuẩn Web
công nghệ web tiêu chuẩn hóa: HTML, CSS và JavaScript, sử dụng các API
Web hiện đại như Custom Elements và Shadow DOM. Bởi vì điều này, các thành
phần Ionic có một API ổn định, và không theo ý thích của một nhà cung cấp nền
tảng duy nhất.
c. Thiết kế đẹp
Ionic Framework được thiết kế để hoạt động và hiển thị tuyệt đẹp out-of-thebox trên tất cả các nền tảng. Bắt đầu với các thành phần được thiết kế sẵn, kiểu chữ,
mô hình tương tác và chủ đề cơ sở tuyệt đẹp (nhưng có thể mở rộng).
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phid. Đơn giản
Ionic Framework được xây dựng với sự đơn giản trong tâm trí, để tạo ra các
ứng dụng Ionic là thú vị, dễ dàng tìm hiểu, và có thể truy cập chỉ là về bất cứ ai có
kỹ năng phát triển web.
1.3 Ưu điểm
- Người phát triển có thể sử dụng các kỹ năng từ lập trình web, giúp giảm thiểu thời
gian cũng như chi phí đào tạo nói riêng và thời gian cũng như chi phí dành cho dự
án nói chung.
- Chỉ một bộ mã lệnh có thể sử dụng trên nhiều hệ điều hành khác nhau.
- Khả năng truy cập đến các chức năng của thiết bị và hệ điều hành.
- Khả năng sử dụng trong chế độ offline.
- Việc thiết kế giao diện cho các thiết bị có kích cỡ khác nhau trở nên dễ dàng với
thiết kế tùy ứng (responsive design) của web.
- Việc sử dụng AngularJS làm core cũng mang lại lợi thế lớn so với các framework
cho ứng dụng hybrid khác.
- Ionic cung cấp đầy đủ các thành phần trong giao diện người dùng như Pull-toRefresh, Infinite-loader, tabs, ..
- Một lợi thế khác khi sử dụng Ionic là nó có một cộng đồng người dùng lớn mạnh,
giúp cho việc tìm hiểu và hỗ trợ dễ dàng hơn.
- Các ứng dụng hybrid có nhiều ưu điểm như có thể hiển thị cho nhiều nền tảng- Tận dụng các chức năng khác của thiết bị di động như GPS, camera....
- Thời gian và chi phí dùng để phát triển ứng dung cũng thấp hơn nhiều so với
native.
1.4 Nhược điểm
- Tốc độ chậm với một số chức năng chuyển trang trên di động.
- Các plugin có thể không tương thích với một số thiết bị và nền tảng.
- Một số API cũng chưa được hỗ trợ để giao tiếp với thiết bị.
- Tuy nhiên, nó vẫn đang trong giai đoạn phát triển nên độ ổn định chưa cao
1.5 Giấy phép
Ionic Framework là một dự án mã nguồn mở và miễn phí, được phát hành theo giấy
phép MIT. Điều này có nghĩa là nó có thể được sử dụng trong các dự án cá nhân hoặc
thương mại miễn phí. MIT là giấy phép tương tự được sử dụng bởi các dự án phổ biến
như jQuery và Ruby on Rails.
2. chức năng
2.1. Cordova
2.1.1 Cordova là gì?
Apache Cordova (trước kia được gọi là PhoneGap) là một framework phát triển ứng
dụng di động nổi tiếng được tạo ra bởi Nitobi. Adobe Systems đã mua Nitobi vào năm
2011, đổi tên nó thành PhoneGap, và sau đó đã phát hành một phiên bản mã nguồn mở
được gọi là Apache Cordova. Cordova là một nền tảng để xây dựng những ứng dụng di
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phiđộng (hybrid mobile applications) sử dụng HTML, CSS và Javascript. Những ứng dụng
này có thể chạy trên nhiều nền tảng khác nhau như Android, iOS, Windows Phone…
dựa trên các API để giao tiếp với thiết bị.
Khi sử dụng Cordova API, một ứng dụng có thể được xây dựng mà không phải sử
dụng bất kỳ một đoạn mã native code nào. Thay vào đó, công nghệ web sẽ được sử
dụng, và chúng sẽ được tổ chức trên chính ứng dụng đấy chứ không cần thông qua một
server nào.
Và bởi vì những API Javascript này là thống nhất trên tất cả các nền tảng thiết bị và
được xây dựng trên chuẩn web nên những ứng dụng được viết trên nền tảng này có thể
được sử dụng trên các nền tảng khác mà có thể không cần có bất cứ sự thay đổi nào.
Cordova cung cấp một tập hợp các thư viện Javascript đã được chuẩn hóa để có thể
sử dụng. Cordova hiện có thể sử dụng cho các nền tảng như iOS, Android, Blackberry,
Windows Phone, Palm WebOS, Bada và Symbian.
Một số APIs được Cordova cung cấp cần thiết cho di động như: Camera, GPS, firebase,
SQLite, Call Phone Number, Native Storage,..
2.1.2 Các chức năng của Cordova
Cordova đưa ra nền tảng để xây dựng các hybrid app, nên chúng ta có thể phát triển
các ứng dụng chạy trên nhiều nền tảng khác nhau như IOS, Android, Windows Phone,
Amazon-fireos, blackberry, Firefox OS, Ubuntu và tizien.
Sử dụng cordova sẽ nhanh hơn rất nhiều so với phát triển các ứng dụng thuần android,
hay iOS.
Chỉ cần sử dụng Javascript khi làm việc với Cordova nên ta không cần thiết phải biết
từng ngôn ngữ lập trình cho từng loại hệ điều hành2.1.3 Hạn chế
Hiệu suất của hybrid app thì sẽ chậm hơn các native app, nên chúng ta không dùng
Cordova để xây dựng các ứng dụng lớn, yêu cầu nhiều dữ liệu và chức năng.
Các plugin có thể không tương thích với một số thiết bị và nền tảng. Một số API
cũng chưa được hỗ trợ để giao tiếp với thiết bị.
2.1.4 Cách cài đặt
Bước 1: Cài Nodejs
genarate các file tương ứng từ source code.
Bước 2: Cài Cordova Các command-line của Cordovar chạy trên nền Node.js, mở
Terminal và gõ:
Bước 3: Tạo mới project: Tạo mới một project Cordova bằng tool command-line,
điều hướng tới folfer mà bạn muốn lưu trữ project và tạo đường dẫn:
Bước 4: Thêm platform Sau khi khởi tạo project Cordova, điều hướng tới folder
chứa project, từ folder này, bạn có thể add thêm bất kỳ platform nào bạn muốn để build
app. Để add platform, type:
nPhần mềm cài-g cordova
cordova create
cordova platform add
cordova build
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phi2.2. Capacitor
2.2.1. Capacitor là gì?
Capacitor là một dự án mã nguồn mở chạy các Ứng dụng Web hiện đại trên iOS,
Android, Electron và Web (sử dụng công nghệ Progressive Web App) cung cấp giao
diện mạnh mẽ và dễ sử dụng để truy cập Native SDKs và Native APIs trên mỗi nền
tảng.
2.2.2. Ưu điểm
- Thay thế cho Cordova, Capacitor mang lại những lợi ích đa nền tảng tương tự,
nhưng với cách tiếp cận hiện đại hơn để phát triển ứng dụng, tận dụng các API
web mới nhất và khả năng native platform.
- Sử dụng Capacitor, các nhà phát triển có thể xây dựng một ứng dụng và nhắm mục
tiêu một tập hợp API bất kể ứng dụng đang chạy trên nền tảng nào, trái ngược với
việc quản lý nhiều API cho mỗi nền tảng mục tiêu.
- Dễ dàng xây dựng một ứng dụng web chạy tự nhiên trên thiết bị di động, máy tính
để bàn và web dưới dạng Progressive Web App
1.1. Giới thiệu bài toán cần giải quyết
1.1.1. Nhu cầu thực tế của đề tài
Trong thời đại công nghệ hiện nay, để tìm được một ứng dụng quản lý thông tin cá nhân tổ chức
và hỗ trợ trên nền tảng di động hầu như không phải là chuyện dễ dàng. Đa số người dùng quản lý
thông tin bằng phần mềm khác như Excel, Danh bạ,.. Tuy nhiên, phần mềm danh bạ chỉ lưu một
đến hai thông tin cơ bản và không sử dụng để lưu trữ nhiều thông tin. Từ đó, việc phát triển một
phần mềm có thể xem là phần mềm danh bạ mở rộng trên nền tảng di dộng giúp lưu trữ thông tin
và chức năng đầy đủ hơn. Với cách lưu trữ như vậy chúng ta có thể dễ dàng quản lý, thích
thú hơn so với cách quản lý truyền thống.
1.1.2 Mục tiêu đề tài
Từ những phân tích trên, để tiếp cận nhóm em đã tìm hiểu, xây dựng và cài đặt “Ứng dụng quản
lý thông tin“.
Mục đích:
- Tính tiện lợi khi sử dụng
- Lữu trữ đầy đủ thông tin
- Thiết kế thân thiện đẹp mắt, dễ sử dụng
chức năng:
- Xem danh sách thông tin cá nhân, tổ chức
- Thêm thông tin liên hệ
- Cho phép gọi điện thoại, tìm kiếm địa điểm
- Cho phép chụp ảnh
1.2. Mô tả quy trình thực hiện
Nghiên cứu các phương pháp xây dựng phần mềm, lựa chọn phương pháp phù hợp với nhóm.
Do Drive thay đổi chính sách, nên một số link cũ yêu cầu duyệt download. các bạn chỉ cần làm theo hướng dẫn.
Password giải nén nếu cần: ket-noi.com | Bấm trực tiếp vào Link để tải:
MỤC LỤC........................................................................................................................................ 4
PHẦN 0: MỤC ĐÍCH ĐỀ TÀI....................................................................................................... 9
PHẦN 1: TÌM HIỂU IONIC ANGULAR................................................................................... 10
CHƯƠNG 1: TỔNG QUAN IONIC............................................................................................ 10
1. Tổng quan.............................................................................................................................................. 10
1.1 Khái niệm..................................................................................................................................... 10
1.2 Mục Tiêu ...................................................................................................................................... 10
1.3 Ưu điểm........................................................................................................................................ 11
1.4 Nhược điểm.................................................................................................................................. 12
1.5 Giấy phép ..................................................................................................................................... 12
CHƯƠNG 2: TỔNG QUAN ANGULAR.................................................................................... 19
1. Khái niệm .............................................................................................................................................. 19
2. Những đặc điểm nổi bật ........................................................................................................................ 20
3. Ưu điểm ................................................................................................................................................. 21
4. Nhược điểm ........................................................................................................................................... 22
5. Cài đặt ................................................................................................................................................... 22
CHƯƠNG 3: HƯỚNG DẪN CÀI ĐẶT VÀ CHẠY ỨNG DỤNG IONIC............................... 22
1. Cài đặt môi trường ................................................................................................................................ 22
2. Cài đặt CLI............................................................................................................................................ 23
3. Triển khai trên Android........................................................................................................................ 25
3.1. Yêu cầu......................................................................................................................................... 25
3.2. Hướng dẫn thiết lập Android Studio........................................................................................... 25
3.3. Thiết lập dự án............................................................................................................................. 26
3.4. Chạy ứng dụng với Capacitor hay Cordova.............................................................................. 27
4. Triển khai trên iOS ............................................................................................................................... 28
4.1. Yêu cầu......................................................................................................................................... 28
4.2. Thiết lập dự án............................................................................................................................. 28
4.3. Chạy ứng dụng với Xcode............................................................................................................ 29
CHƯƠNG 4: LAYOUT ................................................................................................................ 30
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phi1. Cấu trúc................................................................................................................................................. 30
1.1. Header and Footer Layout .......................................................................................................... 30
1.2. Tabs Layout ................................................................................................................................. 30
1.3. Menu Layout ................................................................................................................................ 31
2. Responsive Grid .................................................................................................................................... 33
3. Css.......................................................................................................................................................... 33
3.1. Colors ........................................................................................................................................... 33
3.2. Text Modification......................................................................................................................... 35
3.3. Element Placement....................................................................................................................... 37
3.4. Element Display ........................................................................................................................... 38
3.5. Content Space .............................................................................................................................. 38
3.6. Flex Properties ............................................................................................................................. 40
3.7. Border Display ............................................................................................................................. 43
3.8. Ionic Breakpoints......................................................................................................................... 44
CHƯƠNG 5: COMPONENTS..................................................................................................... 45
CHƯƠNG 6: NATIVE.................................................................................................................. 48
1. Giới thiệu............................................................................................................................................... 48
2. Thiết lập................................................................................................................................................. 48
2.1. Ionic Native Community là gì?.................................................................................................... 48
2.2. Usage ............................................................................................................................................ 48
3. Ionic Native FAQ................................................................................................................................... 55
3.1. Use the Ionic CLI to add/update/delete plugins. ......................................................................... 55
3.2. Upgrade plugins by removing, then re-adding them. ................................................................. 56
3.3. càiexplicit versions................................................................................................................. 56
3.4. Restore Cordova in an existing Ionic project.............................................................................. 56
3.5. Troubleshoot Cordova issues with Ionic CLI commands ........................................................... 56
PHẦN 2: XÂY DỰNG ỨNG DỤNG MINH HỌA..................................................................... 56
CHƯƠNG 1: PHÁT BIỂU BÀI TOÁN....................................................................................... 56
1.1. Giới thiệu bài toán cần giải quyết ......................................................................................................... 57
1.1.1. Nhu cầu thực tế của đề tài .............................................................................................................. 57
1.1.2 Mục tiêu đề tài............................................................................................................................... 57
1.2. Mô tả quy trình thực hiện ..................................................................................................................... 57
CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG.................................................................................. 58
2.1 Hiện trạng tổ chức..................................................................................................................................... 582.1.1 Sơ đồ tổ chức hệ thống ......................................................................................................................... 58
2.1.2 Chức năng của Người dùng................................................................................................................... 58
2.2 Hiện trạng tin học...................................................................................................................................... 58
2.3 Hiện trạng nghiệp vụ................................................................................................................................. 58
2.3.1 Mô tả nghiệp vụ.................................................................................................................................... 58
2.3.2 Sơ đồ hiện trạng nghiệp vụ ................................................................................................................... 59
2.3.3 Bảng mô tả công việc ........................................................................................................................... 59
CHƯƠNG 3: XÁC ĐỊNH CÁC YÊU CẦU PHẦN MỀM......................................................... 61
3.1 Yêu cầu chức năng ................................................................................................................................ 61
3.2 Yêu cầu phi chức năng .......................................................................................................................... 61
CHƯƠNG 4: MÔ HÌNH USE-CASE .......................................................................................... 63
4.1 Sơ đồ Use-case tổng quát: ......................................................................................................................... 63
4.2 Danh sách các Actor.................................................................................................................................. 63
4.3 Danh sách các Use-case............................................................................................................................. 64
4.4 Đặc tả Use-case.......................................................................................................................................... 65
4.4.1 Đặc tả Use-case “Tìm kiếm liên hệ”...................................................................................................... 65
4.4.2 Đặc tả Use-case “Thêm liên hệ”............................................................................................................ 66
4.4.3 Đặc tả Use-case “Xóa liên hệ” .............................................................................................................. 67
4.4.4 Đặc tả Use-case “Cập nhật liên hệ”....................................................................................................... 68
4.4.5 Đặc tả Use-case “Gọi điện thoại”.......................................................................................................... 69
4.4.6 Đặc tả Use-case “Thêm ưa thích”.......................................................................................................... 70
4.4.7 Đặc tả Use-case “Tìm địa chỉ liên hệ”................................................................................................... 71
CHƯƠNG 5: PHÂN TÍCH........................................................................................................... 72
5.1 Sơ đồ lớp.................................................................................................................................................... 72
5.1.1 Sơ đồ lớp (mức phân tích)..................................................................................................................... 72
5.1.2 Danh sách các lớp đối tượng và quan hệ ............................................................................................... 74
5.1.3 Mô tả chi tiết từng lớp đối tượng........................................................................................................... 74
5.2 Sơ đồ sequence........................................................................................................................................... 75
5.2.1 Cập nhật liên hệ.................................................................................................................................... 75
5.2.2 Thêm mới liên hệ.................................................................................................................................. 76
5.2.3 Xóa thông tin liên hệ ............................................................................................................................ 76
CHƯƠNG 6: THIẾT KẾ DỮ LIỆU............................................................................................ 78
6.1 Sơ đồ logic.................................................................................................................................................. 78
6.2 Danh sách các bảng dữ liệu trong sơ đồ ................................................................................................... 78
6.3 Mô tả chi tiết các kiểu dữ liệu trong sơ đồ logic ....................................................................................... 79
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phi6.3.1 Bảng CONTACT........................................................................................................................... 79
6.3.2 Bảng PHOTO ................................................................................................................................ 80
CHƯƠNG 7: THIẾT KẾ KIẾN TRÚC ...................................................................................... 81
7.1 Kiến trúc hệ thống..................................................................................................................................... 81
7.2 Mô tả chi tiết từng thành phần trong mô hình ......................................................................................... 81
7.2.1 View .................................................................................................................................................... 81
7.2.2 View Model.......................................................................................................................................... 81
7.2.3 Model................................................................................................................................................... 81
CHƯƠNG 8: THIẾT KẾ GIAO DIỆN ....................................................................................... 82
8.1 Sơ đồ liên kết các màn hình ...................................................................................................................... 82
8.2 Danh sách các màn hình ........................................................................................................................... 82
8.3 Mô tả chi tiết các màn hình....................................................................................................................... 84
8.3.1. Màn hình Contacts và Favorite....................................................................................................... 84
8.3.2. Màn hình Thêm liên hệ .................................................................................................................. 85
8.3.3. Màn hình Tìm kiếm liên hệ................................................................................................................. 86
8.3.4. Màn hình Chỉnh sửa liên hệ............................................................................................................ 87
8.3.5. Màn hình gọi thoại......................................................................................................................... 88
8.3.6. Màn hình quét QR code ................................................................................................................. 89
8.3.7. Màn hình QR code......................................................................................................................... 90
8.3.8. Màn hình Chi tiết liên hệ................................................................................................................ 91
8.3.9. Màn hình địa chỉ google map ......................................................................................................... 92
CHƯƠNG 9: NHẬN XÉT VÀ KẾT LUẬN................................................................................ 93
9.1 Môi trường phát triển và Môi trường triển khai.................................................................................. 93
9.1.1 Môi trường phát triển ứng dụng...................................................................................................... 93
9.1.2 Môi trường triển khai ứng dụng ............................................................................................................ 93
9.2 Kết quả đạt được................................................................................................................................... 93
9.3 Nhận xét..................................................................................................................................................... 93
9.3.1 Ưu điểm ............................................................................................................................................... 93
9.3.2 Khuyết điểm......................................................................................................................................... 94
9.4 Hướng phát triển....................................................................................................................................... 94
BẢNG PHÂN CHIA CÔNG VIỆC.............................................................................................. 95
TÀI LIỆU THAM KHẢO ............................................................................................................ 96Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phiPHẦN 0: MỤC ĐÍCH ĐỀ TÀI
- Tìm hiểu khái niệm, các chức năng nổi bật, ưu nhược điểm của Ionic, Angular và
Cordova Framework
- Nắm được các dòng lệnh command-line quan trọng trong Ionic, Angular Framework và
các yêu cầu cần thiết để triển khai cho một ứng dụng trên hai nền tảng iOS và Android
(bao gồm trình mô phỏng và thiết bị ).
- Xây dựng hybrid app minh họa lưu trữ thông tin cá nhân, bạn bè với sự kết hợp giữa
Angular và Ionic với một số API do Cordova cung cấp: Camera, Native Storage, Call
Number,..PHẦN 1: TÌM HIỂU IONIC ANGULAR
CHƯƠNG 1: TỔNG QUAN IONIC
1. Tổng quan
1.1 Khái niệm
Ionic là một Framework cung cấp bộ công cụ giao diện người dùng mã nguồn mở
để xây dựng các ứng dụng di động và máy tính để bàn chất lượng cao sử dụng công
nghệ web - HTML, CSS và JavaScript
Kết hợp với các framework javascript phổ biến khác:
- Vue
- Angular
- React
1.2 Mục Tiêu
a. Đa nền tảng
Xây dựng và triển khai các ứng dụng hybrid trên iOS, Android, máy tính để
bàn và web dưới dạng Progressive Web App - tất cả đều có một cơ sở mã. Viết một
lần, chạy bất cứ nơi nào.
b. Dựa trên Tiêu chuẩn Web
công nghệ web tiêu chuẩn hóa: HTML, CSS và JavaScript, sử dụng các API
Web hiện đại như Custom Elements và Shadow DOM. Bởi vì điều này, các thành
phần Ionic có một API ổn định, và không theo ý thích của một nhà cung cấp nền
tảng duy nhất.
c. Thiết kế đẹp
Ionic Framework được thiết kế để hoạt động và hiển thị tuyệt đẹp out-of-thebox trên tất cả các nền tảng. Bắt đầu với các thành phần được thiết kế sẵn, kiểu chữ,
mô hình tương tác và chủ đề cơ sở tuyệt đẹp (nhưng có thể mở rộng).
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phid. Đơn giản
Ionic Framework được xây dựng với sự đơn giản trong tâm trí, để tạo ra các
ứng dụng Ionic là thú vị, dễ dàng tìm hiểu, và có thể truy cập chỉ là về bất cứ ai có
kỹ năng phát triển web.
1.3 Ưu điểm
- Người phát triển có thể sử dụng các kỹ năng từ lập trình web, giúp giảm thiểu thời
gian cũng như chi phí đào tạo nói riêng và thời gian cũng như chi phí dành cho dự
án nói chung.
- Chỉ một bộ mã lệnh có thể sử dụng trên nhiều hệ điều hành khác nhau.
- Khả năng truy cập đến các chức năng của thiết bị và hệ điều hành.
- Khả năng sử dụng trong chế độ offline.
- Việc thiết kế giao diện cho các thiết bị có kích cỡ khác nhau trở nên dễ dàng với
thiết kế tùy ứng (responsive design) của web.
- Việc sử dụng AngularJS làm core cũng mang lại lợi thế lớn so với các framework
cho ứng dụng hybrid khác.
- Ionic cung cấp đầy đủ các thành phần trong giao diện người dùng như Pull-toRefresh, Infinite-loader, tabs, ..
- Một lợi thế khác khi sử dụng Ionic là nó có một cộng đồng người dùng lớn mạnh,
giúp cho việc tìm hiểu và hỗ trợ dễ dàng hơn.
- Các ứng dụng hybrid có nhiều ưu điểm như có thể hiển thị cho nhiều nền tảng- Tận dụng các chức năng khác của thiết bị di động như GPS, camera....
- Thời gian và chi phí dùng để phát triển ứng dung cũng thấp hơn nhiều so với
native.
1.4 Nhược điểm
- Tốc độ chậm với một số chức năng chuyển trang trên di động.
- Các plugin có thể không tương thích với một số thiết bị và nền tảng.
- Một số API cũng chưa được hỗ trợ để giao tiếp với thiết bị.
- Tuy nhiên, nó vẫn đang trong giai đoạn phát triển nên độ ổn định chưa cao
1.5 Giấy phép
Ionic Framework là một dự án mã nguồn mở và miễn phí, được phát hành theo giấy
phép MIT. Điều này có nghĩa là nó có thể được sử dụng trong các dự án cá nhân hoặc
thương mại miễn phí. MIT là giấy phép tương tự được sử dụng bởi các dự án phổ biến
như jQuery và Ruby on Rails.
2. chức năng
2.1. Cordova
2.1.1 Cordova là gì?
Apache Cordova (trước kia được gọi là PhoneGap) là một framework phát triển ứng
dụng di động nổi tiếng được tạo ra bởi Nitobi. Adobe Systems đã mua Nitobi vào năm
2011, đổi tên nó thành PhoneGap, và sau đó đã phát hành một phiên bản mã nguồn mở
được gọi là Apache Cordova. Cordova là một nền tảng để xây dựng những ứng dụng di
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phiđộng (hybrid mobile applications) sử dụng HTML, CSS và Javascript. Những ứng dụng
này có thể chạy trên nhiều nền tảng khác nhau như Android, iOS, Windows Phone…
dựa trên các API để giao tiếp với thiết bị.
Khi sử dụng Cordova API, một ứng dụng có thể được xây dựng mà không phải sử
dụng bất kỳ một đoạn mã native code nào. Thay vào đó, công nghệ web sẽ được sử
dụng, và chúng sẽ được tổ chức trên chính ứng dụng đấy chứ không cần thông qua một
server nào.
Và bởi vì những API Javascript này là thống nhất trên tất cả các nền tảng thiết bị và
được xây dựng trên chuẩn web nên những ứng dụng được viết trên nền tảng này có thể
được sử dụng trên các nền tảng khác mà có thể không cần có bất cứ sự thay đổi nào.
Cordova cung cấp một tập hợp các thư viện Javascript đã được chuẩn hóa để có thể
sử dụng. Cordova hiện có thể sử dụng cho các nền tảng như iOS, Android, Blackberry,
Windows Phone, Palm WebOS, Bada và Symbian.
Một số APIs được Cordova cung cấp cần thiết cho di động như: Camera, GPS, firebase,
SQLite, Call Phone Number, Native Storage,..
2.1.2 Các chức năng của Cordova
Cordova đưa ra nền tảng để xây dựng các hybrid app, nên chúng ta có thể phát triển
các ứng dụng chạy trên nhiều nền tảng khác nhau như IOS, Android, Windows Phone,
Amazon-fireos, blackberry, Firefox OS, Ubuntu và tizien.
Sử dụng cordova sẽ nhanh hơn rất nhiều so với phát triển các ứng dụng thuần android,
hay iOS.
Chỉ cần sử dụng Javascript khi làm việc với Cordova nên ta không cần thiết phải biết
từng ngôn ngữ lập trình cho từng loại hệ điều hành2.1.3 Hạn chế
Hiệu suất của hybrid app thì sẽ chậm hơn các native app, nên chúng ta không dùng
Cordova để xây dựng các ứng dụng lớn, yêu cầu nhiều dữ liệu và chức năng.
Các plugin có thể không tương thích với một số thiết bị và nền tảng. Một số API
cũng chưa được hỗ trợ để giao tiếp với thiết bị.
2.1.4 Cách cài đặt
Bước 1: Cài Nodejs
You must be registered for see links
Cordova hoạt động dựa trên nodejs, nó sẽgenarate các file tương ứng từ source code.
Bước 2: Cài Cordova Các command-line của Cordovar chạy trên nền Node.js, mở
Terminal và gõ:
Bước 3: Tạo mới project: Tạo mới một project Cordova bằng tool command-line,
điều hướng tới folfer mà bạn muốn lưu trữ project và tạo đường dẫn:
Bước 4: Thêm platform Sau khi khởi tạo project Cordova, điều hướng tới folder
chứa project, từ folder này, bạn có thể add thêm bất kỳ platform nào bạn muốn để build
app. Để add platform, type:
nPhần mềm cài-g cordova
cordova create
cordova platform add
cordova build
Ket-noi.com kho tai lieu mien phi Ket-noi.com kho tai lieu mien phi2.2. Capacitor
2.2.1. Capacitor là gì?
Capacitor là một dự án mã nguồn mở chạy các Ứng dụng Web hiện đại trên iOS,
Android, Electron và Web (sử dụng công nghệ Progressive Web App) cung cấp giao
diện mạnh mẽ và dễ sử dụng để truy cập Native SDKs và Native APIs trên mỗi nền
tảng.
2.2.2. Ưu điểm
- Thay thế cho Cordova, Capacitor mang lại những lợi ích đa nền tảng tương tự,
nhưng với cách tiếp cận hiện đại hơn để phát triển ứng dụng, tận dụng các API
web mới nhất và khả năng native platform.
- Sử dụng Capacitor, các nhà phát triển có thể xây dựng một ứng dụng và nhắm mục
tiêu một tập hợp API bất kể ứng dụng đang chạy trên nền tảng nào, trái ngược với
việc quản lý nhiều API cho mỗi nền tảng mục tiêu.
- Dễ dàng xây dựng một ứng dụng web chạy tự nhiên trên thiết bị di động, máy tính
để bàn và web dưới dạng Progressive Web App
1.1. Giới thiệu bài toán cần giải quyết
1.1.1. Nhu cầu thực tế của đề tài
Trong thời đại công nghệ hiện nay, để tìm được một ứng dụng quản lý thông tin cá nhân tổ chức
và hỗ trợ trên nền tảng di động hầu như không phải là chuyện dễ dàng. Đa số người dùng quản lý
thông tin bằng phần mềm khác như Excel, Danh bạ,.. Tuy nhiên, phần mềm danh bạ chỉ lưu một
đến hai thông tin cơ bản và không sử dụng để lưu trữ nhiều thông tin. Từ đó, việc phát triển một
phần mềm có thể xem là phần mềm danh bạ mở rộng trên nền tảng di dộng giúp lưu trữ thông tin
và chức năng đầy đủ hơn. Với cách lưu trữ như vậy chúng ta có thể dễ dàng quản lý, thích
thú hơn so với cách quản lý truyền thống.
1.1.2 Mục tiêu đề tài
Từ những phân tích trên, để tiếp cận nhóm em đã tìm hiểu, xây dựng và cài đặt “Ứng dụng quản
lý thông tin“.
Mục đích:
- Tính tiện lợi khi sử dụng
- Lữu trữ đầy đủ thông tin
- Thiết kế thân thiện đẹp mắt, dễ sử dụng
chức năng:
- Xem danh sách thông tin cá nhân, tổ chức
- Thêm thông tin liên hệ
- Cho phép gọi điện thoại, tìm kiếm địa điểm
- Cho phép chụp ảnh
1.2. Mô tả quy trình thực hiện
Nghiên cứu các phương pháp xây dựng phần mềm, lựa chọn phương pháp phù hợp với nhóm.
Do Drive thay đổi chính sách, nên một số link cũ yêu cầu duyệt download. các bạn chỉ cần làm theo hướng dẫn.
Password giải nén nếu cần: ket-noi.com | Bấm trực tiếp vào Link để tải:
You must be registered for see links