Flavor & Câu chuyện config trong Flutter

Chào mừng bạn đến với Fx Studio. Chúng ta đã có những bài viết đầu tiên về chủ đề Flutter trên Fx Studio. Và cũng đã hình thành một mini-series với nội dung chính xoay quanh chủ đề Cấu hình Flutter Project. Bài viết này với chủ đề là Flavor, sẽ tổng hợp lại các kiến thức đó cho bạn.

Nếu mọi việc đã ổn rồi, thì …

Bắt đầu thôi!

Tác giả

Tác giả của mini-series Flavor này là bạn Hồng Vân. Một tay viết mới cho Fx Studio, với nhiều bài viết chất lượng. Và một vài dòng tự sự của bạn như sau …

“Mình mới lấn sân sang Flutter qua việc tự học hỏi, tìm tòi hơn nửa năm nay. Trên vị thế của một đứa tự tìm hiểu thì mình nhận ra rằng có những thứ về Flutter thật sự rất ít nguồn tài liệu hoặc bài viết, hoặc nếu có thì cũng rất chi là khó hiểu.”

Mọi người có thể theo dõi thêm các bài viết từ GitHub chính chủ của bạn nhóe! Hoặc bạn có thể follow Hồng Vân qua các kênh sau:

• Facebook: https://www.facebook.com/van.may.750/
• Email : lehongvan.develop@gmail.com
• LinkedIn: https://www.linkedin.com/in/le-van-935231150/

Chuẩn bị

Về mặt kiến thức, bạn cần thông thạo Flutter cơ bản trước nhóe. Còn về mặt tools & versions, mình sẽ sử dụng các công cụ như sau:

• IDE:
  • VSCode version 1.67.0
  • Android Studio Bumblebee version 2021.1.1 Patch 3
  • XCode version 13.3.1
• Flutter SDK version 2.10.5

Về mặt demo, bạn có thể tới các repo liên quan cho từng chủ đề được liệt kê ra ở các phần dưới của bài viết.

Flavor

Trong quá trình phát triển dự án, cho dù là mobile hay web thì công việc phân chia các môi trường phát triển khác nhau, là một điều hiển nhiên. Thậm chí nó còn ảnh hưởng tới sự tồn vong của dự án nữa. Cũng giống như iOS thì Flutter cũng không ngoại lệ. Sau khi, bạn đã đạt được các kĩ năng cơ bản cần có. Thì việc cấu hình một project chính là skill tiếp theo mà bạn cần phải nắm được.

Vấn đề, đối với mỗi môi trường khác nhau trên, chúng ta lại cần những cấu hình khác nhau. Chẳng hạn như 1 URL từ api để dev, 1 cái khác để QA và 1 cái khác cho production. Cũng có thể đó là các key service khác nhau như Google, Facebook … vân vân và mây mây…

Vậy thì cứ mỗi lần build cho mục đích nào, ta lại phải thay thế những cấu hình đó 1 cách thủ công sao? Nếu áp dụng CI/CD thì ta phải xử lý như thế nào?

Đó là lý do các flavor trong android hay còn gọi là các scheme trong iOS ra đời.

Flutter gộp chung 2 tên gọi này lại và sử dụng thuật ngữ chung là Flavor.

… vâng vâng và mây mây … chúng ta sẽ tiếp tục đi qua các chủ đề liên quan nhóe. Lý thuyết thì hãy để cho chị Google lo nhóe!

Flavor Configurations

Với một project tiêu chuẩn thì chúng ta sẽ có 3 môi trường cần phải cấu hình. Đó là:

• Local environment

• Staging / QA environment

• Production environment

Công việc đầu tiên của bạn sẽ là cấu hình được chúng nó cho project. Đó cũng chính là vấn đề đầu tiên của Flavor mà bạn cần giải quyết.

// Run flavor dev
flutter run --flavor dev

// Run flavor staging
flutter run --flavor staging

// Run flavor produc
flutter run --flavor product

Ở trên, bạn sẽ có được những câu lệnh tùy chỉnh khá đơn giản. Giúp cho project lựa chọn môi trường để thực thi. Và với mỗi môi trường, từng nền tảng khác nhau thì vẫn có thể cấu hình được các thông tin khác nhau.

Bạn có thể tìm hiểu thêm tại đây.

Customize Run and Debug

Chủ đề tiếp theo, bạn sẽ tiến hành tùy chỉnh lại các launch configuration cho project của bạn. Công việc này bạn sẽ sử dụng với VS Code.

VS Code giúp bạn đơn giản hoá việc khởi chạy và debug các cấu hình custom của app. Để làm được điều đó, VS Code sẽ đọc file launch.json nằm trong folder .vscode và việc chúng ta cần làm là viết các cấu hình custom chúng ta muốn vào đấy.

Khi bạn cài Dart & Flutter extension vào VSCode, nó sẽ đi kèm với 1 trình khởi chạy mặc định. Đó là lý do vì sao bạn vẫn có thể chạy ứng dụng mà không có file launch.json.

Tóm lại, launch configuration không phải là tính năng của Dart hay Flutter. Nó là một cấu hình để mở rộng khả năng của VS Code …

Bạn có thể tìm hiểu thêm tại đây.

Platform-specific code with MethodChannel

Flutter cho phép 1 base code có thể build được cho nhiều nền tảng. Tuy nhiên, trong lập trình, đôi khi bạn sẽ gặp phải tình huống cần truy cập API dành riêng cho nền tảng bằng ngôn ngữ hoạt động trực tiếp với các API đó (native code). Mình lấy ví dụ một số tình huống như:

• Lấy lượng pin của device

• Truy cập camera hoặc thư viện ảnh của device

• …

MethodChannel sẽ giúp bạn làm điều đó!

Bạn có thể tìm hiểu thêm tại đây.

Dart Defines

Chủ đề cuối cùng trong mini-series Flavor, chính là Dart Defines.

Dart defines là các biến được tạo ra trong khoảng thời gian biên dịch chương trình (compile-time variables). Nếu bạn đang tìm kiếm những biến tương tự biến môi trường (environtment variables), thì Dart defines là những gì bạn cần! Và chúng được tạo ra bởi --dart-define.

Vậy --dart-define là gì?

Nó là một tham số để truyền vào (pass) vào câu lệnh flutter build hoặc flutter run. Nó sẽ giúp chúng ta chuyển tiếp các biến môi trường. Điều đó có nghĩa là bạn có thể custom code của mình với bất kỳ giá trị nào bạn truyền qua tham số này.

Bạn có thể tìm hiểu thêm tại đây.

Tạm kết

Bài viết giới thiệu lại cho người mới tiếp cận tới việc cấu hình Flutter Project. Giúp cho họ từng bước cấu hình và giải quyết các vấn đề gặp phải.

• Cài đặt Flavor và tiến hành tùy chỉnh các lệnh build cho từng môi trường khác nhau
• Tùy chỉnh Launch configuration với VS Code
• Tương tác với native code của từng nền tảng
• Sử dụng các biến môi trường & ứng dụng nó cho Flavor

Okay! Tới đây, mình xin kết thúc bài viết về Flavor trong Flutter . Nếu có gì thắc mắc hay góp ý cho mình thì bạn có thể để lại bình luận hoặc gởi email theo trang Contact.

Cảm ơn bạn đã đọc bài viết này!

Written by chuotfx

Hãy ngồi xuống, uống miếng bánh và ăn miếng trà. Chúng ta cùng nhau đàm đạo về đời, về code nhóe!