ĐỒ ÁN CƠ SỞ ĐỀ TÀI XÂY DỰNG ỨNG DỤNG ĐỌC BÁO

ĐẠI HỌC ĐÀ NẴNG KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG - - ĐỒ ÁN CƠ SỞ ĐỀ TÀI XÂY DỰNG ỨNG DỤNG ĐỌC BÁO Giảng Viên Hướng Dẫn: TS Nguyễn Đức Hiển Sinh Viên Thực Hiện: Phạm Tấn Trung 18IT2 Đà Nẵng, tháng năm 2020 Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển ĐẠI HỌC ĐÀ NẴNG KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG ĐỒ ÁN CƠ SỞ ĐỀ TÀI XÂY DỰNG ỨNG DỤNG ĐỌC BÁO Đà Nẵng, tháng năm 2020 Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển LỜI CẢM ƠN Sau thời gian tìm hiểu đề tài: “Xây dựng ứng dụng đọc báo Android”, em hoàn thành tiến độ dự kiến Để đạt kết quả, em nỗ lực thực hiện đồng thời nhận sự giúp đỡ thầy cô bạn bè Em xin chân thành cảm ơn giáo viên hướng dẫn: TS Nguyễn Đức Hiển tận tình giúp đỡ em hoàn thành dự án lần Em xin chân thành cảm ơn thầy cô ban lãnh đạo trường Đại học Công nghệ Thông tin Truyền thông Việt-Hàn nhiệt tình giảng dạy truyền đạt kiến thức để hỗ trợ em trình thực hiện đề tài Trong q trình thực hiện hồn thành đề tài khơng thể tránh khỏi thiếu sót, em mong nhận sự đóng góp ý kiến từ thầy cô Em xin chân thành cảm ơn Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển MỞ ĐẦU Ngày nay, ứng dụng công nghệ thông tin việc tin học hóa xem yếu tố mang tính định hoạt động phủ, tổ chức, cơng ty, đóng vai trị quan trọng, tạo bước đột phá mạnh mẽ Việc tạo phát triển ứng dụng điện thoại để phục vụ cho nhu cầu riêng tổ chức, công ty chí cá nhân, ngày nay, khơng lấy làm xa lạ Với vài thao tác đơn giản, người tải cài đặt điện thoại ứng dụng liên quan đến lĩnh vực mà quan tâm, là: âm nhạc, tin tức, video, mạng xã hội, giáo dục, gia đình, nấu ăn ….v.v Đối với cơng ty, doanh nghiệp việc tạo phát triển ứng dụng điện thoại thông minh điều cần thiết để phát triển Thông qua ứng dụng này, thông tin họ sản phẩm, dịch vụ mới công ty đến với người quan tâm, đến với khách hàng họ cách nhanh chóng kịp thời, tránh phiền hà mà phương thức giao tiếp truyền thống thường gặp phải Bắt nguồn với ý tưởng này, với gợi ý thầy Nguyễn Đức Hiển, chúng em thực hiện đồ án: “XÂY DỰNG ỨNG DỤNG ĐỌC BÁO” Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển MỤC LỤC Trang Chương Giới thiệu 1.1 Tên dự án 1.2 Sinh viên thực 1.3 Bối cảnh thực hiện: 1.4 Mục tiêu dự án 1.5 Phương pháp thực hiện: 1.6 Kế hoạch thực dự án Chương Nghiên Cứu Thiết Kế .2 2.1 Ngôn ngữ, công cụ lập trình sử dụng: 2.1.1 Android Studio: 2.1.2 Java (Android): 2.1.3 Firebase: Chương Xây dựng ứng dụng android 3.1 Mục tiêu phân tích: .3 3.2 Xây dựng: 3.2.1 Sử dụng thư viện Firebase: 3.2.2 Cấu trúc thư mục android: 3.3 Sản phẩm ứng dụng đọc báo “NewsSocial”: 3.3.1 Giao diện hình Đăng nhập – Đăng ký: 3.3.2 Giao diện chính: 3.3.3 Giao diện tìm kiếm người dùng: 3.3.4 Giao diện thông tin người dùng: 3.3.5 Giao diện sửa đổi thông tin tài khoản: 10 Chương Hướng dẫn sử dụng 11 4.1 Hướng dẫn sử dụng chức đăng ký tài khoản: .11 4.2 Hướng dẫn sử dụng chức thêm, xóa sửa đổi viết: 12 4.2.1 Thêm viết: 12 4.2.2 Sửa đổi xóa viết: 12 4.3 Hướng dẫn sử dụng chức tìm kiếm người dùng: 14 4.4 Hướng dẫn sử dụng chức bình luận: 14 4.4.1 Thêm bình luận: 14 4.4.2 Xóa bình luận: 16 4.5 Cập nhật sửa đổi thông tin: 17 Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển Chương Giới thiệu 1.1 Tên dự án ỨNG DỤNG ĐỌC BÁO TRÊN ANDROID 1.2 Sinh viên thực - Phạm Tấn Trung Lớp: 18IT2 Mã sinh viên: 18IT112 1.3 Bối cảnh thực hiện: Cùng với sự phát triển khơng ngừng kỹ thuật máy tính mạng internet, công nghệ thông tin ngày chinh phục đỉnh cao Mạng internet sản phẩm có giá trị lớn lao ngày trở nên công cụ thiếu lĩnh vực sống Với internet, thực hiện nhiều công việc với tốc độ nhanh chi phí thấp nhiều so với cách thức truyền thống Chính điều này, thúc đầy sự khai sinh phát triển thương mại điện tử phủ điện từ khắp thể giới, làm biến đối đáng kể mặt văn hóa, nâng cao chẩt lượng sống người Trong năm gần đây, CNTT phát triển mạnh nên việc ứng dụng tin học đời sống ngày quan tâm Dự án em đề xuất ứng dụng tin tức, cung cấp cho người dung thơng tin tình hình đời sống, xã hội hiện 1.4 Mục tiêu dự án Xây dựng ứng dụng đơn giản, dễ nhìn, cung cấp thơng tin miễn phí lĩnh vực đời sống xã hội ngày nhân dân 1.5 Phương pháp thực hiện: Tìm hiểu ứng dụng có sẵn Phân tích giao diện, chức bật Từ đó, dựa vào chức lên kế hoạch từ đầu, đúc kết, đưa chức năng, yêu cầu hoàn chỉnh cho ứng dụng Sử dụng sử dụng Firebase – Một tảng để phát triển ứng dụng di động trang web, bao gồm API đơn giản mạnh mẽ mà không cần backend hay server Sử dụng phần mềm Android Studio để tạo ứng dụng hoàn chỉnh Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 1.6 Kế hoạch thực dự án Thời gian Tuần thứ (Từ ngày 11/5 đến ngày 17/5) Tuần thứ hai (Từ ngày 18/5 đến ngày 24/5 ) Tuần thứ ba (Từ ngày25/5 đến ngày 31/5 ) Tuần thứ tư (Từ ngày 1/6 đến ngày 7/6 ) Tuần thứ năm (Từ ngày 8/6 đến ngày 14/6 ) Nội dung thực Hoàn thành đề cương chi tiết Phân tích thiết kế hệ thống Xây dựng sở liệu Xây dựng giao diện ứng dụng Hoàn chỉnh chức Tiếp tục hoàn thiện giao diện Cũng cố điều chỉnh chức phù hợp Tuần thứ sáu (Từ ngày 15/6 đến ngày Kiểm tra, sửa lỗi 21/6 ) Tuần thứ bảy (Từ ngày 22/6 đến ngày Viết báo cáo, slide tiếng Anh 28/6 ) Chương Nghiên Cứu Thiết Kế 2.1 Ngơn ngữ, cơng cụ lập trình sử dụng: 2.1.1 Android Studio: Android Studio phầm mềm bao gồm công cụ khác dùng để phát triển ứng dụng chạy thiết bị sử dụng hệ điều hành Android loại điện thoại Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển smartphone, tablet Android Studio đóng gói với code editor, debugger, công cụ performance tool hệ thống build/deploy (trong có trình giả lập simulator để giả lập môi trường thiết bị điện thoại tablet máy tính) cho phép lập trình viên nhanh chóng phát triển ứng dụng từ đơn giản tới phức tạp 2.1.2 Java (Android): Java ngôn ngữ thức để phát triển Android Đây ngơn ngữ có sự hỗ trợ nhiều từ Google Nó ngôn ngữ mà hầu hết ứng dụng Play Store xây dựng Nó ngơn ngữ thức Android Hệ điều hành Android Google sử dụng Java sở cho tất cả ứng dụng Android 2.1.3 Firebase: Firebase tảng để phát triển ứng dụng di động trang web, bao gồm API đơn giản mạnh mẽ mà không cần backend hay server Chương Xây dựng ứng dụng android 3.1 Mục tiêu phân tích: - Xây dựng sản phẩm ứng dụng android hoàn chỉnh cho người dùng Sản phẩm dành cho người Ứng dụng có nhiều chức đa dạng dễ sử dụng 3.2 Xây dựng: 3.2.1 Sử dụng thư viện Firebase:  Cài đặt Firebase cho dự án android: - Đưa implementation sau vào file build.gradle (app) project: - Các implementation bao gồm: • Thư viện Firebase Auth • Thư viện Firebase Database • Thư viện Firebase Storage  Tạo model nhận,xử lí lưu trữ thơng tin trả về: - User Model: Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển - Post Model: - Comment Model: Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 3.2.2 Cấu trúc thư mục android: 3.2.2.1 Các Activity (10 Activities): - Màn hình bắt đầu: Activity_Start Đăng nhập: Activity_Login Đăng ký: Activity_Register Màn hình chính: Activity_Main Màn hình trang chủ: Fragment_Home Tìm kiếm người dùng: Fragment_Search Chi tiết viết: PostItem Thêm viết: PostActivity Thông tin người dùng: Fragment_Profile Sửa thông tin người dùng: Activity_Edit_Profile 3.2.2.2 Adapter package (12 Adapters): - Chứa lớp adapter (Adapter Class) Recycler View: Bao gồm: o User – Danh sách người dùng o Comment - Danh sách comment o Post – Danh sách viết 3.2.2.3 Fragment package (4 Fragments): - Các Fragment hỗ trợ cho Bottom Navigation (Thanh điều hướng dưới) MainActivity (HomeFragment, PostDetailFragment, SearchFragment ProfileFragment) 3.2.2.4 Model package (3 Models): - Các model chịu trách nhiệm lưu trữ thơng tin, xử lí thơng tin trả đưa lên Một số model như:  User: Thơng tin người dùng  Comment: Thông tin liệu bình luận  Post: Lưu trữ thơng tin viết Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 3.2.2.5 Thư mục resources: • Drawble: hình ảnh, icon cho giao diện • Layout folder: chứa activity, item cho recyclerview • Menu folder: chứa fragment • Values folder: giá trị màu sắc biến string lưu trữ 3.3 Sản phẩm ứng dụng đọc báo “NewsSocial”: - - 3.3.1 Giao diện hình Đăng nhập – Đăng ký: Ở giao diện đăng nhập, người dùng cần nhập vào email mật tài khoản họ có tài khoản, hệ thống kiểm tra xem tài khoản mật có hợp lệ hay khơng, hợp lệ chuyển vào hình chính, thất bại in thơng báo Trong trường hợp người dùng chưa có tài khoản hệ thống, cần nhấp vào nút “Chưa có tài khoản đăng ký ngay” chuyển đến giao diện đăng ký tài khoản Tại người dùng cần nhập điền đầy đủ thông tin cần thiết chọn đăng ký Hệ thống thông báo thành cơng hay khơng, thành cơng chuyển đến giao diện đăng nhập để đăng nhập lại, thất bại hệ thống đưa thơng báo Hình 3-1 Android app - Giao diện đăng nhập đăng ký Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 3.3.2 Giao diện chính: Hình 3-2 Android app - Giao diện hình - Giao diện bao gồm Fragment HomeFragment, PostDetailFragment, SearchFragment ProfileFragment Giao diện HomeFragment chứa recycler view viết đăng lên người dùng Người dùng nhấp chọn vào viết để xem chi tiết Giao diện PostDetailFragment giao diện để người dung đăng viết Giao diện SearchFragment chứa recyclerview danh sách người người tìm kiếm Giao diện ProfileFragment giao diện thơng tin cá nhân người dùng Có thể thay đổi thơng tin như: Tên đăng nhập, tên đầy đủ tiểu sử người dùng Ngồi ra, cịn chứa recyclerview viết viết danh sách “Danh sách lưu” Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 3.3.3 Giao diện tìm kiếm người dùng: Hình 3-3 Android app - Giao diện tìm kiếm người dùng - Người dùng nhấp vào icon tìm kiếm cơng cụ tiến hành nhập vào gợi ý tìm kiếm, hệ thống tự động nhận diện hiển thị kết quả Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển - 3.3.4 Giao diện thông tin người dùng: Ở giao diện người dùng xem thơng tin chi tiết Thay đổi thơng tin cá nhân Đăng xuất Hình 3-4 Android app - Giao diện người dùng Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 3.3.5 - Giao diện sửa đổi thông tin tài khoản: Người dùng nhấp vào mục thông tin tiến hành thay đổi mong muốn chọn cập nhật Hình 3-5 Android app - Giao diện sửa đổi thông tin Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển Chương Hướng dẫn sử dụng 4.1 Hướng dẫn sử dụng chức đăng ký tài khoản: Hình 4-6 Hướng dẫn sử dụng chức đăng ký tài khoản - Ở giao diện Bắt đầu người dùng nhấp vào nút “Đăng ký” để chuyển đến giao diện đăng ký Tại đây, tiến hành nhập vào đầy đủ thông tin cần thiết Sau nhập thơng tin nhấp vào nút “Đăng ký” đăng ký thành cơng người dùng chuyển hướng giao diện trang chủ ứng dụng mà không cần phải thông qua bước đăng nhập Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 4.2 Hướng dẫn sử dụng chức thêm, xóa sửa đổi viết: - 4.2.1 Thêm viết: Tại giao diện hình chính, ta nhấn vào biểu tượng hình bên dưới Lúc này, ta điều hướng qua giao diện thêm viết Tại ta tiến hành chọn ảnh mơ tả sau tiến hành them nội dung viết Sau hoàn thành bước nhập, ta nhấp chọn “Đăng bài” Hình 4-7 Hướng dẫn sử dụng - thêm viết 4.2.2 Sửa đổi xóa viết: - Lưu ý: sửa đổi xóa viết Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển - Để sửa đổi xóa viết, giao diện viết đó, ta nhấp vào biểu tượng dấu chấm phía bên phải, ta chuyển đổi qua giao diện sửa đổi công thức Sau xong, ta nhấp chọn cập nhật để lưu thay đổi nhấp chọn hủy để hủy bỏ Hình 4-8 Hướng dẫn sử dụng - Sửa đổi , xóa viết Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 4.3 Hướng dẫn sử dụng chức tìm kiếm người dùng: Hình 4-9 Hướng dẫn sử dụng chức tìm kiếm người dùng - Ở giao diện MainActivity nhấp vào biểu tượng tìm kiếm hình trên, chuyển tiếp đến giao diện tìm kiếm Gõ tên người dung bạn muốn tìm kiếm 4.4 Hướng dẫn sử dụng chức bình luận: - 4.4.1 Thêm bình luận: Để thêm bình luận, nhấn chọn vào biểu tượng hình bên dưới Thêm bình luận vào khung vào nhận chọn nút “Đăng” Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển Hình 4-10 Hướng dẫn sử dụng - Thêm bình luận Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 4.4.2 Xóa bình luận: Hình 4-11 Hướng dẫn sử dụng - xóa bình luận - Ấn giữ vào bình luận muốn xóa, hộp thoại xóa hiện nhấn CĨ để xóa bình luận KHƠNG để hủy Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển 4.5 Cập nhật sửa đổi thông tin: - Giống đổi mật khẩu, lúc menu xuất hiện ta nhấp chọn “Chỉnh sửa trang cá nhân”, sau ta chuyển qua giao diện sửa đổi thơng tin Tại ta sửa đổi thông tin xuất hiện giao diện : Ảnh đại diện, tên đầy đủ, tên đăng nhập, tiểu sử Sau hoàn thành thay đổi ta nhấn vào nút “Lưu” để cập nhật thông tin cho tài khoản - Hình 4-12 Hướng dẫn sử dụng - Sửa đổi thông tin Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển KẾT LUẬN - Kết quả đạt được: Xây dựng thành công ứng dụng đọc báo hệ điều hành Android với số chức đơn giản Giao diện dễ nhìn Ứng dụng dễ sử dụng - Hướng phát triển: Tiếp tục phát triển ứng dụng dựa chức có sẵn, thu thập ý kiến người dùng, Ngày hoàn thiện phục vụ chon hu cầu người dùng Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển ... THÔNG ĐỒ ÁN CƠ SỞ ĐỀ TÀI XÂY DỰNG ỨNG DỤNG ĐỌC BÁO Đà Nẵng, tháng năm 2020 Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển LỜI CẢM ƠN Sau thời gian tìm hiểu đề tài: ? ?Xây dựng ứng dụng đọc báo... dựng ứng dụng android 3.1 Mục tiêu phân tích: - Xây dựng sản phẩm ứng dụng android hoàn chỉnh cho người dùng Sản phẩm dành cho người Ứng dụng có nhiều chức đa dạng dễ sử dụng 3.2 Xây dựng: ... thông tin cho tài khoản - Hình 4-12 Hướng dẫn sử dụng - Sửa đổi thông tin Ứng dụng đọc báo NewsSocial TS.Nguyễn Đức Hiển KẾT LUẬN - Kết quả đạt được: Xây dựng thành công ứng dụng đọc báo hệ