
前言
Flutter是谷歌的移動(dòng)UI框架,可以快速在iOS和Android上構(gòu)建高質(zhì)量的原生用戶界面。 Flutter可以與現(xiàn)有的代碼一起工作。在全世界,F(xiàn)lutter正在被越來越多的開發(fā)者和組織使用,并且Flutter是完全免費(fèi)、開源的。
-
快速開發(fā)
- 毫秒級(jí)的熱重載,修改后,您的應(yīng)用界面會(huì)立即更新。使用豐富的、完全可定制的widget在幾分鐘內(nèi)構(gòu)建原生界面。
-
富有表現(xiàn)力和靈活的UI
- 快速發(fā)布聚焦于原生體驗(yàn)的功能。分層的架構(gòu)允許您完全自定義,從而實(shí)現(xiàn)難以置信的快速渲染和富有表現(xiàn)力、靈活的設(shè)計(jì)。
-
原生性能
- Flutter包含了許多核心的widget,如滾動(dòng)、導(dǎo)航、圖標(biāo)和字體等,這些都可以在iOS和Android上達(dá)到原生應(yīng)用一樣的性能。
官方說的這么牛x,能不了解一下嗎!本系列為本人學(xué)習(xí)flutter的學(xué)習(xí)筆記,重在記錄學(xué)習(xí)中遇到的問題。
環(huán)境配置
Flutter 1.0.0
Dart 2.1.0 (build 2.1.0-dev.9.4 f9ebf21297)
Xcode Version 10.1 (10B61)
IntelliJ IDEA 2018.3.2 (Ultimate Edition)
VS Code 1.30.1 (1.30.1)
安裝與環(huán)境搭建
參考flutter中文網(wǎng)或者自行Google,前人之述備矣,此處不再贅述。
配置編輯器
本人為iOS開發(fā),未安裝過Android Studio,所以不具備安卓開發(fā)環(huán)境。
為了親自體驗(yàn)一下不同編輯器,所以安裝了IntelliJ IDEA 和 VS Code體驗(yàn)flutter開發(fā)。VS Code的配置參考官方教程。IntelliJ IDEA的配置參考官方教程。IntelliJ IDEA需要安裝flutter和dart插件,在IntelliJ IDEA安裝插件需要翻墻,也可以去官方插件庫搜索插件從磁盤安裝。從磁盤安裝插件極有可能重啟應(yīng)用后報(bào)錯(cuò)閃退,修復(fù)方法是在應(yīng)用目錄下~/Library/Application Support/<PRODUCT><VERSION>中把安裝的插件刪除即可。推薦翻墻從應(yīng)用內(nèi)搜索插件安裝插件。

常用命令
- flutter doctor: 堅(jiān)持flutter開發(fā)環(huán)境信息.
- flutter create: 創(chuàng)建一個(gè)新的flutter項(xiàng)目.
- flutter run: 在已運(yùn)行的設(shè)備上運(yùn)行flutter應(yīng)用.
更多命令直接運(yùn)行flutter進(jìn)行查看。
Global options:
-h, --help Print this usage information.
-v, --verbose Noisy logging, including all shell commands
executed.
If used with --help, shows hidden options.
-d, --device-id Target device id or name (prefixes allowed).
--version Reports the version of this tool.
--suppress-analytics Suppress analytics reporting when this command runs.
--bug-report Captures a bug report file to submit to the Flutter
team.
Contains local paths, device identifiers, and log
snippets.
--packages Path to your ".packages" file.
(required, since the current directory does not
contain a ".packages" file)
Available commands:
analyze Analyze the project's Dart code.
attach Attach to a running application.
bash-completion Output command line shell completion setup scripts.
build Flutter build commands.
channel List or switch flutter channels.
clean Delete the build/ directory.
config Configure Flutter settings.
create Create a new Flutter project.
devices List all connected devices.
doctor Show information about the installed tooling.
drive Runs Flutter Driver tests for the current project.
emulators List, launch and create emulators.
format Format one or more dart files.
help Display help information for flutter.
install Install a Flutter app on an attached device.
logs Show log output for running Flutter apps.
make-host-app-editable Moves host apps from generated directories to
non-generated directories so that they can be edited
by developers.
packages Commands for managing Flutter packages.
precache Populates the Flutter tool's cache of binary
artifacts.
run Run your Flutter app on an attached device.
screenshot Take a screenshot from a connected device.
stop Stop your Flutter app on an attached device.
test Run Flutter unit tests for the current project.
trace Start and stop tracing for a running Flutter app.
upgrade Upgrade your copy of Flutter.
快速開始
終端
終端在適合的目錄下運(yùn)行flutter create flutter_app創(chuàng)建一個(gè)名為flutter_app的應(yīng)用。
IntelliJ IDEA
從Flutter入門應(yīng)用程序模板創(chuàng)建一個(gè)新的Flutter IntelliJ項(xiàng)目:
- 在IntelliJ中,在 ‘Welcome’ 窗口點(diǎn)擊 Create New Project
- 或者在主界面 File>New>Project…
- 在菜單中選擇 Flutter , 然后點(diǎn)擊 Next.
- 輸入Project name 和 Project location,點(diǎn)擊 Finish.
VS Code
從Flutter入門應(yīng)用程序模板創(chuàng)建一個(gè)新的Flutter項(xiàng)目:
- 打開 Command Palette (Ctrl+Shift+P (Cmd+Shift+P on macOS)).
- 選擇 Flutter: New Project命令并回車。
- 輸入Project name 和 Project location
開發(fā)工具簡(jiǎn)單應(yīng)用教程
英文還可以的同學(xué)參考官方的英文教程,官方提供了Android Studio / IntelliJ和VS Code的簡(jiǎn)單開發(fā)教學(xué)。
IntelliJ中直接在頂部工具欄就可以操做,VS Code按F5運(yùn)行項(xiàng)目并顯示工具欄。
