この記事では、深さであなたとの取引フラッターの理解をし、プラグインのインストールパッケージの原則、開発サポートを混合達成するために、既存のAndroidプロジェクトにすばやく完全なフラッタ統合をあなたを助けるために。
前文:
I.はじめに
クロスプラットフォームのフレームワークの様々な出現により、多くの時間が、私たちは足場として複合用途開発モードを選択します、それは新しいプロジェクトでない限り、企業は一般的に、ビジネスのフレームワーク上のすべての圧力をかけていないため、または再オリジナルのサービスのために構造コストとリスクの考慮事項は、ピットの中にミックスを開発しようとすることを選択するでしょう。
しかし、複合用途開発がされるだろう、このような高い建物として、パッケージ化され、プロセスを開始することは精通している必要があり、私は前に、だけでなく、多くの問題React Native
にも同様の記事を書いた:ネイティブ開発(IVパッケージフロー分析を反応させること」のAndroidからのそして、」)Mavenのリポジトリとして公開、および一般的なことができ、この分野で多くの経験があり、その適切なオープン混合モードは、だけで理解することによって問題のいくつかを回避するのに役立つFlutter
総合的なプロジェクトを考えて建物を、それが可能な、より快適に横たわってピットになります。
より、クロスプラットフォームのマルチターミナル統一ロジックを解決するために、少なくとも達成するために、繰り返しロジックを避けるために、その会社は始まったばかり、一般的にしようとするいくつかの軽量のビジネスを選択する意味追加しつこい1、。
第二に、包装
一般的に混合されているクロスプラットフォームの開発は、2つの選択肢があります。
- 1、
Flutter
全体的なフレームワークおよびパッケージのスクリプトに依存しているが、メインプロジェクトに統合されています。 - 図2は、
aar
完全に統合されたライブラリーを形成し、メインプロジェクトに追加しました。
二つの方法には長所と短所があります。
あなたができる最初の方法より簡単に操作上の問題を修正するが、主な項目「公害は」比較的高くなり、変化が大きくなります。
第二の方法の別々の更新デバッグする必要がある
aar
し、ファイルを、プロジェクトの試運転に統合されますが、統合されたこの種のアプローチはきれいで、Flutter
関連するコードは独立してテストされ、若干の変更を実行することができます。
一般的に、私は、平均プロジェクトのためにお勧めします第二の方法のプロジェクトに統合され、新たな作成することによって、Flutter
プロジェクトをした後、コンポーネントベースのスクリプトを動作しますが、あなたは一人でAPKフォームにデバッガを実行するだけでなく、としてパッケージ化することができますだけでなく、外部からの支援のAARフォーム。
私たちは、単純にして、プロジェクトを変更することができることを知っている必要がありネイティブプラットフォームはお馴染みのことを信じてgradle
写真のように、それはすぐにこの機能をサポートし、スクリプト、画像は省略スクリプトコード、フルバージョンの一部として見ることができるflutter_app_lib。
私たちは、渡されたisLib
プロジェクトの簡易包装の判断を達成するためのマークを、としてプロジェクトときlib
出版が、設定されてisLib
trueに、実行は./gradlew assembleRelease
でき、作業の残りの部分はまだFlutter
その梱包プロセス、およびパッケージ化のためにaar
直接ネイティブのプロジェクト内のファイル導入に依存を完了します。
一般アクセスしながら、所望の場合token
、ユーザデータ情報のようなネイティブインタフェース、の良い定義を提供することを推奨init(String token, String userInfo)
他に、次にMethodChannel
情報をに同期されますFlutter
。
对于原生主工程,只需要接入 aar
文件,完成初始化并打开页面,而无需关心其内部实现,和引入普通依赖并无区别。
你可能需要修改的还有
AndroidManifset
中的启动MainActivity
移除,然后添加一个自定义Activity
去继承FlutterActivity
完成自定义。
三、插件
如果普通情况下,到上面就可以完成 Flutter
的集成工作了,但是往往事与愿违,一些 Flutter
插件在提供功能时,往往是通过原生层代码实现的,如 flutter_webview
、android_intent
、device_info
等等,那这些代码是怎么被引用的呢?
这里稍微提一下,用过
React Native
的应该知道,带有原生代码的React Native
插件,在npm
安装以后,需要通过react-native link
命令完成安装处理。
这个命令会触发脚本修改原生代码,从而修改gradle
脚本增加对插件项目的引用,同时修改java
代码实现插件的模版引入,这使得项目在一定程度被插件“污染”。
在 React Native
中带有原生代码的插件,会被以本地 Module
工程的方式引入,那 Flutter
呢?
其实原理上 Flutter
带有原生代码的插件,在插件安装后,也是会以本地 Module Project
的形式引入 ,但是它整个过程更加巧妙,让开发中对这个过程几乎无感。
如下图所示,不知道你注意过没有,在插件安装之后,所有带原生代码的插件,都会以路径和插件名的key=value
形式 存在 .flutter-plugins
文件中。
而在 android
工程的 settings.gradle
里,如下图所示,会通过读取该文件将 .flutter-plugins
文件中的项目一个个 include
到主工程里。
之后就是主工程里的 apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"
脚本的引入了,这个脚本一般在于 flutterSDK/packages/flutter_tools/gradle/
目录下,如下代码所示,其中最关键的部分同样是 读取 .flutter-plugins
文件中的项目,然后一个一个再 implementation
到主工程里完成依赖。
自此所有原生代码的 Flutter
插件,都被作为本地 Module Project
的形式引入主工程了 ,最后脚本会自动生成一个 GeneratedPluginRegistrant.java
文件,实现原生代码的引用注册, 而这个过程对你完全是无感的。
说了那么多就是为了说明,既然插件是被当作本地 Module Project
的形式引入,那么这时候按照原来直接打包 aar 是会有问题的:
`Android` 默认 `gradle` 脚本打包时,对于 `project` 和远程依赖只会打包引用而不会打包源码和资源的。
所以这时候就需要 fat-aar
的加持了,关于 fat-aar
的详细概念可见 :《从Android到React Native开发(四、打包流程解析和发布为Maven库)》 ,这里可以简单理解为,这是一个支持将引用代码和资源到合并到一个 aar 的插件。
如下代码所示,我们在原本的组件化脚本上,通过增加 apply plugin: 'com.kezong.fat-aar'
引入插件,然后参考 Flutter
脚本对 .flutter-plugins
文件中的项目进行 embed
依赖引用即可 ,这时候再打包出的 aar
文件即为完整 Flutter
项目代码。
完整版可见 flutter_app_lib 。
四、堆栈
最后需要说的问题就是堆栈了。
如果说混合开发中最难处理的是什么,那一定是各平台之间的堆栈管理,一般情况下我们都会避免混合堆栈的相互调用 ,但是面对不得不如此为之的情况下,闲鱼给出了他们的答案:fluttet_boost
。
我们知道 Flutter
整个项目都是绘制在一个 Surface
画布上,而fluttet_boost
将堆栈统一到了原生层,通过一个单例的 flutter engine
进行绘制。
每个 FlutterFragment
和 FlutterActivity
都是一个 Surface
承载容器,切换页面时就是切换 Surface
渲染显示,而对于不渲染的页面通过 Surface
截图缓存画面显示。
这样整个 Flutter
的路由就被映射到原生堆栈中,统一由原生页面堆栈管理,Flutter
内每 push
一个页面就是打开一个 Activity
。
flutter_boost
截止到我测试的时间 2019-05-16, 只支持 1.2之前的版本。flutter_boost
的整体流程相对复杂,同时对于Dialog
的支持并不好,且业务跳转深度太深时会出现黑屏问题。
自此,第十四篇终于结束了!(///▽///)
资源推荐
- Github : https://github.com/CarGuo
- 本文Demo :https://github.com/CarGuo/flutter_app_lib
- 推奨完全なコード:https://github.com/CarGuo/GSYGithubAppFlutter
完全なオープンソースプロジェクトを推奨します:
記事
「フラッターは(、ダート言語とフラッタベース)を説明し、戦闘の開発を完了します。」
「フラッターは、(実際の戦闘片の第二に、急速な発展を)説明し、戦闘の開発を完了します。」
「フラッタは、(IIIパッケージ化され、充填されたピットの章)を説明する戦闘の開発を完了します」
「フラッターは(4、Reduxの、テーマ、国際)を説明し、戦闘の開発を完了します」
「フラッターは(イン深さ探査5)を説明戦闘の開発を完了します」
「フラッターは(6綿密ウィジェット原理)を説明戦闘の開発を完了します。」
「フラッターは(7綿密なレイアウト原理)を説明戦闘の開発を完了します。」
「フラッターは、戦闘の開発は(8つの実用的なヒントと満たされたピット)を説明完了します」
「フラッターは、(IX深絞り原理)を説明戦闘の開発を完了します。」
「フラッタは(10、深い画像ロード処理)を説明戦闘の開発を完了します。」
「フラッターは、(XI-深い理解ストリーム)を説明し、戦闘の開発を完了します」
「フラッターは、(設計管理の状態のXII-深い理解を)説明し、戦闘の開発を完了します」
「フラッターは、(XIII-深さのタッチとスライド原理)を説明し、戦闘の開発を完了します。」
「クロスプラットフォームプロジェクトのオープンソースプロジェクトの勧告」