Flutter混合棧開(kāi)發(fā)
組件化Flutter工程
Flutter本身就是為了在移動(dòng)端上提供一個(gè)快速開(kāi)發(fā)的技術(shù)方案，避免不了就會(huì)有一些混合棧接入工作蜒茄。已有項(xiàng)目接入flutter有兩種方式：
1,官方提供的接入方式：https://flutter.dev/docs/deployment/ios
2,組件化的接入方式醋虏，也就是本文要介紹的一種方式
網(wǎng)上從android角度出發(fā)配置的文章有很多藏澳，iOS角度的文章相對(duì)有點(diǎn)少计寇，一定有原因娇豫。咱也不知道咱也不敢問(wèn)
1. 編譯產(chǎn)物
有大佬在實(shí)際開(kāi)發(fā)中發(fā)現(xiàn)匙姜，APP只需要依賴Flutter編譯后的產(chǎn)物就可以完成依賴。現(xiàn)在就拋出個(gè)問(wèn)題:Flutter編譯后的產(chǎn)物是什么東東冯痢。
編譯后針對(duì)不同平臺(tái)產(chǎn)生的文件，以iOS為例：在根目錄下中找到iOS/Flutter(或者./iOS/Flutter)目錄下的：App.framework振劳，F(xiàn)lutter.framework椎组，一共有兩個(gè)文件。（SDKv1.0.0以后flutter_assets包含在：App.framework中）任何語(yǔ)言在運(yùn)行之前都需要編譯氮昧，常見(jiàn)的編譯模式如 JIT 和 AOT。兩者各有優(yōu)缺點(diǎn)浦楣，而Flutter同時(shí)擁有了這兩種編譯方式的優(yōu)點(diǎn)袖肥。
既然是編譯后的產(chǎn)物历恐，而且需要引入APP中寸癌，所以該產(chǎn)物只針對(duì)當(dāng)前開(kāi)發(fā)環(huán)境、代碼弱贼、模擬器/真機(jī)灵份，其中任意一項(xiàng)改變后都需要重新替換上述2個(gè)文件。
如果沒(méi)有該文件哮洽，表示你沒(méi)有將Flutter代碼完成過(guò)任何一次編譯填渠。
2. 制作簡(jiǎn)單私有pod庫(kù)
作為iOS開(kāi)發(fā)者pod這個(gè)東東應(yīng)該是很熟悉的，pod庫(kù)最核心的就是.podspec文件鸟辅。直接創(chuàng)建該文件氛什，引入相關(guān)文件，并上傳git匪凉，OVER枪眉！
文件內(nèi)容直接上圖：
還有插件依賴相關(guān)的pod庫(kù)，后面會(huì)詳細(xì)解釋：
如果有興趣也可以下載Flutter組件化-Git來(lái)看看
3. podfile引入
準(zhǔn)備好pod庫(kù)之后再层，就需要將pod接入.到這里翻出前面一個(gè)問(wèn)題：任何代碼贸铜、環(huán)境改變都需要重新導(dǎo)入，對(duì)于FLutter開(kāi)發(fā)聂受、聯(lián)調(diào)的同學(xué)簡(jiǎn)直是噩夢(mèng)蒿秦。所以這里對(duì)于本地開(kāi)發(fā)的同學(xué)單獨(dú)提供一套接入方式。
先將pod文件上圖：
在pod增加一個(gè)變量use_local_depentency蛋济，需要手動(dòng)維護(hù)棍鳖。
3.1 url下載
use_local_depentency=false時(shí)代表非Flutter開(kāi)發(fā)者。
直接使用pod update就可以完成接入碗旅。依賴文件比較大需要等待渡处。
3.2 path本地文件
use_local_depentency=true時(shí)代表本地開(kāi)發(fā)者镜悉。
可以將iOS代碼和fluter放到統(tǒng)一目錄下，例如：
也可以放在其他路徑下医瘫，只需要修改pod.file中的本地路徑侣肄。
由于是直接引用的編譯產(chǎn)物所以不需要關(guān)心編譯產(chǎn)物的更新。
如果有興趣也可以下載iOS接入Flutter-Git
4. 插件注冊(cè)
前面說(shuō)到的插件pod庫(kù)醇份，為什么會(huì)有這個(gè)pod庫(kù)呢茫孔？
對(duì)于混合開(kāi)發(fā)來(lái)說(shuō)，三端（iOS被芳、Android缰贝、Flutter）的交互一直是一個(gè)
問(wèn)題，plug就是用來(lái)解決這個(gè)問(wèn)題畔濒。FLutter官方創(chuàng)建了一些最常用的插件如：彈框剩晴、相機(jī)調(diào)用。
編譯完成后侵状，你會(huì)從Flutter的文件中找到對(duì)應(yīng)文件赞弥，還是上圖：
這些文件都是由Flutter自動(dòng)生成的。
任何使用到的插件都需要在APP中注冊(cè)趣兄，且和APP生命周期一致绽左。所以也需要將相關(guān)文件導(dǎo)入APP中。
注冊(cè)相關(guān)代碼可以從iOS接入Flutter-Git中查看,就不多贅述艇潭。
4.1 插件中部分代碼修改
如果你是在舊項(xiàng)目中接入Flutter拼窥，那么插件在APP中使用時(shí)大概率會(huì)出問(wèn)題。
這里以image_picker為例：
調(diào)用后沒(méi)有任何反應(yīng)蹋凝，xCode可能還會(huì)報(bào)錯(cuò)鲁纠。通過(guò)查看ImagePickerPlugin.m中的代碼發(fā)現(xiàn)，用于彈出imageVC的VC并不是當(dāng)前視圖最上方的VC而是window.rootViewController鳍寂。
+ (void)registerWithRegistrar:(NSObject<FlutterPluginRegistrar> *)registrar {
...
UIViewController *viewController =
[UIApplication sharedApplication].delegate.window.rootViewController;
...
}
相信大家一看就明白改含，問(wèn)題出在哪里。所以需要手動(dòng)去修改成當(dāng)前VC迄汛。
在iOS接入Flutter-Git中的NavigationRoute提供了獲取當(dāng)前頁(yè)面的通用方法捍壤。
