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 6 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 TP.HCM
Chuyên ngành Công nghệ phần mềm
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 2,24 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

PHẦN MỞ ĐẦU

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

Trong kỷ nguyên 4.0, sự phát triển của công nghệ đã thay đổi cách doanh nghiệp cạnh tranh bằng cách tập trung vào trải nghiệm người dùng và tính tiện lợi của dịch vụ Chất lượng sản phẩm không còn là lợi thế duy nhất, mà ưu tiên hàng đầu là khả năng cung cấp dịch vụ nhanh chóng, tiện lợi và mang lại sự hài lòng cho khách hàng Những yếu tố này giúp doanh nghiệp nổi bật trong thị trường ngày càng cạnh tranh khốc liệt hiện nay.

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ành giao đồ ăn như Foody, Now và gần đây nhất là BaeMin, rõ ràng thị trường này đang phát triển mạnh mẽ Tuy nhiên, câu hỏi đặt ra là các mặt hàng thiết yếu khác thì sao; chúng ta có cần các ứng dụng tương tự để đáp ứng nhu cầu tiêu dùng hàng ngày hay không? Việc mở rộng các dịch vụ đặt hàng trực tuyến cho các mặt hàng thiết yếu có thể mang lại tiện ích lớn, giúp người tiêu dùng tiết kiệm thời gian và công sức trong việc mua sắm Do đó, xu hướng phát triển các ứng dụng này sẽ còn tiếp tục mở rộng nhằm phục vụ nhu cầu tiêu dùng ngày càng đa dạng và thuận tiện hơn.

Người tiêu dùng hiện chưa rõ về các loại gas và mẫu mã trên thị trường, đồng thời tình trạng gas giả và gas kém chất lượng ngày càng gia tăng Để bảo vệ quyền lợi và đảm bảo an toàn, người tiêu dùng cần có cái nhìn khách quan hơn về loại gas mình đang sử dụng Nhằm hỗ trợ người tiêu dùng, nhóm chúng tôi phát triển ứng dụng Quản Lý Mua Bán Gas, cho phép đặt gas dễ dàng ngay trên điện thoại, nâng cao trải nghiệm tiện lợi và an toàn khi mua sắm.

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 dựa trên nền tảng Flutter using Dart với các chức năng cơ bản như đăng ký, đăng nhập, và đăng xuất để người dùng dễ dàng truy cập Ứ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, giúp tiết kiệm thời gian và tăng tính tiện dụng 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 cá nhân, đổi mật khẩu hoặc khôi phục mật khẩu một cách dễ dàng Ngoài ra, phần mềm cung cấp chức năng xem chi tiết sản phẩm, đánh giá sản phẩm nhằm nâng cao trải nghiệm mua bán, đồng thời cho phép thêm, xóa, hoặc sửa đổi các mặt hàng để phù hợp với quản lý kinh doanh.

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

(Công việc dự kiến) Sản phẩm Ghi chú

- 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 hiện nay, công nghệ phát triển giúp các doanh nghiệp nâng cao trải nghiệm người dùng và đảm bảo sự tiện lợi trong dịch vụ bán hàng Chất lượng sản phẩm không còn là yếu tố cạnh tranh chủ đạo, thay vào đó, tính nhanh chóng và hiệu quả của dịch vụ mới là lợi thế cạnh tranh chính Doanh nghiệp cần tập trung vào cung cấp trải nghiệm khách hàng tốt nhất để ghi điểm trong thị trường ngày càng cạnh tranh này.

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à mới đây là BaeMin, rõ ràng xu hướng mua sắm và đặt dịch vụ qua mạng đang ngày càng phổ biến Tuy nhiên, câu hỏi đặt ra là các mặt hàng thiết yếu khác liệu có cần những ứng dụng tương tự hay không? Việc này mở ra cơ hội phát triển các nền tảng đặt hàng trực tuyến đa dạng nhằm đáp ứng nhu cầu ngày càng tăng của người tiêu dùng trong việc mua sắm hàng hóa thiết yếu một cách tiện lợi và nhanh chóng hơn.

Người tiêu dùng vẫn chưa nắm rõ các loại gas và mẫu mã trên thị trường, dẫn đến tình trạng gas giả và kém chất lượng ngày càng gia tăng Để 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 đặt mua gas dễ dàng ngay trên điện thoại của mình, nâng cao sự tiện lợi và an toàn trong việc sử dụng gas hàng ngày.

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 xây dựng và 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 được phát triển bằng ngôn ngữ Dart trên nền tảng Flutter, bao gồm đăng ký, đăng nhập, đăng xuất để người dùng dễ dàng truy cập hệ thống Hệ thống hỗ trợ đăng nhập nhanh bằng các tài khoản phổ biến như Google và Facebook, giúp tiết kiệm thời gian và nâng cao trải nghiệm người dùng 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 cá nhân, đổi mật khẩu và lấy lại mật khẩu khi cần thiết Ứng dụng cung cấp tính năng xem chi tiết các sản phẩm, đánh giá sản phẩm để hỗ trợ quyết định mua hàng, cũng như thêm, xóa hoặc chỉnh sửa sản phẩm dễ dàng để quản lý danh mục một cách hiệu quả.

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 phát triển giao diện chất lượng cao cho iOS và Android trên nền tảng đơn giản và nhanh chóng Nội dung này đặc biệt phù hợp với các lập trình viên và tổ chức muốn tối ưu thời gian phát triển ứng dụng di động Với khả năng tích hợp mã nguồn sẵn có, Flutter giúp tăng hiệu quả công việc và mở rộng khả năng tùy biến của các ứng dụng di động.

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 chia thành hai tầng chính: tầng trên sử dụng ngôn ngữ Dart để viết mã nguồn, giúp xây dựng ứng dụng Flutter linh hoạt và dễ dàng chỉnh sửa Các đoạn mã Dart này cung cấp phương tiện để tùy biến và điều chỉnh theo nhu cầu của lập trình viên, mang lại khả năng tùy biến cao cho ứng dụng Nhờ đó, phát triển ứng dụng Flutter trở nên dễ dàng, nhanh chóng và phù hợp với mong muốn của người dùng.

Tầng Application trong 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, nâng cao khả năng tùy biến và tối ưu hóa Tầng thứ hai, nằm sâu bên dưới, được xây dựng bằng C++ để đảm bảo hiệu suất cao cho framework Tầng Shell chứa các công cụ hỗ trợ giúp ứng dụng Flutter hoạt động trong quá trình chạy, đặc biệt nổi bật là máy ảo Dart VM Máy ảo Dart VM đóng vai trò là một ứng dụng chạy song song với mã nguồn chính, giúp tăng khả năng quản lý bộ nhớ và tối ưu hiệu suất Đặc biệt, Dart VM có ba nhiệm vụ chính để hỗ trợ quá trình thực thi mã Flutter một cách hiệu quả.

 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, đồng thời cung cấp các hệ thống chạy như trình thu gom rác (garbage collector) và các thư viện cần thiết của ngôn ngữ lập trình, giúp đảm bảo hiệu suất và tối ưu hóa quá trình vận hành của ứng dụng.

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

Trong việc phát triển ứng dụng chạy trên các thiết bị thông thường, có hai thành phần chính cần quan tâm Thành phần đầu tiên là 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ý và vận hành ứng dụng Thành phần thứ hai là lớp Platform, biểu thị hệ điều hành hoặc các ứng dụng trung gian kết nối giữa mã nguồn của lập trình viên và thiết bị sử dụng Trong lĩnh vực lập trình ứng dụng di động, lớp Platform được phân chia thành ba thành phần chính để đảm bảo tính linh hoạt và hiệu quả của ứng dụng.

Dịch vụ trên thiết bị bao gồm các ứng dụng được viết sẵn và cài đặt mặc định, có nhiệm vụ quản lý giao tiếp giữa các ứng dụng với nhau Chúng cung cấp thông tin của thiết bị cho các ứng dụng và thực thi các yêu cầu nhằm điều khiển các tính năng thiết bị như định vị, camera, cảm biến và các chức năng khác, đảm bảo hoạt động trơn tru và hiệu quả của hệ thống.

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

OEM Widgets là thành phần phụ được cấu tạo 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à đơn vị phát hành như NTT Docomo nhằm thống nhất một quy chuẩn chung cho các giao diện người dùng (UI) trên các nền tảng khác nhau Quy chuẩn này giúp đảm bảo tính đồng bộ và nhất quán trong thiết kế UI, đồng thời tạo ra một số giới hạn nhất định trong việc phát triển và tùy biến giao diện, điều này sẽ được đề cập chi tiết hơn ở phần phân tích sau.

Trong bài viết này, chúng tôi sẽ so sánh kiến trúc của lớp Application và cách lớp này giao tiếp với lớp Platform trong Flutter Như đã đề cập ở phần trước, tầng Application của Flutter đóng vai trò cung cấp kiến trúc cho một ứng dụng linh hoạt và tối ưu Việc hiểu rõ cấu trúc này giúp tối ưu quá trình phát triển và tích hợp các thành phần trong ứng dụng Flutter.

Flutter sử dụng mã nguồn được cross compile thành mã native dựa trên máy ảo Dart VM, trong đó các thành phần ít thay đổi được biên dịch dạng AOT, còn các thành phần thường xuyên thay đổi sẽ được biên dịch dạng JIT, giúp tối ưu hiệu suất Ứng dụng viết bằng Flutter không phụ thuộc vào OEM Widgets, cho phép lập trình viên tùy chỉnh và kiểm soát từng pixel trên màn hình mà không gặp giới hạn của các thành phần giao diện OEM Trong khi đó, các ứng dụng dạng Hybrid sử dụng mã HTML/CSS và WebView để vẽ giao diện, với mã thực thi bằng Javascript, tuy nhiên cần phải sử dụng module trung gian gọi là Bridge để giao tiếp với phần cứng và dịch vụ của hệ thống, điều này làm tăng kích thước ứng dụng và giới hạn khả năng bảo mật Đối với các ứng dụng WebNative hoặc Cross compiled, phần WebView không còn cần thiết, thay vào đó sử dụng module Bridge để thực hiện các hành vi trung gian, giúp giảm phụ thuộc và linh hoạt hơn trong việc lựa chọn nền tảng nền tảng gồm mã native hoặc không native Flutter còn cung cấp các widget mặc định theo hai nền tảng chính là Material Design cho Android/Fuchsia và Cupertino cho iOS, giúp lập trình viên dễ dàng xây dựng giao diện phù hợp từng nền tảng mà không cần quan tâm đến các giới hạn của OEM Widgets.

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 Widget chịu trách nhiệm hình thành cấu trúc của cây chuẩn đoán (Diagnosticable Tree), hỗ trợ việc định nghĩa cấu trúc 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ư tưởng của Flutter giống như một ứng dụng web tất cả trong một, nơi tất cả đồ họa được vẽ trên một Canvas lớn Khi dữ liệu thay đổi, như chuyển màn hình hoặc cập nhật dữ liệu, Flutter sẽ xóa Widget cũ và vẽ lại Widget mới để phản ánh trạng thái mới, giúp quản lý giao diện một cách linh hoạt Thay vì cần các khái niệm như StoryBoard của iOS hay Activity của Android, Flutter tập trung vào khái niệm Widget để xử lý giao diện, đồng thời việc quản lý trạng thái của các Widget cũng do lập trình viên thực hiện, phù hợp với đặc điểm Ngôn ngữ Dart dựa trên component Khi muốn điều chỉnh kích thước hoặc vị trí của Widget, Flutter khuyên bạn nên bọc Widget đó trong một Widget khác chuyên xử lý việc này, giúp duy trì 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, 16:39

TỪ KHÓA LIÊN QUAN

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

w