1. Trang chủ
  2. » Tất cả

(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter

86 9 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Phát Triển Ứng Dụng Quản Lý Mua Bán Gas Trên iOS Sử Dụng Ngôn Ngữ Dart Trên Nền Tảng Flutter
Tác giả Võ Trường Duy, Vĩ Văn Sang
Người hướng dẫn ThS. Nguyễn Hữu Trung
Trường học Trường Đại học Sư phạm Kỹ thuật Thành phố Hồ Chí Minh
Chuyên ngành Công nghệ Thông tin
Thể loại đề tài tốt nghiệp
Năm xuất bản 2020
Thành phố TP Hồ Chí Minh
Định dạng
Số trang 86
Dung lượng 3,85 MB

Các công cụ chuyển đổi và chỉnh sửa cho tài liệu này

Cấu trúc

  • PHẦN 1: PHẦN MỞ ĐẦU (12)
    • 1. TÍ NH CẤP THIẾT ĐỀ TÀI (12)
    • 2. MỤC ĐÍCH CỦA ĐỀ TÀI (12)
    • 3. ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU (13)
    • 4. KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC (13)
  • PHẦN 2: PHẦN NỘI DUNG (14)
  • CHƯƠNG 1: CƠ SỞ LÝ THUYẾT (5)
    • 1. TÌ M HIỂU VỀ FLUTTER (5)
      • 1.1. Flutter là gì ? (5)
      • 1.2. Flutter Framework Model Cấu thành như thế nào? (5)
      • 1.3. So Sánh với các Cross-platform framework khác (5)
      • 1.4. Các Widget trong flutter (5)
      • 1.5. Statefullwidget và statelesswidget (5)
      • 1.6. Phương thức render của flutter (5)
    • 2. NGÔN NGỮ DART (5)
      • 2.1. Dart là gì ? (5)
      • 2.2. Các Ưu điểm của Ngôn ngữ Dart (5)
      • 2.3. Tại sao Flutter lại sử dụng Dart (5)
    • 3. GIỚI THIỆU VỀ FIREBASE (5)
      • 3.1. Giới thiệu về firebase (22)
      • 3.2. Các chức năng chính của firebase (22)
      • 3.3. Những lợi í ch của firebase (23)
  • CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU (5)
    • 1. KHẢO SÁT HIỆN TRẠNG (5)
      • 1.1. Ứng dụng Gas24h (26)
      • 1.2. Ứng dụng VipGas (27)
      • 1.3. Ứng dụng bán Lazada (28)
    • 2. XÁC ĐỊNH YÊU CẦU (5)
      • 2.1. Yêu cầu Chức năng (29)
      • 2.2. Yêu cầu phi chức năng (30)
  • CHƯƠNG 3: THIẾT KẾ PHẦN MỀM (5)
    • 1. THIẾT KẾ CƠ SỞ DỮ LIỆU (5)
      • 1.1. Mô tả công việc (5)
      • 1.2. Usecase Diagram (5)
      • 1.3. Thiết kế cở sở dữ liệu (39)
    • 2. THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ (5)
      • 2.1. Khách hàng (5)
        • 2.1.1. Màn hì nh khởi đầu, Đăng ký, Quên mật khẩu (42)
        • 2.1.2. Trang chủ khách hàng (5)
        • 2.1.3. Menu tùy chọn của khách hàng (50)
        • 2.1.4. Thông tin sản phẩm-đánh giá sản phẩm (53)
        • 2.1.5. Giỏ hàng (6)
        • 2.1.6. Thanh toán (6)
      • 2.2. Admin (6)
        • 2.2.1. Trang chủ admin (6)
        • 2.2.2. Chi tiết đơn hàng của admin (62)
        • 2.2.3. Menu tùy chọn admin (65)
  • CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ (6)
  • PHẦN 3: PHẦN KẾT LUẬN (84)
    • 1. KẾT QUẢ ĐẠT ĐƯỢC (84)
    • 2. ƯU ĐIỂM, NHƯỢC ĐIỂM (84)
    • 3. HƯỚNG PHÁT TRIỂN TRONG TƯƠNG LAI (84)
    • 5. TÀI LIỆU THAM KHẢO (85)
  • Hinh 1: ứng dụng Gas24h (0)
  • Hinh 2: ứng dụng VipGas (0)
  • Hinh 3: ứng dụng Lazada (0)
  • Hinh 4: Sơ đồ Usecase admin (0)
  • Hinh 5: 3-2. Sơ đồ Usecase khách hàng (0)
  • Hinh 6: Danh sách tài khoản (0)
  • Hinh 7: Xét các tài khoản có thể đăng nhập được vào phần mềm (0)
  • Hinh 8: Firebase khách hàng hủy đơn hàng (0)
  • Hinh 9: Firebase khi tiến hành nhận hàng (0)
  • Hinh 10: Firebase thông tin khách hàng khi đặt hàng (0)
  • Hinh 11: Firebase khách hàng bình luận về sản phẩm (0)
  • Hinh 13: Firebase admin quản lý danh sách khách hàng đặt hàng (0)
  • Hinh 12: Firebase quản lý khách hàng đã nhận, đã hủy hay trong quá trình đợi nhận hàng (0)
  • Hinh 14: Màn hình khởi đầu và đăng nhập (0)
  • Hinh 15: Giao diện đăng ký, quên mật khẩu (0)
  • Hinh 16: Giao diện trang chủ (0)
  • Hinh 17: Giao diện trang chủ với menu tùy chọn (0)
  • Hinh 18: Giao diện menu tùy chọn khách hàng (0)
  • Hinh 19: Giao diện chi tiết sản phẩm và đánh giá (0)
  • Hinh 20: Giao diện giỏ hàng (0)
  • Hinh 21: Giao diện thanh toán (0)
  • Hinh 22: Giao diện trang chủ admin (0)
  • Hinh 23: Giao diện chi tiết đơn hàng admin (0)
  • Hinh 24: Giao diện menu tùy chọn admin (0)
  • Hinh 25: Biểu đồ kết quả Test (0)

Nội dung

(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter(Đồ án tốt nghiệp) Phát triển ứng dụng quản lý mua bán gas trên IOS Sử dụng ngôn ngữ DART trên nền tảng Flutter

PHẦN MỞ ĐẦU

TÍ NH CẤP THIẾT ĐỀ TÀI

Trong thời đại 4.0, công nghệ phát triển nhanh chóng, làm thay đổi cách doanh nghiệp cạnh tranh trên thị trường Chất lượng sản phẩm ngày càng được khách hàng đặt lên hàng đầu, nhưng không còn là yếu tố duy nhất quyết định thành công Thay vào đó, trải nghiệm người dùng, sự tiện lợi và tính chất nhanh chóng của dịch vụ bán hàng trở thành những yếu tố then chốt giúp doanh nghiệp nổi bật và thu hút khách hàng.

Trong bối cảnh sự bùng nổ của các ứng dụng đặt hàng và dịch vụ trực tuyến như Uber, Grab, Lazada, cùng với ứng dụng đặt đồ ăn như Foody, Now và gần đây là BaeMin, rõ ràng xu hướng tiêu dùng đã chuyển dịch mạnh mẽ sang hình thức mua sắm và đặt dịch vụ trực tuyến Tuy nhiên, câu hỏi đặt ra là liệu các mặt hàng thiết yếu khác có cần có những ứng dụng tương tự để hỗ trợ người tiêu dùng tiện lợi hơn trong cuộc sống hàng ngày?

Người tiêu dùng hiện vẫn chưa có đủ kiến thức về các loại gas và mẫu mã trên thị trường, dẫn đến khó phân biệt giữa gas chính hãng và hàng giả, hàng kém chất lượng ngày càng gia tăng Điều này gây ra lo ngại về việc chọn lựa sản phẩm an toàn và phù hợp cho gia đình Để nâng cao nhận thức và giúp người tiêu dùng có cái nhìn khách quan hơn về loại gas đang sử dụng, nhóm chúng tôi đã phát triển một ứng dụng quản lý mua bán gas Ứng dụng này cho phép người dùng dễ dàng đặt hàng gas ngay trên điện thoại, tăng cường tính tiện lợi và minh bạch trong quá trình lựa chọn và mua sắm gas an toàn.

MỤC ĐÍCH CỦA ĐỀ TÀI

 Tìm hiểu về Flutter và ngôn ngữ Dart, Tại sao người ta nói Flutter sẽ thay đổi bộ mặt của Mobile Development

Chúng tôi phát triển phần mềm quản lý mua bán gas bằng ngôn ngữ Dart trên nền tảng Flutter, tích hợp các chức năng cơ bản như đăng ký, đăng nhập, và đăng xuất Ứng dụng còn hỗ trợ đăng nhập nhanh qua Google và Facebook, giúp người dùng truy cập tiện lợi và phổ biến hiện nay Quản lý tài khoản người dùng dễ dàng với các tính năng xem và cập nhật thông tin cá nhân, đổi mật khẩu và khôi phục mật khẩu khi cần thiết Người dùng có thể xem chi tiết các sản phẩm gas, đánh giá sản phẩm để chia sẻ trải nghiệm, cũng như thêm, xóa hoặc chỉnh sửa thông tin sản phẩm một cách linh hoạt.

11 o Cập nhật sản phẩm o Quản lý cửa hàng o Thống kê.

ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU

 Dịch vụ cơ sở dữ liệu FireBase

 Flutter và sự tiện tích của nó trong lập trình di động

 Ngôn ngữ dart, Tại sao flutter lại sử dụng ngôn ngữ dart

 Các chức năng cơ bản của một phần mềm bán hàng

KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC

 Các dùng ngôn ngữ dart trên nền tảng flutter

 Cài đặt phần mềm được trên 2 nền tảng Android và IOS

 Phần mềm quản lý Gas có tối thiểu các chức năng cơ bản của một phần mềm bán hàng

CƠ SỞ LÝ THUYẾT

TÌ M HIỂU VỀ FLUTTER

1.2 Flutter Framework Model Cấu thành như thế nào?

1.3 So Sánh với các Cross-platform framework khác

1.6 Phương thức render của flutter

NGÔN NGỮ DART

2.2 Các Ưu điểm của Ngôn ngữ Dart

2.3 Tại sao Flutter lại sử dụng Dart

KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU

XÁC ĐỊNH YÊU CẦU

3 Mô hình hóa yêu cầu

THIẾT KẾ PHẦN MỀM

THIẾT KẾ CƠ SỞ DỮ LIỆU

1.4 Thiết kế cở sở dữ liệu

THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ

2.1.1 Đăng ký, đăng nhập, Quên mật khẩu

2.1.4 Thông tin sản phẩm và đánh giá

CÀI ĐẶT VÀ KIỂM THỬ

2 Cài đặt và kiểm thử các giao diện

3.3 Hướng phát triển trong tương lai

Nhiệm vụ (Công việc dự kiến)

- Tìm hiểu về Flutter và Firebase

- Thêm ý tưởng các chức năng nâng cáo cho ứng dụng

- Thiết kế và hoàn thiện giao diện cho ứng dụng

-Hoàn thành cách màn hình hoàn chỉnh cho ứng dụng

- Thiết kế thêm và sửa chữa cơ sở dữ liệu cho ứng dụng

-Hoàn thành khung sườn cho cơ sở dữ liệu

- Hoàn thiện và sửa lỗi các chức năng của từng giao diện

-Cách chức năng của các giao diện ổn định

- Kiểm thử các chức năng và sửa lỗi

- Ứng dụng đã ổn định để hoạt động

- Bắt đầu làm báo cáo

- Hoàn thành đề cương chi tiết

- - Hoàn thành đề cương chi tiết

- Tiến hành và hoàn thiện báo cáo

- Kiểm tra lại báo cáo và ứng dụng

- -Hoàn chỉnh báo cáo và ứng dụng Ý kiến của Giáo viên hướng dẫn Ngày … tháng … năm 2020

(Ký và ghi rõ họ tên) Người viết đề cương

Mục Lục ĐỀ CƯƠNG KHÓA LUẬN TỐT NGHIỆP 2

1 TÍ NH CẤP THIẾT ĐỀ TÀI 10

2 MỤC ĐÍCH CỦA ĐỀ TÀI 10

3 ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU 11

4 KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC 11

CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 12

1.2 Flutter Framework Model Cấu thành như thế nào? 12

1.3 So Sánh với các Cross-platform framework khác 13

1.6 Phương thức render của flutter 18

2.2 Các Ưu điểm của Ngôn ngữ Dart 19

2.3 Tại sao Flutter lại sử dụng Dart 20

3.2 Các chức năng chính của firebase 20

3.3 Những lợi í ch của firebase 21

CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 24

2.2 Yêu cầu phi chức năng 28

CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 30

1 THIẾT KẾ CƠ SỞ DỮ LIỆU 30

1.3 Thiết kế cở sở dữ liệu 37

- Dưới đây là cá hình ảnh của cơ sở dữ liệu được thiết kế dựa vào Firebase 37

2 THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ 40

2.1.1 Màn hì nh khởi đầu, Đăng ký, Quên mật khẩu 40

2.1.3 Menu tùy chọn của khách hàng 48

2.1.4 Thông tin sản phẩm-đánh giá sản phẩm 51

2.2.2 Chi tiết đơn hàng của admin 60

CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 67

3 HƯỚNG PHÁT TRIỂN TRONG TƯƠNG LAI 82

Hinh 4: Sơ đồ Usecase admin 35

Hinh 5: 3-2 Sơ đồ Usecase khách hàng 36

Hinh 6: Danh sách tài khoản 37

Hinh 7: Xét các tài khoản có thể đăng nhập được vào phần mềm 37

Hinh 8: Firebase khách hàng hủy đơn hàng 38

Hinh 9: Firebase khi tiến hành nhận hàng 38

Hinh 10: Firebase thông tin khách hàng khi đặt hàng 38

Hinh 11: Firebase khách hàng bình luận về sản phẩm 39

Hinh 13: Firebase admin quản lý danh sách khách hàng đặt hàng 39

Hinh 12: Firebase quản lý khách hàng đã nhận, đã hủy hay trong quá trình đợi nhận hàng 39

Hinh 14: Màn hình khởi đầu và đăng nhập 40

Hinh 15: Giao diện đăng ký, quên mật khẩu 41

Hinh 16: Giao diện trang chủ 44

Hinh 17: Giao diện trang chủ với menu tùy chọn 45

Hinh 18: Giao diện menu tùy chọn khách hàng 48

Hinh 19: Giao diện chi tiết sản phẩm và đánh giá 51

Hinh 20: Giao diện giỏ hàng 54

Hinh 21: Giao diện thanh toán 56

Hinh 22: Giao diện trang chủ admin 58

Hinh 23: Giao diện chi tiết đơn hàng admin 61

Hinh 24: Giao diện menu tùy chọn admin 64

Hinh 25: Biểu đồ kết quả Test 81

Bảng 1: Bảng các yêu cầu chức năng nghiệp vụ của khách hàng 30

Bảng 2: Bảng các quy định/ công thức liên quan của khách hàng 32

Bảng 3: Bảng các yêu cầu các chức năng nghiệp vụ của admin 33

Bảng 4: Bảng các quy định, công thức liên quan đến chức năng của admin 34

Bảng 5: Bảng mô tả các thành phần giao diện đăng nhập, quên mật khẩu, đăng ký 42

Bảng 6: Bảng mô tả các xử lý giao diện đăng nhập, quên mật khẩu, đăng ký 43

Bảng 7: Bảng mô tả các thành phần trang chủ khách hàng 46

Bảng 8: Bảng mô tả xử lý trang chủ khách hàng 47

Bảng 9: Bảng mô tả các thành phần giao diện menu tùy chọn khách hàng 48

Bảng 10: Bảng mô tả các xử lý các thành phần giao diện menu tùy chọn khách hàng 49

Bảng 11: Bảng mô tả thành phần thông tin sản phẩm 52

Bảng 12: Bảng mô tả xử lý thông tin sản phẩm 52

Bảng 13: Bảng mô tả các thành phần giao diện giỏ hàng 54

Bảng 14:3-14: Bảng xử lý các thành phần 55

Bảng 15:3-15 Bảng mô tả màn hình thanh toán 57

Bảng 16:3-16 Bảng mô tả xử lý màn hình thanh toán 57

Bảng 17: Bảng mô tả thành phần giao diện trang chủ admin 59

Bảng 18: Bảng mô tả xử lý giao diện trang chủ của admin 60

Bảng 19: Bảng mô tả thành phần giao diện chi tiết đơn hàng admin 61

Bảng 20: Bảng mô tả xử lý giao diện chi tiết đơn hàng 62

Bảng 21: Bảng mô tả thành phần giao diện menu tùy chọn admin 65

Bảng 22: Bảng mô tả xử lý thành phần giao menu tùy chọn admin 66

Bảng 23: Bảng kiểm thử màn hình “đăng nhập” 67

Bảng 24: Bảng kiểm thử màn hình trang chủ và thông tin khách hàng 70

Bảng 25: Bảng kiểm thử màn hình trang chủ và thông tin admin 72

Bảng 26: Bảng kiểm thử màn hình Giỏ hàng 74

Bảng 27: Bảng kiểm thử “Thanh toán” 75

Bảng 28: Bảng kiểm thử mà hình đánh giá sản phẩm cảu khách hàng 76

Bảng 29: Bảng kiểm thử màn hình đánh giá chi tiết đơn hàng của khách hàng 77

Bảng 30: Bảng kết quả kiểm thử 78

1 TÍNH CẤP THIẾT ĐỀ TÀI

Trong thời đại 4.0, công nghệ ngày càng phát triển, ảnh hưởng đến mọi khía cạnh của doanh nghiệp Chất lượng sản phẩm vẫn rất quan trọng, nhưng cạnh tranh chủ yếu dựa trên trải nghiệm người dùng, sự tiện lợi và tốc độ của dịch vụ bán hàng Các doanh nghiệp ưu tiên nâng cao trải nghiệm khách hàng và tối ưu hóa quy trình cung cấp dịch vụ để tạo lợi thế cạnh tranh.

Trong bối cảnh sự bùng nổ của các ứng dụng đặt hàng và dịch vụ trực tuyến như Uber, Grab, Lazada, Foody, Now, và gần đây là BaeMin, việc mở rộng các nền tảng này để phục vụ các mặt hàng thiết yếu ngày càng trở nên thiết thực Điều đặt ra là liệu có cần thiết phát triển các ứng dụng tương tự cho các mặt hàng thiết yếu khác nhằm nâng cao tiện ích và đáp ứng nhu cầu ngày càng lớn của người tiêu dùng?

Hiện nay, người tiêu dùng chưa có đủ kiến thức về các loại gas và mẫu mã trên thị trường, đồng thời đối mặt với tình trạng gas giả và gas kém chất lượng ngày càng phổ biến Việc nâng cao nhận thức giúp người tiêu dùng có cái nhìn khách quan hơn về sản phẩm họ đang sử dụng Để giải quyết vấn đề này, nhóm chúng tôi đã phát triển một ứng dụng quản lý mua bán gas, cho phép người dùng dễ dàng đặt hàng gas ngay trên điện thoại của mình Ứng dụng không chỉ giúp người tiêu dùng thuận tiện trong việc mua sắm mà còn góp phần nâng cao chất lượng dịch vụ và đảm bảo an toàn khi sử dụng gas.

2 MỤC ĐÍCH CỦA ĐỀ TÀI

 Tìm hiểu về Flutter và ngôn ngữ Dart, Tại sao người ta nói Flutter sẽ thay đổi bộ mặt của Mobile Development

Chúng tôi phát triển phần mềm quản lý mua bán gas với các chức năng cơ bản bằng ngôn ngữ Dart trên nền tảng Flutter, giúp người dùng dễ dàng đăng ký, đăng nhập và đăng xuất Ứng dụng hỗ trợ đăng nhập nhanh qua các tài khoản Google và Facebook phổ biến hiện nay, mang lại trải nghiệm thuận tiện Người dùng có thể quản lý tài khoản của mình bằng cách xem và cập nhật thông tin, đổi mật khẩu hoặc khôi phục mật khẩu dễ dàng Ngoài ra, ứng dụng cung cấp chức năng xem chi tiết sản phẩm, đánh giá sản phẩm và quản lý danh mục sản phẩm bao gồm thêm, xóa và chỉnh sửa một cách linh hoạt.

11 o Cập nhật sản phẩm o Quản lý cửa hàng o Thống kê

3 ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU

 Dịch vụ cơ sở dữ liệu FireBase

 Flutter và sự tiện tích của nó trong lập trình di động

 Ngôn ngữ dart, Tại sao flutter lại sử dụng ngôn ngữ dart

 Các chức năng cơ bản của một phần mềm bán hàng

4 KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC

 Các dùng ngôn ngữ dart trên nền tảng flutter

 Cài đặt phần mềm được trên 2 nền tảng Android và IOS

 Phần mềm quản lý Gas có tối thiểu các chức năng cơ bản của một phần mềm bán hàng

PHẦN 2: PHẦN NỘI DUNG CHƯƠNG 1: CƠ SỞ LÝ THUYẾT

Flutter là framework UI di động của Google giúp tạo ra các giao diện chất lượng cao trên iOS và Android một cách nhanh chóng Với khả năng hoạt động trên nền tảng đa dạng, Flutter tận dụng các mã code sẵn có, hỗ trợ lập trình viên và tổ chức phát triển ứng dụng hiệu quả Nhờ đó, phát triển ứng dụng di động trở nên dễ dàng và tiết kiệm thời gian hơn.

Flutter được phát triển nhằm giải quyết bài toán thường gặp trong mobile là Fast

Development và Native Performance Nếu như React Native chỉ đảm bảo Fast Development và code native thuần chỉ đảm bảo Native Performance thì Flutter làm được cả 2 điều trên

1.2 Flutter Framework Model Cấu thành như thế nào?

Flutter được chia thành hai tầng, trong đó tầng trên sử dụng ngôn ngữ Dart để xây dựng mã nguồn cho ứng dụng Flutter Các đoạn mã này cho phép lập trình viên dễ dàng thay đổi và chỉnh sửa, giúp tùy chỉnh ứng dụng theo mong muốn của người phát triển Việc sử dụng Dart trong Flutter mang lại tính linh hoạt cao, giúp tạo ra các ứng dụng tùy chỉnh, tối ưu và dễ bảo trì.

Tầng Application của Flutter cho phép lập trình viên thay đổi mã nguồn ứng dụng tại thời điểm biên dịch, giúp tối ưu hóa quá trình phát triển Ở phía dưới, tầng thứ hai được xây dựng bằng C++, đóng vai trò quan trọng trong hiệu suất của framework Tầng Shell chứa các công cụ hỗ trợ giúp ứng dụng Flutter hoạt động trơn tru trong quá trình chạy, nổi bật nhất là máy ảo Dart VM Máy ảo Dart VM là một ứng dụng chạy song song với mã nguồn chính của ứng dụng, đảm nhận các nhiệm vụ quan trọng như quản lý bộ nhớ, tối ưu hóa hiệu suất và thực thi mã Dart một cách linh hoạt.

 Làm ứng dụng trung gian giữa mã nguồn được viết bởi Dart và thiết bị phần cứng (hoặc phần mềm nằm ngoài ứng dụng)

 Thông dịch các đoạn mã Dart theo phương thức JIT (Just in time - mã nguồn chỉ được thông dịch khi được gọi đến) hoặc AOT (Ahead of Time – Mã)

Thực thi các đoạn mã đã được thông dịch hoặc biên dịch giúp đảm bảo hiệu suất và tính ổn định của hệ thống Ngoài ra, runtime system còn cung cấp các thành phần quan trọng như garbage collector, giúp quản lý bộ nhớ hiệu quả, cùng với các thư viện cần thiết của ngôn ngữ lập trình để hỗ trợ quá trình chạy mã một cách tối ưu.

1.3 So Sánh với các Cross-platform framework khác

Để chạy ứng dụng trên các thiết bị thông thường, hai thành phần chính cần được quan tâm: lớp Application và lớp Platform Lớp Application chứa mã nguồn do lập trình viên viết cùng các công cụ hỗ trợ quản lý hoạt động của ứng dụng Trong khi đó, lớp Platform đề cập đến hệ điều hành hoặc các ứng dụng trung gian giúp kết nối giữa ứng dụng của lập trình viên và thiết bị Trong phát triển ứng dụng di động, lớp Platform được phân chia thành ba thành phần chính để đảm bảo khả năng tương thích và hiệu quả hoạt động của ứng dụng trên nhiều thiết bị khác nhau.

Dịch vụ trên thiết bị bao gồm các ứng dụng mặc định được cài đặt có nhiệm vụ quản lý giao tiếp giữa các ứng dụng nội bộ, cung cấp thông tin thiết bị cho ứng dụng và thực thi các yêu cầu điều khiển thiết bị như định vị, camera, cảm biến.

Canvas/Events là các ứng dụng giúp hiển thị giao diện trên màn hình hoặc thiết bị trình chiếu đồng thời nhận diện các sự kiện xuất hiện trên các giao diện này Đây bao gồm các tương tác của người dùng và các sự kiện từ các hiệu ứng hoạt ảnh, góp phần nâng cao trải nghiệm người dùng và tối ưu hóa quá trình trình diễn nội dung.

OEM Widgets là các thành phần phụ được xây dựng dựa trên sự hợp tác chặt chẽ giữa các nhà cung cấp thiết bị như HTC và các đơn vị phát hành thiết bị như NTT Docomo, nhằm đảm bảo tính thống nhất trong quy chuẩn chung cho các giao diện người dùng (UI) sử dụng trong các nền tảng khác nhau Quy chuẩn này giúp tạo ra một bộ tiêu chuẩn nhất quán, từ đó nâng cao trải nghiệm người dùng và đảm bảo tính tương thích giữa các thiết bị và hệ thống Tuy nhiên, việc tuân thủ quy chuẩn này cũng đặt ra một số giới hạn nhất định đối với khả năng tùy chỉnh và phát triển UI, điều này sẽ được đề cập chi tiết hơn trong phần sau của bài viết.

Trong bài viết này, chúng tôi sẽ so sánh thành phần kiến trúc của lớp Application và cách lớp này giao tiếp với lớp Platform của Flutter Như đã đề cập trước đó, tầng Application của Flutter đóng vai trò cung cấp kiến trúc cho một ứng dụng, giúp tạo ra nền tảng vững chắc để xây dựng các chức năng và tương tác và tích hợp hiệu quả với lớp Platform để đảm bảo hoạt động mượt mà của ứng dụng.

Flutter sử dụng mã nguồn cross-compile thành mã native dựa trên máy ảo Dart VM, giúp tối ưu hiệu suất và linh hoạt trong phát triển ứng dụng Trong khi đó, các ứng dụng Hybrid sử dụng WebView để hiển thị giao diện bằng HTML/CSS và sử dụng mã JavaScript để điều khiển UI, nhưng điều này yêu cầu module trung gian gọi là Bridge để giao tiếp với các dịch vụ và phần cứng của hệ thống, gây tăng kích thước ứng dụng Phiên bản WebNative hoặc Cross-compiled không sử dụng WebView mà thay vào đó, module Bridge thực hiện toàn bộ các hành vi trung gian giữa ứng dụng và lớp Shell, cho phép sử dụng mã nguồn không bị giới hạn bởi JavaScript, bao gồm cả mã native hoặc non-native Flutter cho phép lập trình viên kiểm soát từng pixel trên màn hình mà không bị giới hạn bởi các OEM Widgets; trong khi đó, các ứng dụng Hybrid và WebNative phụ thuộc nhiều vào WebView và chuẩn của OEM Widgets, ảnh hưởng đến khả năng tùy biến và hiệu suất của ứng dụng.

Cupertino (cho iOS) Bạn cũng có thể quay trờ về với Flat Design thông qua một số thư viện trôi nổi trên thị trường

Trong Flutter, mọi thứ đều là Widgets vậy Widget là gì? Chúng ta xét qua thử một đoạn code mẫu bên dưới

Trong Flutter, hai lớp quan trọng nhất là Widget và Element, với Widget chịu trách nhiệm xây dựng cấu trúc của cây chuẩn đoán (Diagnosticable Tree) – một dạng cấu trúc dữ liệu dạng cây giúp định nghĩa giao diện trong ứng dụng Flutter, còn Element quản lý trạng thái của từng Widget trên cây đó Tư duy của Flutter tương tự như một ứng dụng web toàn diện, khi tất cả mọi thứ được vẽ lên một không gian duy nhất gọi là canvas Khi dữ liệu thay đổi, chẳng hạn như chuyển màn hình hoặc cập nhật thông tin, Flutter sẽ xóa các Widget cũ và vẽ lại các Widget mới, giúp quản lý giao diện mượt mà và linh hoạt hơn Thay vì phải sử dụng các khái niệm như StoryBoard của iOS hoặc Activity của Android, Flutter gom tất cả các yếu tố giao diện vào một khái niệm duy nhất là Widget, đồng thời khuyến khích lập trình viên quản lý trạng thái của Widget theo cách thủ công Điều đặc biệt trong Flutter là ngôn ngữ Dart, dựa trên mô hình Component, cho phép điều chỉnh trạng thái của Widget như kích thước hoặc vị trí bằng cách bọc Widget đó trong các Widget chuyên biệt, thay vì thay đổi trực tiếp trong Widget hiện tại, điều này tăng tính linh hoạt và khả năng mở rộng của ứng dụng.

PHẦN KẾT LUẬN

Ngày đăng: 14/02/2023, 11:24

🧩 Sản phẩm bạn có thể quan tâm

w