Điều mô tả ngắn về Flutter:

Một phần của tài liệu Phát triển mở rộng hệ thống bán hàng thời trang dùng flutter và angular (Trang 25 - 47)

CHƯƠNG 2 : CƠ SỞ KIẾN THỨC VÀ CÔNG NGHỆ SỬ DỤNG

5 điều mô tả ngắn về Flutter:

• Ngơn ngữ Dart. Dart là gì? Đó là phản ứng của hầu hết các nhà phát triển. Dart là ngơn ngữ thuần OOP, nó được sử dụng để xây dựng các ứng dụng web, server, máy tính để bàn và thiết bị di động. • Các IDE được khuyến nghị với Flutter là Android Studio hoặc

Intellij Idea.

• Flutter có cầu nối là Dart, kích thước ứng dụng lớn hơn, nhưng nó hoạt động nhanh hơn nhiều. Không giống như React Native với cầu nối là Javascript.

• React Native và Flutter chia sẻ các mơ hình tương tự như trình xử lý sự kiện và mở rộng lớp.

• Animation và trải nghiệm cài đặt của Flutter thực sự tốt và mượt mà tương ứng.

2. Ưu - nhược điểm của Fluter

Ưu điểm:

• Ngơn ngữ Dart: Dart - OOP, nó khá dài, nhưng những người quen viết bằng Java / C # sẽ hài lịng với Dart.

• Ít phải viết các config khi tạo project mới theo cách thủ cơng, ngược lại với React Native.

• Chỉ cần tải về Flutter từ git, chạy “flutter doctor”, và nó sẽ cho biết những loại vấn đề có thể có trong hệ thống. Sau đó, tạo một

project từ Android Studio hoặc bất kỳ IDE nào sau khi cài đặt Flutter Plug-in sơ bộ và start project. Ngồi ra nó cịn có Hot- reload giống như trong React-Native.

• Hỡ trợ tuyệt vời cho IDE (Android Studio, IDE IntelliJ, VSCode) • Trình điều hướng tích hợp sẵn. Sau khi tạo ra một ứng dụng trên

Flutter, có thể thấy nó có Navigator được xây dựng sẵn. có thể tạo một route mới mà khơng cần kết nối bất kỳ thứ gì (khơng giống như trong RN, nơi cần kết nối bất kỳ package điều hướng gốc nào vv);

• Giải pháp quản lý dữ liệu được tạo sẵn, ví dụ trong Flutter này là "Mọi thứ đều có một Widget" cho nó. Có một StatefulWidget đặc biệt, với sự giúp đỡ của nó mà chúng ta có thể quản lý trạng thái widget và thay đổi nó một cách năng động.

Nhược điểm:

• Có một rào cản lớn cho những người chỉ học JS, hoặc đến từ RN. Do thực tế là Dart được sử dụng với sự thừa kế, đa hình của nó và tất cả các thứ về OOP.

• Khơng có JSX mà tất cả chúng ta đã quen khi làm RN. Nhìn vào tệp Dart trong đó khơng có phân chia thành template, styling và data, nó trở nên khó chịu.

• Styling là một nhược điểm. Thực tế là khơng có sự tách biệt thành Styles, templates và controller, có một vấn đề khi mơ tả một thành phần thì chúng ta cũng cần mơ tả các styles cùng một lúc.

• Animation cịn khó khăn hơn. Mặc dù nó có một animation tốt, nhưng nó sẽ khó hơn khi tạo hiệu ứng động, khơng giống như trong RN.

• Tối ưu hóa. Trong Fluter, chỉ có thừa kế widget với các điều kiện có thể thay đổi (trạng thái) và không thể thay đổi (không trạng thái). Trong khi ở React-Native chúng ta có thể quản lý vịng đời. Ngồi ra, một nhược điểm lớn là thiếu các công cụ để lưu trạng thái của ứng dụng, vấn đề này có thể, tuy nhiên, được giải quyết bằng cách tuần tự hóa trạng thái hiện tại.

3. Build app demo

Ở đây dùng Android Studio, chọn project Flutter:

Sau bước này, Flutter SDK sẽ khởi tạo cấu trúc thư mục cho ứng dụng. Tất cả các hành động đi vào thư mục lib và main.dart là điểm bắt đầu trong quá trình thực thi ứng dụng:

Trong Flutter, tất cả mọi thứ đều là một widget. Images, icons, texts trong một ứng dụng Flutter đều là những widget.

Điểm hay là, Flutter SDK tạo ra một widget tương tác ở root của ứng dụng.

4.Tensorflow lite

4.1.Giới thiệu tensorflow lite

Học máy là gì?

Học máy, hoặc gọi là Machine Learning, là một lĩnh vực con của Trí tuệ nhân tạo sử dụng các thuật tốn cho phép máy tính có thể học từ dữ liệu để tự đưa ra thuật tốn riêng, thay vì lập trình sẵn. Học máy đang là lĩnh vực rất nổi tiếng, nếu khơng muốn nói là mỏ vàng của ngành tin học. Hiện tại, đang có rất nhiều thư viện hỗ trợ cho việc phát triển học máy, 1 trong các thư viện phổ biến là tensorflow.

Tuy vậy vì tensorflow cũng khá cồng kềnh về dung lượng, nên không phù hợp với nền tảng di động, thay vào đó, chúng ta sử dụng 1 giải pháp khác thay thế nó là tensorflow lite.

4.2 .Một số khái niệm trong tensorflow lite

Chúng ta cần tìm hiểu về chúng nếu muốn áp dụng công nghệ này vào ứng dụng

Tensor

Tensor được đưa ra trực tiếp nhờ vào framework cốt lõi của TensorFlow. Trong TensorFlow, tất cả các tính tốn đều liên quan đến các tensor. Một

tensor là một vector hay ma trận của n-chiều không gian đại diện cho tất cả loại dữ liệu. Tensor có 3 thuộc tính cơ bản là rank, shape và type. Shape của dữ liệu chính là chiều của ma trận hay mảng. Tất cả các giá trị trong một tensor chứa đựng loại dữ liệu giống hệt nhau với 1 shape đã biết hoặc đã biết một phần.

Rank là số bậc của tensor, giúp phân loại dữ liệu.

Type là kiểu dữ liệu của các elements trong Tensor. Chỉ có một kiểu Type duy nhất cho tồn bộ các elements có trong 1 Tensor.

4.3.Áp dụng tensorflow lite

Để áp dụng TFL trong flutter, đòi hỏi chúng ta sử dụng 1 plugin là tflite, phiên bản sẽ được sử dụng là 1.1.2.

Chúng ta sẽ dùng tensorflow lite trong cài đặt chức năng đăng nhập bằng nhận diện khn mặt, vì chức năng này cũng địi hỏi Google Machine Learning Kit, nên để tìm hiểu sâu, hãy qua mục cơng nghệ tiếp theo là Thư viện Google Machine Learning Kit.

5. Google Machine Learning Kit 1.Thư viện Google Machine learning kit

1.1 Giới thiệu GMLK

- GMLK là 1 thư viện lập trình học máy dành cho nền tảng điện thoại, nó vừa có thể tích hợp trên cả nền tảng ios lẫn android. với giao diện sử dụng đơn giản, GMLK rất nổi tiếng và phù hợp với những ai muốn tìm hiểu sơ bộ về nền tảng học máy, tuy nhiên thư viện cũng cung cấp khả năng cấu hình chức năng học máy riệng, sử dụng mơ hình Tensorflow Lite. Có rất nhiều dịch vụ hữu ích được tích hợp trong GMLK tùy thuộc vào cách mà chúng ta sử dụng APIs.

ảnh, video. Khi sử dụng chức năng này song song với Language Identification và Translation, chúng ta có thể phát triển những ứng dụng chụp ảnh và phiên dịch nội dung trong báo chí, sách vở

- Face detection: Chức năng nhận diện khuôn mặt, cung cấp APIs giúp app chỉ định khu vực của các khuôn mặt trong các bức hình, nhận diện các đặc điểm nổi bật trong khuôn mặt như mắt, mũi, miệng. Các nhà lập trình có thể sử dụng chức năng này trong ứng dụng video chat hoặc trò chơi.

- Barcode scanning: Chức năng quét dữ liệu được mã hóa bằng các chuẩn thơng thừng. 1 ví dụ điển hình là mã QR.

- Image labeling: Chức năng dán nhãn hình ảnh, khơng chỉ hỡ trợ dùng mơ hình dán nhãn dạng chuẩn, GMLK cịn cho phép nhà lập trình cấu hình mơ hình riêng, cho phép ứng dụng trong các trương hợp riêng biệt.

- Object Detection and Tracking: Tính năng phát hiện, nhận diện vị trí đồ vật trong hình ảnh, video

- Language Identification: Chức năng nhận diện ngôn ngữ của văn bản. Hiện tại, GMLK hỗ trợ nhận dạng hơn 1 trăm ngôn ngữ khác nhau với độ chính xác rất cao

- Translation: Phiên dịch từ ngôn ngữ này sang ngôn ngữ khác. Các mơ hình phiên dịch của GMLK được đào tạo để phiên dịch ra và từ ngôn ngữ tiếng anh, với việc phiên dịch giữa 2 ngôn ngữ khác, tiếng anh được sử dụng làm ngôn ngữ trung gian.

- Smart Reply: Cung cấp chức năng gần giống với chat bot, smart reply chủ yếu được sử dụng trong cuộc đối thoại đơn giản, trong các ứng dụng mua bán. Nên được sử dụng kèm Translation nếu nhà phát triển

muốn sử dụng chức năng trong mơi trường ngơn ngữ ngồi tiếng Anh.

*Ở đây, để phát triển ứng dụng mobile trong hệ thống, chúng ta sẽ sử dụng các chức năng của GMLK.

- Face detection, sử dụng chung với mơ hình học máy Tensorflow lite và MobileFaceNet cho chức năng đăng nhập bằng cách nhận khuôn mặt.

- Translation, cho chức năng dịch nội dung tin nhắn trong ứng dụng, nhằm thu hút đối tượng khách hàng sử dụng ngôn ngữ khác tiếng anh.

1.2.Các loại ứng dụng sử dụng Google Machine learning kit

- Từ những dịch vụ mà GMLK cung cấp, chúng ta có thể xây dựng rất nhiều ứng dụng mang tính cạnh tranh, hấp dẫn với khách hàng như:

+ Ứng dụng chụp ảnh và phiên dịch trực tiếp nội dung trong báo chỉ, sách vở. Việc tích hợp Translation và Text Recognition, Language Identification vào ứng dụng sẽ rất phù hợp cho đối tượng sinh viên, học sinh, hoặc người tương tác nhiều với văn bản sử dụng nhiều thứ tiếng.

+ Ứng dụng chatbot sử dụng Smart reply, một số ứng dụng còn đi kèm với Translation giúp chatbot có khả năng trị chuyện bằng nhiều thứ tiếng, chatbot không chỉ là 1 phương tiện giải trí, gần đây, đã có 1 số nghiên cứu cho rằng sử dụng chatbot có thể là 1 biện pháp giải tỏa tâm lý cho những các bệnh nhân tự kỷ.

+ 1 số trang web khuyến nghị hình ảnh, video theo sở thích người dùng, sử dụng Image labeling để lấy các label mà người sử dụng thấy

hứng thú, từ có gợi ý các hình ảnh có nhãn tương tự.

1.3.Cách tích hợp Google Machine Learning Kit

1.3.1.Sử dụng Google Machine Learning Kit trong flutter

- Hiện tại, trong hệ thống chúng ta phát triển app mobile bằng công nghệ flutter. Để kết hợp flutter với GMLK đòi hỏi ta phải sử dụng 1 Plugin có tên là google_ml_kit. Hiện tại phiên bản mới nhất của plugin này là 0.7.2, đây sẽ là phiên bản mà chúng ta sử dụng.

*Do flutter phát triển app trên hiệu điều hành android lẫn ios, chúng ta sẽ cài đặt từng hệ điều hành sao cho phù hợp với GMLK

1.3.2.Cài đặt android

Chúng ta nâng phiên bản sdk tối thiểu là 21 trong file android/app/src/build.gradle android { ... defaultConfig { ... minSdkVersion 21 targetSdkVersion 29 ... } ...

}

1.3.3.Cài đặt ios

Đối với ios, GMLK chỉ hỗ trợ cho kiến trúc máy 64-bit. Chúng ta sẽ vào Xcode và bỏ kiến trúc amrv7 (32 bit)

Ngồi ra, GMLK cịn có các u cầu Phiên bản ios tối thiểu 10.0

Phiên bản ngơn ngữ Swift (ngơn ngữ lập trình ios) 5 Cơng cụ phát hành app Xcode: phiên bản 12 trở lên

1.3.4.Cách phát triển chức năng đăng nhập bằng nhận diện khuôn mặt sử dụng Face detection, Face recognition

Flow sử dụng Face recognition của người dùng sẽ như sau:

Bước 1: Khi họ đăng ký tài khoản, ứng dụng sẽ hỏi người dùng có muốn chụp ảnh để lưu dữ liệu khuôn mặt khuôn mặt không. Chú ý việc lưu trữ dữ liệu sẽ diễn ra trên thiết bị, nhằm đảm bảo tốc độ nhận dạng nhanh, và đỡ tốn dung lượng lưu trữ trên đám mây.

Bước 2: khi người dùng đăng nhập trở lại trên cùng thiết bị, họ có thể u cầu ứng dụng qt khn mặt họ, rồi so sánh với các khuôn mặt đã lưu, khuôn mặt nào gần giống nhất sẽ được lấy để trả lại tên tài khoản cho người dùng.

Ý tưởng cài đặt chức năng ra sau

Về việc nhận dạng khuôn mặt, chức năng face detection của GMLK sẽ nhận diện khn mặt trong hình, từ đó sử dụng cơng nghệ tensorflow lite để so sánh khuôn mặt đã cắt với từng khuôn mặt đã được lưu lại, trả về tên đăng nhập nếu phép so sánh đạt kết quả cao nhất.

1.4.Cách phát triển chức năng phiên dịch dùng Translation

Hiện tại, GMLK chỉ hỗ trợ Translation cho thiết bị android. Trước tiên, ta setup các dependencies cho android.

Vào file android/app/build.gradle , ta thêm dependencies như sau

implementation 'com.google.firebase:firebase-ml-natural- language:22.0.0'

implementation 'com.google.firebase:firebase-ml-natural- language-translate-model:20.0.8'

Quy trình phiên dịch sẽ diễn ra qua 3 bước

Bước 1: Tạo 1 Translator Options, chỉ định ngôn ngữ dịch từ với mục tiêu dịch ra (tiếng đức -> tiếng anh, ...)

Bước 2: Từ options, lấy 1 translator từ Natural Language, cần chú ý translator chưa thể hoạt động nếu ta chưa tải mơ hình cho nó

Bước 3: Tạo 1 condition để tải về model cho translator (VD: yêu cầu wifi, 3G, 4G, ...)

Bước 4: Từ condition, tải model về cho translator, nếu thành công, ta sẽ phiên dịch được ngay

6. Thuật toán cho chức năng Phiên dịch và Đăng nhập nhận diện khuôn mặt

6.1.Học máy cơ bản

- Học máy là các kỹ thuật giúp cho máy tính có thể tự học mà khơng cần phải cài đặt các luật quyết định. Trong học máy, chúng ta sử dụng mơ hình, các mơ hình này được đào tạo với 1 lượng lớn dữ liệu để tự phát triển 1 thuật toán cho ra kết quả gần chính xác nhất. Có rất nhiều loại mơ hình học máy, mỡi mơ hình phù hợp với 1 số kiểu bài tốn nhất

định. Trong khn khổ khóa luận, chúng ta sẽ bàn về mơ hình mạng neuron.

6.2.Giới thiệu về mơ hình mạng neron

- Mạng neuron, được cảm hứng từ các tế bào neuron trong sinh học, chỉ 1 mơ hình có cấu trúc 1 mạng, mạng này bao gồm nhiều lớp, mỗi lớp gồm nhiều phần tử, và mỗi phần tử của lớp này tương tác với các phần tử của lớp kia thông qua 1 giá trị, được gọi là trọng số.

Theo hình, tầng input chính là tham số, và output là kết quả, hidden sẽ do người phát triển tự định nghĩa.

6.3.Mạng neuron hoạt động thế nào

Để hiểu mạng neuron, ta xem 1 ví dụ cơ bản

Đây là mơ hình neuron tối giản nhất, ở đây, chúng ta thấy: x1 - đầu vào thứ nhất

x2 - đầu vào thứ 2

Cái ta quan tâm không phải giá trị x hay y, mà, dùng thuật toán nào, ta có thể ra kết quả y chính xác nhất.

Thuật tốn tính ra kết quả y là y = f(x1*w1 + x2*w2 + b) Trong đó:

w1, w2 lần lượt là trọng số của x1, x2 b là tham số trung gian (bias)

f là hàm vận hành (activate) nhằm đảm bảo sao cho y nằm trong 1 khoảng nhất định (thường là 0->1)

F sẽ được định nghĩa khi ta định nghĩa mơ hình , đối với các tham số w1, w2, b, để tìm ra giá trị của chúng, chúng ta thực hiện 1 quy trình là đào tạo mạng với dữ liệu đã có sẵn kết quả, khi mơ hình trả về kết quả, ta so sánh với kết quả mong đợi, sự sai lệch giữa 2 kết quả sẽ được dùng để tính tốn lại w1, w2 và b theo như phương pháp back propagation. Càng nhiều dữ liệu sử dụng cho đào tạo, mơ hình neuron càng có hiệu quả hơn.

6.4.Áp dụng mạng neuron trong Phiên dịch

Để đạt độ chính xác cao, chúng ta sử dụng 1 biến thể của mạng neuron là mơ hình Sequence to Sequence

Trong mơ hình, có 2 thuật ngữ cần quan tâm, Encoder và Decoder, cả 2 đều chứa 1 tập các mơ hình neuron con, thông thường là dạng RNN (reccurent neural network).

Ở decoder, ta để ý thấy model cuối trả về eos (end of sentence).

6.5.Quy trình nhận diện khn mặt

Được chia làm 2 quy trình con Qui trình phát hiện khn mặt:

Qui trình phát hiện khn mặt thực hiện như sau: Thay đổi kích thước hình ảnh ban đầu thành các tỉ lệ khác nhau theo xu hướng giảm dần. Khung quét sẽ quét toàn bộ ảnh và trên nhiều tỉ lệ khác nhau

Ví dụ minh họa

Qui trình nhận dạng khn mặt:

Quy trình này dựa trên việc nhúng mỡi ảnh vào khơng gian Euclide bằng cách sử dụng mạng CNN. Mạng được huấn luyện sao cho khoảng cách bình phương L2 trong khơng gian nhúng tương ứng với khoảng cách giữa các khuôn mặt: Khuôn mặt của cùng một người có khoảng cách nhỏ và khn mặt của những người khác nhau có khoảng cách lớn. Khi đó, mỡi khn mặt được đại diện bởi một vector đặc trưng 128 chiều được chuyển đổi thành 128 byte.

7. Thanh toán điện tử (Momo) 7.1.Thanh tốn điện tử là gì?

- Thanh tốn điện tử là một mơ hình giao dịch trực tuyến khơng sử

Một phần của tài liệu Phát triển mở rộng hệ thống bán hàng thời trang dùng flutter và angular (Trang 25 - 47)

Tải bản đầy đủ (PDF)

(115 trang)