Flutter前段時(shí)間終于出了1.0，是時(shí)候親手實(shí)踐一把了。

實(shí)踐之前先了解一下前人的智慧，發(fā)現(xiàn)一篇文章：

我花了 8 小時(shí)，"掌握"了一下 Flutter | Flutter 中文站上線

https://www.jianshu.com/p/9aaabc60d8af

這文章比較有意思，可能就是Flutter 中文站的人寫的，非常有用，當(dāng)然文章里的寫的8小時(shí)我感覺快了點(diǎn)兒，搗鼓一遍肯定不夠的，搞不好install都要好久。下載完flutter sdk和plugin之后要flutter doctor -v檢查開發(fā)環(huán)境，結(jié)論一般都是：Doctor found issues in X categories，會(huì)給出相應(yīng)的tip，一個(gè)一個(gè)照做就行了，實(shí)踐發(fā)現(xiàn)這些issues不需要全部處理，例只做android的話，ios的 toolchain可以忽略，“Android license status unknown”的提示特別愁人，不過stackoverflow都有解決方法，我一開始兢兢業(yè)業(yè)地照做了，第二天手殘更新了一下android studio，結(jié)果“Android license status unknown”的提示又出來了，不過我發(fā)現(xiàn)編譯打包都沒問題，就不管了。

Flutter和javascript、react有點(diǎn)像，沒有handler了，不需要自己切換線程；Flutter加載圖片使用的是graphic memory，不用擔(dān)心oom的問題，這些優(yōu)點(diǎn)都挺省心的。Dart和swift語法也特別像，我開玩笑說，不管誰看到Dart都會(huì)覺得和某種語言有點(diǎn)像。。面向?qū)ο笈c響應(yīng)式編程相結(jié)合的語言基本都長(zhǎng)這樣了。

純java程序員剛上手可Flutter能會(huì)不太適應(yīng)。Dart的嵌套真不是一般的深，更搞笑的是Flutter插件會(huì)幫我們?cè)谇短椎囊粋€(gè)個(gè)括號(hào)后面添加注釋：

這個(gè)注釋與前面的new配對(duì)的，刪不掉也無法選中，顯然Google也擔(dān)心我們代碼層級(jí)太多，看不下去了。不知道這種注釋能不能自定義，不美觀。

Flutter里一切都是Widget，以前看到這個(gè)描述沒啥感覺。寫一遍代碼就特別容易理解了，果然一切都是，布局、控件就不用說了，連實(shí)現(xiàn)padding、margin、居中這些屬性都是由一個(gè)個(gè)Widget來實(shí)現(xiàn)的。這么做的好處是邏輯簡(jiǎn)單，學(xué)習(xí)上手快，一個(gè)概念理解了就能吃遍天，F(xiàn)lutter繪制界面也方便，只需要一次深搜就可以算出控件的位置了；壞處是顯然易見的，看上面的層級(jí)，我這個(gè)是少的，大家開發(fā)時(shí)看看Flutter Outline里面的Widget樹吧，一不小心能嵌套十幾層。。我們實(shí)際開發(fā)時(shí)一定要想辦法減少Widget層級(jí)，比如多提取方法，自己封裝widget等。Android自定義View多用繼承，F(xiàn)lutter自定義Widget是通過組合多個(gè)Widget來實(shí)現(xiàn)的。Flutter官方已經(jīng)提供了許多Widget了，但我估計(jì)不久以后，F(xiàn)lutter的各種開發(fā)庫會(huì)爆發(fā)式增長(zhǎng)，浩如煙海，各公司甚至各項(xiàng)目組都會(huì)定義各自的UI庫，研發(fā)管理需要注意。

Flutter開發(fā)不需要寫android的layout了，全部通過代碼實(shí)現(xiàn)，這意味著業(yè)務(wù)代碼很容易與UI代碼混成一坨，F(xiàn)lutter官方說選Dart的原因之一就是在代碼規(guī)模變大后依然能保持可讀性，我對(duì)這話不是很理解，可能我沒有好好看Dart文檔吧。如何把代碼寫得清晰可讀還是值得推敲一下的，我覺得項(xiàng)目組轉(zhuǎn)型Flutter之前一要先定好代碼風(fēng)格，千萬不能隨便發(fā)揮。

轉(zhuǎn)型Flutter還有個(gè)要注意的地方，與原生Android不同，F(xiàn)lutter不可以隨意增刪控件，F(xiàn)lutter界面是逐幀繪制。Flutter非常重視Widget的狀態(tài)，如果界面是動(dòng)態(tài)變換的，那么Widget在定義的時(shí)候就要知道自己有哪些狀態(tài)。官方給了個(gè)網(wǎng)絡(luò)請(qǐng)求的例子，發(fā)起網(wǎng)絡(luò)請(qǐng)求之前彈出progress，請(qǐng)求結(jié)束后關(guān)閉progress顯示列表，很簡(jiǎn)單的功能，官方給的方案是通過全局變量來判斷界面狀態(tài)，如果當(dāng)前正在請(qǐng)求網(wǎng)絡(luò)，那么new progessDialog，http請(qǐng)求結(jié)束置全局變量，然后setState重繪界面，new ListView：

這種實(shí)現(xiàn)方式真是讓人不舒服，我覺得會(huì)破壞代碼結(jié)構(gòu)，你想假如原來沒有顯示progress，只做了列表，這個(gè)時(shí)候測(cè)試提個(gè)bug說http請(qǐng)求時(shí)間太長(zhǎng)，一定要加progress，這個(gè)時(shí)候再改代碼真是要改得懷疑人生了。所以一定要做好封裝，減少耦合，官法沒有提供優(yōu)雅的實(shí)現(xiàn)，那么我們得自己定義一個(gè)通用的Widget來切換控件的隱藏和顯示。就這么一個(gè)簡(jiǎn)單的功能，想寫好都要費(fèi)一下勁，所以說，開發(fā)Flutter項(xiàng)目也不見得有多輕松，一大堆公用Widget等著去實(shí)現(xiàn)呢。

1.0正式版出來了，基于Flutter全新開發(fā)android app應(yīng)該問題不大了。但是很多愿意轉(zhuǎn)型的項(xiàng)目應(yīng)該更希望能把Flutter嵌入到原生項(xiàng)目里，官方github已經(jīng)有example了，clone下來跑起來看了還蠻震驚的，用FlutterView把flutter嵌到android原生界面里，做到了flutter與原生android互交互，渾然天成，簡(jiǎn)直太完美了！把Flutter添加到原生android流程不復(fù)雜，先建個(gè)Flutter module，再引入即可。于是忍不住往自己的項(xiàng)目里加，結(jié)果發(fā)現(xiàn)處處是大坑。首先，要知道絕大多數(shù)android項(xiàng)目只要有點(diǎn)規(guī)模，依賴包就已經(jīng)很多了，build.gradle里面有各種配置，完整clean build一遍一分鐘內(nèi)能完成就不錯(cuò)了，這下要再implementation一個(gè)flutter，唉真是慢，誰用誰知道。我以前做swift開發(fā)吐槽xcode升級(jí)前后不兼容，其實(shí)android studio也是半斤八兩，我昨天手殘android studio從3.1.3升級(jí)到3.2.1，結(jié)果Flutter工程就真的認(rèn)不出來了，非得升級(jí)一下Flutter plugin才好使了。另外，Android、Flutter混合開發(fā)最最麻煩的事是，嵌到android界面里的flutter不可以與android一起debug，開發(fā)的時(shí)候要開兩個(gè)android studio，各自調(diào)各自的，于是果斷放手。總得來說，老項(xiàng)目要轉(zhuǎn)型Flutter還是整體重構(gòu)比較靠譜。

本頁內(nèi)容由塔燈網(wǎng)絡(luò)科技有限公司通過網(wǎng)絡(luò)收集編輯所得，所有資料僅供用戶學(xué)習(xí)參考，本站不擁有所有權(quán)，如您認(rèn)為本網(wǎng)頁中由涉嫌抄襲的內(nèi)容，請(qǐng)及時(shí)與我們聯(lián)系，并提供相關(guān)證據(jù)，工作人員會(huì)在5工作日內(nèi)聯(lián)系您，一經(jīng)查實(shí)，本站立刻刪除侵權(quán)內(nèi)容。本文鏈接:http://www.juherenli.com/18383.html