ĐỒ ÁN CƠ SỞ 3 Đề tài: Xây dựng ứng dụng trò chuyện trực tuyến android sử dụng FireBase . Th.S.PHẠM HỒ TRỌNG NGUYÊN

Đề tài: Xây dựng ứng dụng trò chuyện trực tuyến android sử dụng FireBase Sinh viên thực : ÔNG BỬU KHÁNH Giảng viên hướng dẫn : Th.S PHẠM HỒ TRỌNG NGUYÊN Lớp : 18IT5 Đà nẵng, tháng năm 2020 Đồ án sở 3: App chat android firebase MỤC LỤC IT279 – Android – 2020-2021… LỜI MỞ ĐẦU CHƯƠNG 1: MÔ TẢ YÊU CẦU 1.1 Mơ tả u cầu tốn 1.2 Biểu đồ use case CHƯƠNG 2: THIẾT KẾ CHI TIẾT 2.1 Thiết kế lớp 2.1.1 Biểu đồ lớp 2.1.2.Thiết kế chi tiết lớp mơ hình hướng đối tượng MVC 2.2 Thiết kế sở liệu / cấu trúc liệu 10 CHƯƠNG 3: CHƯƠNG TRÌNH MINH HOẠ … 11 3.1 Xây dựng chương trình 12 3.2 Kiểm thử đơn vị 12 3.3 Kết chương trình 12 CHƯƠNG 4: KẾT LUẬN VÀ TỰ ĐÁNH GIÁ 14 4.1 Kết luận 14 4.2 Kế hoạch làm việc 14 Tổng kết 15 Tài liệu tham khảo 15 Phụ lục 16 Danh mục hình ảnh sử dụng 16 Danh mục bảng sử dụng 16 Ông Bửu Khánh – 18IT5-18IT279-VKU Đồ án sở 3: App chat android firebase LỜI MỞ ĐẦU Trong năm gần đây, năm 2010 Cơn vũ bão smart phone tràn ngập nước ta Ai có smart phone Smart phone điện thoại thơng minh tích hợp tảng hệ điều hành di động với nhiều tính hỗ trợ tiên tiến điện toán kết nối dựa tảng điện thoại di động thông thường Ban đầu điện thoại thông minh bao gồm tính điện thoại di động thơng thường kết hợp với thiết bị phổ biến khác PDA, thiết bị điện tử cầm tay, máy ảnh kỹ thuật số, hệ thống định vị toàn cầu GPS Điện thoại thông minh ngày bao gồm tất chức laptop duyệt web, Wi-Fi, ứng dụng bên thứ di động phụ kiện kèm cho máy Việc mua dùng smart phone tiện lợi thay hồn tồn máy tính bình thường Ngồi việc cịn cơng cụ để kết nối người với với chức điện thoại thông thường dùng ứng dụng bên thứ Mặc dù ứng dụng để kết nối người Mạng xã hội, Chát trực tuyến tiện ích đem lại hại nhiều thời gian vào Mạng xã hội… Chính nhân việc học mơn lập trình di động em lựa chọn đề tài “ Viết ứng dụng chat sử dụng google API Firebase” Sử dụng ngơn ngữ lập trình hướng đối tượng Java hệ điều hành Android Để hoàn thành tập lớn này, em xin gửi lời cảm ơn chân thành đến thầy giáo hướng dẫn đề tài Thầy Ths.Phạm Hồ Trọng Nguyên, Giảng viên Khoa Công nghệ Thông tin Trường Đại học Công nghệ thông tin Việt Hàn - hết lòng giúp đỡ, hướng dẫn, dạy tận tình để em hồn thành đề tài Đà Nẵng, tháng năm 2020 Sinh viên Ông Bửu Khánh Ông Bửu Khánh – 18IT5-18IT279-VKU Đồ án sở 3: App chat android firebase CHƯƠNG 1: MÔ TẢ U CẦU 1.1 Mơ tả u cầu tốn - Về bản, tổng qt hóa tốn app cần có: + Giao diện đăng ký tài khoản, đăng nhập tài khoản + Giao diện hiển thị danh sách bạn bè, danh sách trò chuyện, danh sách user + Giao diện thị đoạn chát user với - Về chức app : + Chát/ gửi tin nhắn user thông qua internet 1.2 Biểu đồ use case Hình 1: Biểu đồ use case Ơng Bửu Khánh – 18IT5-18IT279-VKU Đồ án sở 3: App chat android firebase CHƯƠNG 2: THIẾT KẾ CHI TIẾT 2.1 Thiết kế lớp 2.1.1 Biểu đồ lớp Ông Bửu Khánh – 18IT5-18IT279-VKU Đồ án sở 3: App chat android firebase Hình 3: Biểu đồ Activity signup/login Hình 4: Biểu đồ Activity Ông Bửu Khánh – 18IT5-18IT279-VKU Đồ án sở 3: App chat android firebase 2.1.2 Thiết kế chi tiết lớp mơ hình hướng đối tượng MVC - Thiết kế chi tiết cho lớp: Các thuộc tính, phương thức, mối quan hệ, ràng buộc - Bài toán thiết kế theo mơ hình MVC với cấu trúc sau: - Thư mục app chưa folder sau: Manifests : Chứa file AndroidManifest.xml (Phân quyền, chạy app, quản lý…) - Thự mục java chứa mã nguồn chủ yếu package sau: Gói Model gồm class: Chat User Gói com.ongbuukhanh.chatapp1: Gồm class Activity Như mainActivity, loginActivity, startActivity, mainActivity, registerActivity, resetPasswordActivity, messageActivity Các Activity chủ yếu thực hành động, function app Và Activity để app hoạt động Gói Adapter gồm class là: MessageAdapter, UserAdapter Gói Fragment gồm class : ChatsFragment, ProfileFragment, UsersFragment Thự mục res chứa Folder giao diện, hình ảnh, style app + Drawable, mipmap: Chứa hình ảnh cho app + Layout, menu: Chứa giao diện hiển thị app (chính View) + values chứa thuộc tính attrs, colors, dimens, strings, styles… Thư mục assets chứa fonts: hỗ trợ ngồi Hình 5: Hình ảnh thư mục chứa gói Ơng Bửu Khánh – 18IT5-18IT279-VKU Đồ án sở 3: App chat android firebase - Sau mô tả số thuộc tính phương thức chủ yếu số lớp - Mơ tả chi tiết 2-4 lớp quan trọng Bảng 1: Mô tả chi tiết Attribute Function chính: Attribute Ý Nghĩa -msg : String - Nội dung đoạn chát -status : int - Trạng thái gửi tin nhắn -date : Date - Thời gian gửi tin nhắn -id_sender : int -id_receiver : int - Mã số người gửi nhận Function Ý Nghĩa +isSeen() : Boolean -Hiển thị trạng thái xem/ không xem tin nhắn +getSender(): int -Trả lại mã số người gửi +getStatus(): int -Trả lại trạng thái gửi +setMsg(msg: String) -Thiết lập tin nhắn +setSender(id_sender: int) -Thiết lập mã người gửi +setStatus() :boolean -Thiết lập trạng thái gửi +isSend() : boolean -Kiểm tra xem tin nhăn gửi +getUid() -Lấy id user đăng nhập +isSuccessful -Đăng nhập thành công +createUserWithEmailAndPass -Tạo tài khoản +readUser() -Hiển thị user +readChat () -Hiển thị người chat Ông Bửu Khánh – 18IT5-18IT279-VKU Đồ án sở 3: App chat android firebase +setContent(content:String) -Thiết lập nội dung đoạn chát -edtLoginUser : EditText -Thông tin đăng nhập username -edtLoginPass : EditText -Thông tin đăng nhập password #onDataChanged -edtEmail : EditText - Tạo thông tin email -edtUsername: EditText - Tạo thông tin với username để dùng -edtPassword: EditText - Tạo password dùng cho user -btnRegister -sendEmailResetPassWord() : : - Click vào tạo tài khoản - Gửi mail để làm lại password #onCreate(saved: Bundle) -signOut -Thoát app +onComplete() -Chuyển trang đăng nhập thành công -UserAdapter -Bộ chuyển đổi user -mUser - Mảng chứa user -ChatAdapter - Bộ chuyển đổi tin nhắn -txt: EditText -FirebaseDatabase.getInstance() - Cho phép sử dụng database -txt_Seen -Hiển thị text xem hay ko xem -img_on _img_off -Hiển thị trạng thái online/offline Ông Bửu Khánh – 18IT5-18IT279-VKU Đồ án sở 3: App chat android firebase #onCreate(saved: Bundle) -sendMessage() - Gửi tin nhắn 2.2 Thiết kế sở liệu / cấu trúc liệu - Thiết kế chuẩn hố CSDL Hình 6: Hình ảnh bảng sở liệu - NoteParent(“Chats”): Gồm note “message”, “receiver”,”sender” - NoteParent(“User”): “id”,”imageURL”,”search”,”status”,”username” CHƯƠNG 3: CHƯƠNG TRÌNH MINH HOẠ 3.1 Xây dựng chương trình - App có sử dụng vài thư viện hỗ trợ Android + 'com.google.firebase: firebase-analytics: 17.2.2' + 'com.google.firebase: firebase-database: 19.2.1' + 'com.google.firebase: firebase-auth: 19.3.0' + 'com.google.android.gms: play-services-auth: 18.0.0' - Trong q trình lập trình có tn thủ quy tắc lập trình hướng đối tượng Java, thiết kế layout, giao diện theo chuẩn Google Design Convension Ông Bửu Khánh – 18IT5-18IT279-VKU 10 Đồ án sở 3: App chat android firebase - Mơi trường lập trình Java, sử dụng IDE Android Studio kết hợp với Máy ảo Genymotion 3.2 Kiểm thử đơn vị Use case Người tạo Đăng nhập Ông Bửu Khánh Loại lỗi Chức Tạo tài khoản Ông Bửu Khánh Chức Liệt kê người gửi tin nhắn Ông Bửu Khánh Chức Dữ liệu kiểm thử/ bước tái tạo lỗi -Nhấn nút đăng nhập với trường hợp gõ sai tài khoản mật không nhập tất trường -Gõ email không dạng abc@gmail.com -Bấm vào phần liệt kê người gửi tin nhắn Kết thực tế Hiện lên dialog thông báo đăng nhập thất bại Thông báo lỗi email không dạng chuẩn -App ngừng hoạt động(Vì để List vào vịng lập để duyệt) -Kết kiểm thử đơn vị (unit test): Cho thấy App chạy tốt xử lý tất lỗi phát sinh 3.3 Kết chương trình: - Mơ tả số hình chức chương trình + Giao diện app + Giao diện đăng nhập để vào app sử dụng cần username password + Giao diện đăng ký tài khoản + Giao diện hiển thị danh sách bạn bè có app + Giao diện hiển thi danh sách trò chuyện với bạn bè + Giao diện thể chức app + Giao diện chát user với Ông Bửu Khánh – 18IT5-18IT279-VKU 11 Đồ án sở 3: App chat android firebase Hình 7: Giao diện chính, giao diện đăng ký, đăng nhập, verify email vào app Hình 8: Giao diện chứa danh sách chats, users, profiles Ông Bửu Khánh – 18IT5-18IT279-VKU 12 Đồ án sở 3: App chat android firebase Hình 9: Giao diện chat thay đổi ảnh đại diện google driver CHƯƠNG 4: KẾT LUẬN VÀ TỰ ĐÁNH GIÁ 4.1 Kết luận - Kết đạt : Qua trình làm tập lớn em nâng cao tinh thần, kỹ làm việc độc lập, kỹ viết báo cáo, slide, quan trọng nâng cao tư lập trình hướng đối tượng sử dụng thành thạo ngơn ngữ lập trình hướng đối tượng java - Khuyết điểm: App số tính tích hợp định vị google tìm bạn gần mà em chưa làm Một số chức hay hữu ích thêm vào app 4.2 Kế hoạch làm việc • Kế hoạch làm việc: Tuần 2: - Gặp thầy hướng dẫn, chọn chủ đề tập lớn Tuần 3: - Tìm hiểu Android môi trường phát triển Android - Cài đặt Android Studio, Android SDK hỗ trợ viết code Android Ông Bửu Khánh – 18IT5-18IT279-VKU 13 Đồ án sở 3: App chat android firebase - Cài đặt Genimotion Virtual Box hỗ trợ máy ảo Android - Tìm hiểu thành phần Android App Tuần 4: - Tìm hiểu hệ thống Layout View android : + LinearLayout, TextView, Button, Processbar, ImageView, … - Xây dựng giao diện đăng nhập, đăng ký tài khoản Tuần 5: - Tìm hiểu làm quen với sở lưu trữ điện toán đám mây Firebase - Tạo tài khoản, lập sở liệu cho app android kết nối đến với Firebase Tuần 6: - Thiết kế trang Fragment để quản lý tin nhắn bạn bè - Thiết kế ViewPager để chuyển hiệu ứng Tab - Tạo firebase database để kiểm tra đăng ký đăng nhập Tuần 7: - Thiết kế RecyclerView Adapter, TabLayout - Xử lý “Đăng nhập” Tuần 8: - Thiết kế sở liệu Firebase Tuần + 10: - Xử lý chát user xử lý giao diện hiển thị bạn chát Tuần 10- 12: - Hoàn thiện chức bản, trang giao diện - Review code, kiểm thử tìm lỗi, hồn thiện App Tuần 13: - Viết báo cáo theo đề cương chi tiết - Nộp toàn chương trình báo cáo Tuần 14: Ơng Bửu Khánh – 18IT5-18IT279-VKU 14 Đồ án sở 3: App chat android firebase - Bảo vệ tập lớn môn học - Nghe ý kiến nhận xét từ thầy hướng dẫn • Tự đánh giá thân : 90% Tổng kết Tài liệu tham khảo [1] Lập trình Android Google Firebase nguồn https://google/firebasedata.com [2] Lập trình Android Google Firebase nguồn https://google/firebaseuth.com Phụ lục Danh mục hình ảnh sử dụng Tên Hình Trang Ý Nghĩa Hình Biểu đồ usecase Hình Biêu đồ chứa gói Activity Hình Biểu đồ Activity login/sign up Hình Biểu đồ Activity Hình Hình ảnh thư mục chứa gói Hình 10 Hình ảnh bảng sở liệu Hình 12 Giao diện chính, giao diện đăng nhập, giao diện đăng ký reset password vào app Hình 13 Giao diện chứa danh sách friends, users, profiles Hình 13 Giao diện chat thay đổi ảnh đại diện, google driver Danh mục bảng sử dụng Tên Bảng Bảng Trang Ý Nghĩa Bảng mô tả chi tiết Attribute Function Ơng Bửu Khánh – 18IT5-18IT279-VKU 15 Đồ án sở 3: App chat android firebase Bảng 11 Kịch kiểm thử chương trình Ơng Bửu Khánh – 18IT5-18IT279-VKU 16