Trong phần này, chúng ta sẽ tìm hiểu cách thiết lập môi trường để phát triển ứng dụng Flutter.
Nội dung chính
1. Yêu cầu hệ thống đối với Windows
Để cài đặt và chạy Flutter trên hệ thống Windows, trước tiên bạn cần đáp ứng các yêu cầu này cho môi trường phát triển của mình.
Hệ điều hành | Windows 7 trở lên (Tôi là Windows 10. Bạn cũng có thể sử dụng Mac hoặc Linux OS.). |
Dung lượng đĩa | 400 MB (Nó không bao gồm không gian đĩa cho IDE / công cụ). |
Công cụ | 1. Windows PowerShell2. Git dành cho Windows 2.x (Tại đây, Sử dụng Git từ tùy chọn Dấu nhắc Lệnh của Windows). |
SDK | Flutter SDK dành cho Windows |
IDE | Android Studio (Chính thức) |
2. Cài đặt Git
Bước 1: Để tải xuống Git, hãy nhấp vào đây .
Bước 2: Chạy tệp .exe để hoàn tất cài đặt. Trong khi cài đặt, hãy đảm bảo rằng bạn đã chọn tùy chọn được đề xuất.
Để đọc thêm thông tin về cài đặt Git, hãy nhấp vào đây .
3. Cài đặt Flutter SDK
Bước 1: Tải xuống gói cài đặt của Bộ phát triển phần mềm Flutter dành cho windows. Để tải xuống Flutter SDK, hãy truy cập trang web chính thức của nó , nhấp vào nút Bắt đầu , bạn sẽ nhận được màn hình sau.
Bước 2: Tiếp theo, để tải xuống Flutter SDK mới nhất, hãy nhấp vào biểu tượng Windows . Tại đây, bạn sẽ tìm thấy liên kết tải xuống cho SDK .
Bước 3: Khi quá trình tải xuống của bạn hoàn tất, hãy giải nén tệp zip và đặt nó vào thư mục hoặc vị trí cài đặt mong muốn, ví dụ: D: / Flutter.
Lưu ý: Không nên đặt Flutter SDK ở nơi cần có sự cho phép của quản trị viên.
Bước 4: Để chạy lệnh Flutter trong bảng điều khiển windows thông thường, bạn cần cập nhật đường dẫn hệ thống để bao gồm thư mục flut bin. Các bước sau được yêu cầu để thực hiện việc này:
Bước 4.1: Vào thuộc tính MyComputer -> tab nâng cao -> biến môi trường. Bạn sẽ nhận được màn hình sau.
Bước 4.2: Bây giờ, chọn đường dẫn -> nhấp vào chỉnh sửa. Màn hình sau xuất hiện.
Bước 4.3: Trong cửa sổ trên, nhấp chuột vào New-> ghi đường dẫn của thư mục bin Flutter vào giá trị biến -> ok -> ok -> ok.
Bước 5: Bây giờ, chạy lệnh $ flashing doctor . Lệnh này kiểm tra tất cả các yêu cầu phát triển ứng dụng Flutter và hiển thị báo cáo về trạng thái cài đặt Flutter của bạn.
flutter doctor
Bước 6: Khi bạn chạy lệnh trên, nó sẽ phân tích hệ thống và hiển thị báo cáo của nó, như trong hình dưới đây. Tại đây, bạn sẽ tìm thấy thông tin chi tiết của tất cả các công cụ còn thiếu, cần thiết để chạy Flutter cũng như các công cụ phát triển có sẵn nhưng không được kết nối với thiết bị.
Bước 7: Cài đặt Android SDK. Nếu lệnh Flaming doctor không tìm thấy công cụ Android SDK trong hệ thống của bạn, thì trước tiên bạn cần cài đặt Android Studio IDE. Để cài đặt Android Studio IDE, hãy làm theo các bước sau.
Bước 7.1: Tải xuống tệp zip hoặc tệp thực thi Android Studio mới nhất từ trang web chính thức .
Bước 7.2: Khi quá trình tải xuống hoàn tất, hãy mở tệp .exe và chạy nó. Bạn sẽ nhận được hộp thoại sau.
Bước 7.3: Làm theo các bước của trình hướng dẫn cài đặt. Khi trình hướng dẫn cài đặt hoàn tất, bạn sẽ nhận được màn hình sau.
Bước 7.4: Trong màn hình trên, nhấp vào Tiếp theo-> Kết thúc. Sau khi nhấp vào nút Hoàn tất, bạn cần chọn tùy chọn ‘Không nhập tùy chọn Cài đặt’ và nhấp vào OK. Nó sẽ khởi động Android Studio.
Lưu ý: > Trong khi đó, trình hướng dẫn cài đặt cũng bao gồm tải xuống các thành phần Android SDK được Flutter yêu cầu để phát triển.
Bước 8: Tiếp theo, bạn cần thiết lập trình giả lập Android. Nó chịu trách nhiệm chạy và thử nghiệm ứng dụng Flutter.
Bước 8.1: Để thiết lập trình giả lập Android, vào Android Studio> Công cụ> Android> Trình quản lý AVD và chọn Tạo thiết bị ảo. Hoặc, đi tới Trợ giúp-> Tìm Hành động-> Nhập Trình mô phỏng vào hộp tìm kiếm. Bạn sẽ nhận được màn hình sau.
Bước 8.2: Chọn định nghĩa thiết bị của bạn và nhấp vào Tiếp theo(Next).
Bước 8.3: Chọn hình ảnh hệ thống cho phiên bản Android mới nhất và nhấp vào Tiếp theo(Next).
Bước 8.4: Bây giờ, hãy xác minh tất cả cấu hình AVD. Nếu đúng, hãy nhấp vào Kết thúc. Màn hình sau xuất hiện.
Bước 8.5: Cuối cùng, nhấp vào biểu tượng trỏ vào hình chữ nhật màu đỏ. Trình giả lập Android hiển thị như màn hình bên dưới.
Bước 9: Bây giờ, cài đặt plugin Flutter and Dart để xây dựng ứng dụng Flutter trong Android Studio. Các plugin này cung cấp mẫu để tạo ứng dụng Flutter, cung cấp tùy chọn để chạy và gỡ lỗi ứng dụng Flutter trong chính Android Studio. Thực hiện các bước sau để cài đặt các plugin này.
Bước 9.1: Mở Android Studio và sau đó đi tới File> Install> Plugin.
Bước 9.2: Bây giờ, hãy tìm kiếm plugin Flutter. Nếu tìm thấy, hãy chọn plugin Flutter và nhấp vào cài đặt. Khi bạn nhấp vào cài đặt, nó sẽ yêu cầu bạn cài đặt plugin Dart như màn hình bên dưới. Nhấp vào có để tiếp tục.
Bước 9.3: Khởi động lại Android Studio.
4. Yêu cầu hệ thống đối với macOS
Để cài đặt và chạy Flutter trên hệ thống macOS, trước tiên bạn cần đáp ứng các yêu cầu này cho môi trường phát triển của mình.
Hệ điều hành | macOS (64-bit) |
Dung lượng đĩa | 2,8 GB (Nó không bao gồm không gian đĩa cho IDE / công cụ). |
Công cụ | bashcurlgit 2.xmkdirrmgiải néncái nào |
IDE | Xcode (Chính thức) |
5. Tải Flutter SDK
Bước 1: Tải gói cài đặt của Bộ phát triển phần mềm Flutter cho macOS. Để tải xuống Flutter SDK, hãy truy cập trang web chính thức của nó .
Bước 2: Khi quá trình tải xuống hoàn tất, hãy giải nén tệp zip và đặt nó vào thư mục hoặc vị trí cài đặt mong muốn.
Bước 3: Để chạy lệnh Flutter, bạn cần cập nhật đường dẫn hệ thống để đưa vào thư mục flut bin.
$ export PATH="$PATH:`pwd`/flutter/bin"
Bước 4: Tiếp theo, kích hoạt đường dẫn đã cập nhật trong cửa sổ đầu cuối hiện tại bằng lệnh dưới đây và sau đó xác minh nó.
source ~/.bashrc
source $HOME/.bash_profile
echo $PATH
Bước 5: Bây giờ, chạy lệnh $flashing doctor . Lệnh này kiểm tra tất cả các yêu cầu phát triển ứng dụng Flutter và hiển thị báo cáo về trạng thái cài đặt Flutter của bạn.
$ flutter doctor
Bước 6: Khi bạn chạy lệnh trên, nó sẽ phân tích hệ thống và chi tiết của tất cả các công cụ còn thiếu, cần thiết để chạy Flutter cũng như các công cụ phát triển có sẵn nhưng không được kết nối với thiết bị.
Bước 7: Cài đặt các công cụ Xcode mới nhất nếu được công cụ bác sĩ Flutter báo cáo.
Bước 8: Cài đặt Android Studio và SDK mới nhất, nếu được công cụ bác sĩ Flutter báo cáo.
Bước 9: Tiếp theo, bạn cần thiết lập trình giả lập iOS hoặc kết nối thiết bị iPhone với hệ thống phát triển ứng dụng iOS.
Bước 10: Một lần nữa, thiết lập trình giả lập Android hoặc kết nối thiết bị Android với hệ thống để phát triển ứng dụng Android.
Bước 11: Bây giờ, cài đặt plugin Flutter and Dart để xây dựng ứng dụng Flutter trong Android Studio. Các plugin này cung cấp mẫu để tạo ứng dụng Flutter, cung cấp tùy chọn để chạy và gỡ lỗi ứng dụng Flutter trong chính Android Studio.
Cài ứng dụng cafedev để dễ dàng cập nhật tin và học lập trình mọi lúc mọi nơi tại đây.
Tài liệu từ cafedev:
- Full series tự học Flutter từ cơ bản tới nâng cao tại đây nha.
- Các nguồn kiến thức MIỄN PHÍ VÔ GIÁ từ cafedev tại đây
Nếu bạn thấy hay và hữu ích, bạn có thể tham gia các kênh sau của cafedev để nhận được nhiều hơn nữa:
Chào thân ái và quyết thắng!