發表日期:2018-10 文章編輯:小燈 瀏覽次數:2127
關于混合開發,市面上的現在基本幾種:webview+html、rn、weex、kotlin、flutter。
h5、rn之前都使用開發過多個產品,也很了解這兩者的優劣,weex、kotlin只是大概了解過,而flutter之前看過,但感覺dart語法很不友好,當時也沒有太接觸。
最近看了一下關于rn、flutter的對比,于是想重新了解一下。
flutter是google推出的一款ui移動框架,可以快速在iOS和Android上構建高質量的原生用戶界面,是基于dart語言,不需要像rn通過連接器與js通訊,性能比rn更勝一籌(未驗證),在github的start數40000+,react-native的start數是70000+。
參考flutter中文網(https://flutterchina.club/get-started/install/)
直接去官網下載可能下不下來,可以通過git下載
先設置鏡像 set PUB_HOSTED_URL=https://pub.flutter-io.cn set FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn***git clone -b beta https://github.com/flutter/flutter.git***// 如果覺得這個下載下不下來或者太慢,可以通過下面這個國內碼云地址 ***git clone https://gitee.com/mirrors/Flutter.git***
下下來flutter 后進入flutter目錄可以看到bin目錄。
將/flutter/bin設置到環境變量的path中。
在/flutter/bin目錄下執行 flutter doctor命令。
下載android studio就不說了,打開android studio/file/setting/plugin/
輸入 flutter查找并install。
第一次可能下不下來。我的電腦第一次就沒下下來,是回家后打開電腦重新下載才下下來的,猜測可能是下載完flutter sdk、或者配置flutter環境變量后需要重啟電腦。
在安裝完插件并重新啟動android studio就可以在 file/new/中看到一個新選項 New Flutter Project
按照慣例,接下來我們跑一個hello world。
照上面的new/new Flutter Project 然后 next、next、next一個新項目就建好了。
項目目錄和rn目錄類似,android、ios原生工程。lib放混合開發的dart文件,
pubspec.yaml項目的配置文件,類似于rn、react中的package.json,聲明項目版本、依賴等。
在運行后如android,會在項目根目錄的build(和android同目錄)下生成構建之后的文件,這一點和rn以及之前的android項目很不一樣,之前的androidbuild都是在/app/build/目錄下。
點擊上面截圖右上角綠三角run,第一次運行會比較慢。main.dart是主入口的混合文件。我們可以修改截圖中間的文本內容,再運行
第一次運行結束,后面就需要熟悉dart語法,查看原生里的源碼看實現原理。
日期:2018-10 瀏覽次數:7525
日期:2018-12 瀏覽次數:4598
日期:2018-07 瀏覽次數:5115
日期:2018-12 瀏覽次數:4402
日期:2018-09 瀏覽次數:5756
日期:2018-12 瀏覽次數:10181
日期:2018-11 瀏覽次數:5091
日期:2018-07 瀏覽次數:4845
日期:2018-05 瀏覽次數:5098
日期:2018-12 瀏覽次數:4562
日期:2018-10 瀏覽次數:5377
日期:2018-12 瀏覽次數:6438
日期:2018-11 瀏覽次數:4705
日期:2018-08 瀏覽次數:4850
日期:2018-11 瀏覽次數:12938
日期:2018-09 瀏覽次數:5858
日期:2018-12 瀏覽次數:5084
日期:2018-10 瀏覽次數:4423
日期:2018-11 瀏覽次數:4769
日期:2018-12 瀏覽次數:6299
日期:2018-06 瀏覽次數:4249
日期:2018-08 瀏覽次數:5697
日期:2018-10 瀏覽次數:4681
日期:2018-12 瀏覽次數:4792
日期:2018-07 瀏覽次數:4614
日期:2018-12 瀏覽次數:4783
日期:2018-06 瀏覽次數:4623
日期:2018-11 瀏覽次數:4603
日期:2018-12 瀏覽次數:4526
日期:2018-12 瀏覽次數:5507
Copyright ? 2013-2018 Tadeng NetWork Technology Co., LTD. All Rights Reserved.