ĐỀ tài xây DỰNG ỨNG DỤNG bán HÀNG (GIÀY) SNEAKERf

ĐẠI HỌC ĐÀ NẴNG KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG - - ĐỒ ÁN CƠ SỞ ĐÊ TAI XÂY DỰNG ỨNG DỤNG BÁÁ́N HÀNG (GIÀY) - SNEAKERf Giảng Viên Hướng Dẫn: TS Võ Hùng Cường Sinh Viên Thực Hiện: Lê Văn Truyền 18IT2 Đà Nẵng, tháng năm 2020 Đồ an sở TS.Võ Hùng Cường ĐẠI HỌC ĐÀ NẴNG KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG ĐỒ ÁN CƠ SỞ ĐÊ TAI XÂY DỰNG ỨNG DỤNG BÁÁ́N HÀNG (GIÀY) - SNEAKERf Đà Nẵng, tháng năm 2020 Đồ an sở TS.Võ Hùng Cường 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, 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 Võ Hùng Cường, chúng em thựệ̣c hiệệ̣n đồồ̀ án: “XÂY DỰNG ỨNG DỤNG BÁN HÀNG (GIÀY) - SNEAKERf” Đồ an sở TS.Võ Hùng Cường MỤC Trang Chương Giới th 1.1 Tên dự án 1.2 Nhóm thực hiện: 1.3 Bối cảnh thưc hiên: 1.4 Mục tiêu dự án 1.5 Phương phap thưc hiên: 1.6 Kế hoạch thực dự án Chương Nghiên Cứu Thiêt Kê 2.1 Framework hổ trợ, ngôn ngữ công cụ 2.1.1 Firebas 2.1.2 Android 2.1.3 Java (A 2.2 Phân tích, tham khảo cac ứng dung, cac 2.2.1 Một số 2.2.2 Đuc kêt Chương Kết nốÁ́i Firebase Android Studio 3.1 Kết nốÁ́i Firebase android : 3.1.1 Mục đíc 3.1.2 Thiết lậ 3.2 Tạo Database Storage Firebase: 3.2.1 Tạo Da 3.2.2 Upload Chương Xây dựng ứÁ́ng dụng android 4.1 Mục tiêu phân tíÁ́ch: 4.2 Xây dựng: 4.2.1 Các Ac 4.3 Model package (4 Models): 4.4 Prevalent package: 4.5 Sảả̉n phẩm ứÁ́ng dụng bán giày”SNEAKE 4.5.1 Giao di 4.5.2 Giao di 4.5.3 Giao di 4.5.4 Giao di 4.5.5 Giao di 4.5.6 Giao di KẾT LUẬN Kết quảả̉ đạt Hướng phát triển TÀI LIỆU THAM KHẢO Đồ an sở TS.Võ Hùng Cường Chương Giới thiệu 1.1 Tên dự án Ứng dụng bán giày cho điệệ̣n thoại 1.2 Nhóm thực hiện: Lê Văn Truyền -18IT113 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 cang đươc quan tâm Dựệ̣ án em đề xuất ứng dụng bán hàng online bán giày , cung cấp cho người dùng thông tin loại giày cao cấp (hình ảả̉nh , mô tảả̉ , giá cảả̉ .) 1.4 Mục tiêu dự án Tạo ứng dụng đơn giảả̉n , giao diệệ̣n đẹp , dễ nhìn , cung cấp miễ phí thơng tin dịng giày cao cấp , đẹp mắt hợp thời trang Hỗ trợ tín đờồ̀ u giày có nơi đáng tin cậy để mua giày cao cấp 1.5 Phương phap thưc hiên: Tìm hiểu ứng dụng có sẵn (GOAT, MyShoes) 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 phần mềm Android Studio để tạo ứng dụng hoàn chỉnh chạy thiết bị di động dựệ̣a vào API trảả̉ từ Firebase đưa lên internet 1.6 Kế hoạch thực dự án Thời gian Tuân thư nhât (Từ ngày 13/5 đến ngày 19/5 ) Tuân thư hai (Từ ngày 19/5 đến ngày 26/5 ) Tuân thư ba (Từ ngày2526/5 đến ngày 2/5 ) Tuân thư tư (Từ ngày 2/6 đến ngày 9/6 ) Tuân thư năm (Từ ngày 9/6 đến ngày 16/6 ) Tuần thứ sáu (Từ ngày 16/6 đến ngày 23/6 ) Tuần thứ bảả̉y (Từ ngày 23/6 đến ngày 30/6 ) Tuần thứ tám (Từ ngày 30/6 đến ngày 7/7 ) Các tuần lại Chương Nghiên Cứu Thiêt Kê 2.1 Công cụ lập trình sử dụng: 2.1.1 Firebase: Firebase dịch vụ sởả̉ liệệ̣u hoạt động tảả̉ng đá mây – cloud Kèm theo hệệ̣ thống máy chủ cựệ̣c kì mạnh mữ Google Chức lag giúp người dùng lập trình ứng dụng cách đơn giảả̉n hóa thao tác vớớ́i sởả̉ liệệ̣u Cụ thể giao diệệ̣n lập trình ứng dụng API đơn giảả̉n Mục đích nhằm tăng số lượng người dùng thu lại nhiều lợi nhuận 2.1.2 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 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.3 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.2 Phân tích, tham khảo cac ứng dung, cac mô hinh mẫu: 2.2.1 Một sớÁ́ ứÁ́ng dụng có: 2.2.1.1 GOAT: Hinh Giao diện ứÁ́ng dụng GOAT  Giao diệệ̣n:  Giao diệệ̣n đẹp, bắt mắt  Dễ nhìn, rõ ràng, dễ sử dụng  Không phức tạp  Chức năng:  Xem danh sách loại giày  Tìm kiếm loại giày  Xem chi tiết mô tảả̉i giá cảả̉  Nổi bật:  Lọc danh sách tìm kiếm đa dạng  Có nhiều khuyến mãi, chương trình hấp dẫẫ̃n đa dạng 2.2.1.2 MyShoes: Hinh Giao diện ứÁ́ng dụng MyShoes  Giao diệệ̣n:  Giao diệệ̣n đẹp, bắt mắt, màu sắc nhẹ nhàng  Dễ nhìn, rõ ràng, dễ sử dụng  Khơng q phức tạp Hinh Kết nốÁ́i Realtime Database Firebase Vào menu Tools/ chọn Firbase, lúc cửa sổ hướớ́ng dẫẫ̃n cách sử Firebase hiển thị ởả̉ góc phảả̉i cửa sổ Android Studio: Hinh Kết nớÁ́i Realtime Database Firebase Trong hình trên, Firebase cung cấp nhiều công cụ, nhiên ta quan tâm tớớ́i Realtime Database thơi nha Vì ta nhấn vào Realtime Database: Hinh Kết nốÁ́i Realtime Database Firebase Lúc ta thấy nút “Save and retrieve data” hiển thị hình Bấm vào nha Trình trợ giúp cung cấp cho ta bướớ́c thao tác (bao gốm kết nối hướớ́ng dẫẫ̃n lập trình, ta dùng bướớ́c đủ rờồ̀i): Bướớ́c 1: Connect your app to firebase Bướớ́c 2: Add the Realtime Database to our app Bướớ́c 3: Configure Firebase Database Rules Bướớ́c 4: Write to your database Bướớ́c 5: Read from your database Bướớ́c 6: Optional: Configure ProGuard Bướớ́c 7: Prepare for Launch Bướớ́c 8: Next steps Hinh Kết nốÁ́i Realtime Database Firebase 3.2 Tạo Database Storage Firebase: 3.2.1 Tạo Database Gồồ̀m có liệệ̣u Admin, Cart List , Products Users Hinh Realtime Database Firebase 10 3.2.2 Upload file hình ảả̉nh lên Hinh Realtime Database Firebase Chương Xây dựng ứÁ́ng dụng android 4.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 dùng không dành cho quảả̉n trị viên thựệ̣c hiệệ̣n thao tác quảả̉n lí hệệ̣ thống Ứng dụng có nhiều chức đa dạng dễ sử dụng Quảả̉n trị viên dùng ứng dụng để đăng sửa xóa viết đăng lên Dịch vụ API để lưu trữ đồồ̀ng liệệ̣u real-time (thời gian thựệ̣c ) 4.2 Xây dựng: 4.2.1 - Các Activity (13 Activities): Đăng nhập : LoginActivity Đăng ký: RegisterActivity Màn hình chính: MainActivity Giao diệệ̣n admin : AdminActivity Admin thêm sảả̉n phẩm: AdminAddNewProductActivity Admin thêm loại giày: AdminCategoryActivity 11 - Admin xem danh sách hàng đặt: AdminViewOrderActivity Giỏ hàng : CartActivity Form xác nhận giao hàng: ConfirmFormOrderActivity Giao diệệ̣n Home: HomeActivity Xem thông tin đôi giày : ProductDetailsActivity Tìm kiếm: SearchActivity Chỉnh sửa tài khoảả̉n User: SettingActivity 4.2.2 - 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ư:  AdminOrders: Thơng tin khách hàng oder (tên, sdt, địa , email , tổng tiền )  Cart: Thơng tin hàng (Bao gờồ̀m tên , giá , số lượng )  Products: Model để lưu trữ thông tin sảả̉n phẩm  Users: Model dùng để lưu trữ thông tin người dùng (tên , sdt , mật khẩu, hình ảả̉nh địa ) 4.2.3 - Prevalent package: Kiểm tra tài khoảả̉n có tồồ̀n hay không Thựệ̣c hiệệ̣n request đến Database Firebase 4.2.4 - Model package (4 Models): ViewHolder package (3 ViewHolders): CartViewHolder: giao diệệ̣n cho mục Recycler View giỏ hàng OrderViewHolder: giao diệệ̣n cho mục Recycler View thêm vào ProductHolder: giao diệệ̣n cho mục Recycler View sảả̉n phẩm 4.2.5 Thư mục resources (res folder): Anim folder: animation (Hoạt hình động) Drawble folder: hình ảả̉nh, icon cho giao diệệ̣n Layout folder: giao diệệ̣n activity, item recycler view Menu folder: giao diệệ̣n menu Values folder: giá trị màu sắc, phong cách biến string lưu trữ 4.3 Sảả̉n phẩm ứÁ́ng dụng bán giày”SNEAKERf”: 4.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 “Đăng Ký” 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 12 Hinh Android app - Giao diện đăng nhập ,đăng ký 13 4.3.2 Giao diện Home(Home Activity): Hinh 10 Android app - Giao diện hình chíÁ́nh 14 Giao diệệ̣n Home gồồ̀m Recycleview hiệệ̣n sảả̉n phẩn nhờ đổ liệệ̣u từ Firebase Phía toolbar có chưa nút giỏ hàng , tìm kiếm, giày, cài đặt đăng xuất Người dùng nhấn vào tìm kiếm để tìm kiếm loại giày thích muốn xem thơng tin tiến hành sửa xóa nhấp vào nút cài đặt 4.3.3 Giao diện chi tiết mô tảả̉ giá cảả̉ giày : 15 Hinh 11 Android app - Giao diện chi tiết mô tảả̉ đôi giày Giao diệệ̣n mô tảả̉ chứa thông tin chi tiết tên giày , giá cảả̉ mô tảả̉ Ở dướớ́i ta thấy phầm chọn số lượng thêm vào giỏ hàng thích hủy khơng thích 16 4.3.4 Giao diện tìm kiếm tên loại giày: Hinh 12 Android app - Giao diện tìm kiếm ăn 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ảả̉ 17 4.3.5 Giao diện thông tin user: Hinh 13 Android app - Giao diện thông tin user Ở giao diệệ̣n người dùng xem thơng tin chi tiết Khi nhấp vào nút ba gạch ngang bên hiệệ̣n menu vớớ́i lựệ̣a chọn, muốn thay đổi ta tiến hành thay đổi cập nhật thông tin 18 4.3.6 Giao diện Admin Hinh 14 Android app - Giao diện đăng nhập admin Ở giao diệệ̣n bạn admin bạn chọn “Tơi Admin” tiến hành đăng nhập vào để đăng cập nhật sảả̉n phẩm mớớ́i 19 KẾT LUẬN Kết quảả̉ đạt Tạo ứng dụng hồn chỉnh sử dụng , giao diệệ̣n đơn giảả̉n dể hiểu , dễ sử dụng Hướng phát triển Hoàn thiệệ̣n mặt thẩm mỹ chức Thêm chức đa dạng 20 TÀI LIỆU THAM KHẢO 1.Tích hợp realtime database Firebase vào Android (https://viblo.asia/p/tich-hoprealtime-database-trong-firebase-vao-android-Az45bbyV5xY) Phát triển ứng dụng sởả̉ liệệ̣u thời gian thựệ̣c vớớ́i Firebase (https://duythanhcse.wordpress.com/2018/10/11/phat-trien-ung-dung-co-so-du-lieuthoi-gian-thuc-voi-firebase-phan-1/) 3.Video hương dẫẫ̃n tạo app bán hàng online (https://www.youtube.com/watch? v=LKQRyGtt72M&list=PLxefhmF0pcPlqmH_VfWneUjfuqhreUz-O&index=48) 21