開篇：
Flutter簡(jiǎn)介：
2018年2月27日，谷歌發(fā)布了flutter,官方的解釋：“Build beautiful native apps in record time”：以最短的時(shí)間構(gòu)建優(yōu)質(zhì)的原生App,也就是說可以通過一套代碼生成android和ios兩個(gè)平臺(tái)的app, 有點(diǎn)類似于RN? 下面我們跟隨官方文檔一探究竟：
Flutter官方網(wǎng)站(英文): flutter官網(wǎng)
安裝開發(fā)環(huán)境
支持平臺(tái)：mac、windows、linux
-
flutter是基于dart語言，如果不熟悉的可以看一下官方文檔 Dart官方文檔，其實(shí)語法和Java很類似，有java開發(fā)經(jīng)驗(yàn)的很容易上手，SDK可以在文檔的Get Started下載
20180512225850534.png 我的系統(tǒng)是mac ,下載完成后是一個(gè)壓縮包，大約600mb，直接解壓即可，然后將bin目錄加入到環(huán)境變量：
touch ~/.bash_profile
open -t ~/.bash_profile
然后xxx/flutter/bin加入保存即可！
打開終端：輸入flutter doctor，不提示找不到命令，即表示環(huán)境配置完成，此命令是檢測(cè)你本機(jī)的環(huán)境是否安裝完整，比如 android環(huán)境 ios環(huán)境等。
安裝插件
支持平臺(tái)：Android & vscode
下面以AndroidStudio為例：
安裝 ： 打開設(shè)置->插件,搜索flutter,點(diǎn)擊安裝,首次安裝會(huì)提示安裝dart，點(diǎn)擊確定即可，如果安裝不上，多試幾次，也可能需要梯子，這里不做介紹。
-
創(chuàng)建 ： 安裝之后重啟as,發(fā)現(xiàn)以下界面說明安裝成功，選擇start new flutter project -> Flutter Application接下來就是和創(chuàng)建Android項(xiàng)目類似，下一步然后等待創(chuàng)建完成。
20180512231916846.png 運(yùn)行： 創(chuàng)建完成后，如果一切正常將會(huì)看到main.dart文件已被打開，然后我們選擇設(shè)備，這里如果安裝了xcode,將會(huì)看到ios設(shè)備，還會(huì)看到創(chuàng)建過的avd,這里我們選擇ios模擬器，然后點(diǎn)擊綠色的按鈕運(yùn)行，如果控制臺(tái)報(bào)錯(cuò)，應(yīng)該就是某些環(huán)境沒有配置好，控制臺(tái)會(huì)給出相應(yīng)的安裝方式， 安裝后重新運(yùn)行即可，成功后如下圖：
- 熱更新： 可以看出兩者在UI方面還是遵循谷歌Material設(shè)計(jì)語言，可以看到在安卓上常見的Toolbar、FloatingActionButton等組件，從運(yùn)行情況上來看，兩者并沒有什么差別，flutter一個(gè)非常重要的特性就是熱更新，更改代碼后，模擬器會(huì)立即做出反應(yīng)，下面我們簡(jiǎn)單修改一下代碼，在屏幕中顯示一個(gè)對(duì)話框，來體驗(yàn)一下這種熱更新：
可以看到兩個(gè)模擬器立即更新了頁面，體驗(yàn)上還是Nice的,特別是對(duì)于原生開發(fā)者來說，不用再去頻繁的install,這種既改即現(xiàn)的模式，還是極大地提升了我們開發(fā)的效率。
總結(jié)
環(huán)境搭建還是挺簡(jiǎn)單的，沒有RN這么多坑，總體運(yùn)行效率還是挺不錯(cuò)的，從代碼層面上來看，有一些雜亂，全是括號(hào)... 我不是很喜歡這種語言風(fēng)格，不過上手并不困難，我也沒有看過dart的文檔，界面繪制全是通過代碼控制，項(xiàng)目大了可能會(huì)導(dǎo)致代碼量過多，不過就目前來看，前景還是很好的。畢竟是Google出品，值得我們?nèi)テ诖齠lutter的未來，希望flutter越走越遠(yuǎn)！
