ĐỒ ÁN ỨNG DỤNG TRÒ CHUYỆN TRỰC TUYẾN

ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM ĐỒ ÁN ỨNG DỤNG TRÒ CHUYỆN TRỰC TUYẾN Đồ án – SE122.L11.PMCL – VN ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH Giảng viên hướng dẫn: Thầy NGUYỄN TUẤN ANH Sinh viên thực hiện: TP HỒ CHÍ MINH, 22/01/2021 Phan Lê Trọng 17520843 Nguyễn Tài Bồi – 17520284 Nhân – TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM PHAN LÊ TRỌNG NHÂN – 17520843 NGUYỄN TÀI BỒI – 17520284 ĐỒ ÁN ỨNG DỤNG TRÒ CHUYỆN TRỰC TUYẾN CHAT ONLINE APPLICATION KỸ SƯ/ CỬ NHÂN NGÀNH KĨ THUẬT PHẦN MỀM GIẢNG VIÊN HƯỚNG DẪN Thầy NGUYỄN TUẤN ANH TP HỒ CHÍ MINH, 2021 LỜI CẢM ƠN Lời đầu tiên, em xin bày tỏ lòng biết ơn sâu sắc đến thầy Nguyễn Tuấn Anh – giảng viên hướng dẫn chúng em thực Đồ án Thầy đồng hành tận tình hướng dẫn cho chúng em qua giai đoạn đồ án Nhờ có giúp đỡ nhiệt tình thầy mà chúng em có thể hoàn thành được đồ án cách tốt Vì kiến thức chúng em cịn hạn hẹp nên khơng thể tránh khỏi thiếu sót trình thực đồ án Tuy nhiên, chúng em cố gắng hồn thành hạn hạn chế lỡi nhiều có thể Nhóm chúng em mong đợi nhận ý kiến đóng góp quý báu từ thầy qua đó có thể rút kinh nghiệm, tự sửa chữa, hồn thiện thân tinh thần nghiêm túc, tự giác học hỏi Trong trình làm đề tài báo cáo, tránh khỏi thiếu sót, mong nhận phản hồi từ thầy bạn để góp phần làm cho báo cáo thêm hoàn thiện Chân thành cảm ơn thầy! LỜI NHẬN XÉT CỦA GIẢNG VIÊN … ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… …………………………………………………………………………… MỤC LỤC MỞ ĐẦU Lí chọn đề tài Phương pháp nghiên cứu Đối tượng hướng đến Chương GIỚI THIỆU VỀ FLUTTER 1.1 Giới thiệu ngơn ngữ lập trình Dart 1.1.1 Ngơn ngữ lập trình Dart gì? 1.1.2.Ưu điểm Dart 1.2 Giới thiệu framework Flutter 1.2.1.Flutter gì? 1.2.2.Kiến trúc Flutter 1.2.3.Ưu điểm Flutter so với framework khác CHƯƠNG 2: CÀI ĐẶT MÔI TRƯỜNG PHÁT TRIỂN FLUTTER 2.1 Yêu cầu cấu hình phần cứng 2.2 Hướng dẫn cài đặt Flutter 2.3 Tạo project Flutter Android Studio CHƯƠNG 3: PHÁT TRIỂN ỨNG DỤNG TRÒ CHUYỆN TRỰC TUYẾN VỚI FLUTTER 14 3.1 Đặt vấn đề 14 3.2 Phạm vi ứng dụng 14 3.3 Các chức 15 3.4 Phân tích thiết kế 15 3.5 Các hình giao diện ứng dụng 17 CHƯƠNG 4: KẾT LUẬN 23 4.1 Kết thu 23 4.2 Khó khăn gặp phải 23 4.3 Hướng phát triển tương lai 24 DANH MỤC HÌNH Hình 1.1 Logo Dart Hình 2.2 Logo Flutter Hình 2.3 Kiến trúc Flutter Hình 2.1 Chỉnh sửa biến môi trường Hình 2.2 Chẩn đoán Flutter với flutter doctor Hình 2.3 Extension Flutter Visual Studio Hình 2.4 Cài đặt flutter 10 Hình 2.5 Xác nhận cài đặt Flutter 10 Hình 2.6 Giao diện Android Studio kích hoạt Flutter 11 Hình 3.1 Lược đồ phân cấp chức 15 Hình 3.2 Use case tổng quát 16 Hình 3.3 Use case Đăng nhập 16 Hình 3.4 Use case Thông báo tin nhắn 16 Hình 3.5 Use case Chatbox 17 DANH MỤC BẢNG Bảng 2-1 So sánh Flutter React Native MỞ ĐẦU Lí chọn đề tài Hiện nay, thời đại công nghiệp hóa - đại hóa, công nghệ 4.0 dần đưa vào sống ngày Bên cạnh đó, có thể áp dụng công nghệ cách thành thục có khả tự tìm hiểu được, có thể gặp khó khăn về cố công nghê, trục trặc máy tính, hệ thống hỏng hóc thiết bị Hoặc làm xa, công tác liên lạc song điện thoại ứng dụng máy tính bạn để đảm bảo hiệu suất Thay thực gọi phải tốn phí cao mã vùng để đảm bảo suât làm việc lúc nơi, bọn em định xây dựng Ứng dụng trò chuyện trực tuyến để khắc phục khiếm khuyết Phương pháp nghiên cứu Nhận thấy nhóm đối tượng chủ yếu bạn trẻ, doanh nhân số doanh nghiệp Nhóm chúng em thực đề tài ngôn ngữ Dart, cơng nghệ ứng dụng Flutter Q trình tìm hiểu nghiệp vụ nhóm chúng em có tham khảo diễn đàn về trò chuyện trực tuyến (Messenger, Zalo,…) Cùng với đó tham khảo ứng dụng có sẵn chợ ứng dụng để có nhìn tổng quát về đề tài chọn Đối tượng hướng đến Ứng dụng nhóm định hướng đến người có nhu cầu trò chuyện trực tuyến hay nói cách khác thời gian thực, tiện lợi song Internet, xem xét khắc phục lỗi cho khách hàng từ xa hay đơn giản chia thông tin Đây nhóm người thường xuyên sử dụng máy tính, laptop Do đó họ có khả cần chia sẽ, giúp đỡ từ bạn bè, đồng nghiệp từ xa Ứng dụng trợ thủ đắc lực giúp họ có thể nhận trợ giúp từ xa thông qua việc trị chuyện trực tuyến khơng tính phí Từ đó có thể nâng cao suất làm việc chia tài liệu Chương GIỚI THIỆU VỀ FLUTTER 1.1 Giới thiệu ngơn ngữ lập trình Dart Hình 1.1 Logo Dart - 1.1.1 Ngơn ngữ lập trình Dart gì? Dart ngơn ngữ lập trình mới, phát triển Google, chấp thuận tổ chức Ecma (ECMA-408) Nó sử dụng để xây dựng loại ứng dụng: web, server, di động (IOS Android) - Dart ngơn ngữ lập trình hướng đối tượng, với chế garbage collector, cú pháp kiểu C Nó hỡ trợ khái niệm lập trình đại interface, mixin, abstract, generic, type-safe Đây ngơn ngữ lập trình mã nguồn mở, cơng bố Github 1.1.2.Ưu điểm Dart Một số ưu điểm vượt trội Dart so với ngôn ngữ lập trình khác: - Năng suất: Dart có cú pháp dễ hiểu, rõ ràng súc tích Type-safe giúp lập trình viên có thể xác định sớm lỡi Bên cạnh đó Dart có hệ sinh thái rộng lớn lên đến hàng nghìn packages - Nhanh: Dart cung cấp tối ưu hóa việc biên dịch trước thời hạn để có dự đoán hiệu suất cao khởi động nhanh thiết bị di động web - Dễ làm quen: Do Dart có cú pháp kiểu C/C++, nên dễ học Nếu bạn biết C ++, C # Java, bạn có thể làm việc hiệu với Dart sau vài ngày - Reactive: Dart phù hợp với lập trình Reactive, với hỡ trợ để quản lý đối tượng tồn thời gian ngắn, chẳng hạn widget UI, thông qua phân bổ đối tượng nhanh garbage collector Dart hỡ trợ lập trình khơng đồng thơng qua tính ngơn ngữ API sử dụng đối tượng Future Stream Từ ngơn ngữ lập trình Dart, Google giới thiệu Framework Futter sử dụng ngôn ngữ Dart để phát triển ứng dụng di động chạy đa nền tảng 1.2 Giới thiệu framework Flutter Hình 2.2 Logo Flutter 1.2.1 Flutter gì? - Flutter phát triển nhằm giải toán thường gặp việc phát triển ứng dụng Fast Development (phát triển ứng dụng nhanh) Native Performance (hiệu suất tối ưu cho nền tảng) Nếu React Native đảm bảo Fast Development cịn Native language đảm bảo Native Performance Flutter làm điều - Phiên Flutter gọi "Sky" chạy hệ điều hành Android Nó công bố hội nghị nhà phát triển Dart 2015, hỗ trợ ứng dụng hoạt động mức 120 khung hình giây - Trong phát biểu hội nghị Google Developer Days Thượng Hải, Google công bố phiên Flutter Release Preview 2, phiên lớn cuối trước Flutter 1.0 Hình 2.4 Cài đặt flutter - Click Yes chờ cho plugin để download Hình 2.5 Xác nhận cài đặt Flutter 10 Hình 2.6 Tải flutter - Click Restart Android Studio click Restart để kích hoạt plugin vào Android Studio Hình 2.6 Giao diện Android Studio kích hoạt Flutter - Bạn vào trang web Flutter để tải SDK Flutter về - Sau khởi động lại Android Studio, Chúng ta bắt đầu với "Start a new Flutter project" 11 Hình 2.7 Khởi tạo project Flutter 12 - Giải nén Sdk bạn vừa tải về , sau đó trỏ đường dẫn tới file đó 13 Hình 2.8 Sau khởi tạo thành công project Flutter CHƯƠNG 3: PHÁT TRIỂN ỨNG DỤNG TRÒ CHUYỆN TRỰC TUYẾN VỚI FLUTTER 3.1 Đặt vấn đề Hiện nay, giới trẻ, đặc biệt bạn học sinh sinh viên số đối tượng doanh nghiệp, công nhân viên chức gặp khó khăn lúc cần sửa lỗi gửi tệp đến người khác thông qua Internet Dẫn đến không nâng cao suất hoạt động công việc Từ đó, gặp khó khăn việc sử dụng môi trường công nghệ để giao tiếp với Nhận thấy vấn đế vấn đề thực tế thiết yếu, nhóm chọn đề tài nghiên cứu ứng dụng vào Đồ án 3.2 Phạm vi ứng dụng Ứng dụng nhóm định hướng đến người có nhu cầu trò chuyện trực tuyến hay nói cách khác thời gian thực, tiện lợi song Internet, xem xét khắc phục lỗi cho khách hàng từ xa hay đơn giản chia thông tin Đây nhóm người thường xuyên sử dụng máy tính, laptop Do đó họ có khả cần 14 chia sẽ, giúp đỡ từ bạn bè, đồng nghiệp từ xa Ứng dụng trợ thủ đắc lực giúp họ có thể nhận trợ giúp từ xa thơng qua việc trị chuyện trực tuyến khơng tính phí Từ đó có thể nâng cao suất làm việc chia tài liệu 3.3 Các chức - Chức Đăng nhập Google - Chức Chatbox - Thông báo tin nhắn 3.4 Phân tích thiết kế Lược đồ phân cấp chức Hình 3.1 Lược đồ phân cấp chức Sơ đồ use case đặc tả use case 15 Hình 3.2 Use case tổng quát Hình 3.3 Use case Đăng nhập Hình 3.4 Use case Thông báo tin nhắn 16 Hình 3.5 Use case Chatbox 3.5 Các hình giao diện ứng dụng Hình 3.1 Màn hình đăng nhập 17 Hình 3.2 Màn hình ứng dụng 18 Hình 3.3 Giao diện chatbox 19 Hình 3.4 Cài đặt tên viết tiểu sử 20 Hình 3.5 Giao diện chọn ảnh gửi cho bạn bè 21 Tên Mô tả Màn hình Màn hình bắt đầu mở ứng Chi tiết - Chọn người mong dụng, chứa thông tin muốn để tiến hành danh sách bạn bè, tiểu sử trò chuyện bạn bè - Danh sách bạn bè load từ databass (firebase) - Có thể cài đặt nickname cho thân viết tiểu sử - Trong chatbox tùy chọn gửi ảnh cho bạn bè - Nhận thông báo tin nhắn từ trạng thái - Đăng nhập tài khoản Google 22 CHƯƠNG 4: KẾT LUẬN 4.1 Kết thu - Căn vận dụng Dart Flutter vào việc phát triển ứng dụng di động - Sử dụng Firebase làm sở liệu - Nắm nhu cầu đối tượng khách hàng chủ yếu người trẻ doanh nhân ứng dụng 4.2 Khó khăn gặp phải - Gặp khó khăn việc kết nối Firebase với ứng dụng Flutter - Khó khăn việc chuyển đổi bảng CSDL thành kiểu liệu tương ứng Dart - Bố cục code khó theo dõi, khó khăn việc quản lý code, bảo trì phát triển - Yêu cầu cấu hình cao để phát triển ứng dụng, chiếm nhiều tài nguyên Debug 23 4.3 Hướng phát triển tương lai - Hoàn thiện về mặt giao diện, cải thiện tốc độ phản hồi, cung cấp trải nghiệm chạm vuốt mượt mà - Sắp xếp bố cục hợp lý hơn, mang lại trải nghiệm sử dụng đơn giản trực quan - Tổ chức quản lý Cơ sở liệu hợp lý khoa học - Thêm tính Gọi điện trực tiếp tương lại - Vận dụng công nghệ để mang lại nhiều chức thiết thực hữu ích TÀI LIỆU THAM KHẢO Nhóm có dùng tài liệu tham khảo từ trang chủ Flutter với đó hỗ trợ tích cực lập trình viên Stackoverflow, Github,… https://pub.dev/ https://flutter.dev/docs https://stackoverflow.com/ https://github.com/NguyenTaiBoi/chat_box_app? fbclid=IwAR3YcE0Nzj1xXFoQfyQgkfsRo1ZGZwZrSwEDQmm5kpfK8loB20bQTvCeM8 24 ... TRỌNG NHÂN – 17520843 NGUYỄN TÀI BỒI – 17520284 ĐỒ ÁN ỨNG DỤNG TRÒ CHUYỆN TRỰC TUYẾN CHAT ONLINE APPLICATION KỸ SƯ/ CỬ NHÂN NGÀNH KĨ THUẬT PHẦN MỀM GIẢNG VIÊN HƯỚNG DẪN Thầy NGUYỄN TUẤN ANH TP HỒ... HỒ CHÍ MINH, 2021 LỜI CẢM ƠN Lời đầu tiên, em xin bày tỏ lòng biết ơn sâu sắc đến thầy Nguyễn Tuấn Anh – giảng viên hướng dẫn chúng em thực Đồ án Thầy đồng hành tận tình hướng dẫn cho chúng em... khắc phục khiếm khuyết Phương pháp nghiên cứu Nhận thấy nhóm đối tượng chủ yếu bạn trẻ, doanh nhân số doanh nghiệp Nhóm chúng em thực đề tài ngôn ngữ Dart, công nghệ ứng dụng Flutter Quá trình