Flutter進階—平臺外掛
這篇文章我們會學習Flutter應用程式如何與iOS和Android裝置上可用的平臺特定程式碼整合,這包括裝置API,(比如url_launcher和battery)和第三方平臺SDK(比如Firebase)。
使用現有的平臺外掛
Flutter外掛是一種特殊的包,一個外掛包含一個用Dart編寫的API定義,結合Android的平臺特定實現,適用於iOS或兩者相容。
搜尋外掛
現有的Flutter外掛可以在Flutter外掛倉庫查詢,其顯示在pub儲存庫中共享的外掛。因為Flutter仍然是一個年輕的語言,目前在pub上只有一小部分外掛,需要作為Flutter程式設計師的我們開發和釋出新的外掛!
在程式中新增外掛
如果要新增一個外掛“plugin1”到一個應用程式:
開啟您的應用程式資料夾中的pubspec.yaml檔案,並在dependencies下新增plugin1
獲取外掛
在終端中:執行flutter packages get
在IntelliJ中:在pubspec.yaml頂部的動作功能區中點選“Packages Get”構建或執行您的應用程式,作為其中的一部分,Flutter將“插入”平臺特定的程式碼,從外掛到您的應用程式。
演示例項
URL Launcher外掛允許您開啟移動平臺上的預設瀏覽器來顯示給定的URL,它在Android和iOS上均受支援。我們就寫一個使用Flutter URLLauncher外掛啟動瀏覽器的例項。
首先開啟pubspec.yaml,並新增url_launcher外掛:
dependencies:
flutter:
sdk: flutter
url_launcher: "^2.0.2"
新增完成之後記得點選頂部的“Packages Get”,然後再開啟lib/main.dart,並將其全部內容替換為以下程式碼:
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
home: new DemoPage(),
);
}
}
class DemoPage extends StatelessWidget {
launchURL() {
launch('https://www.baidu.com/');
}
@override
Widget build(BuildContext context) {
return new Scaffold(
body: new Center(
child: new RaisedButton(
onPressed: launchURL,
child: new Text('百度首頁'),
)
)
);
}
}
執行應用程式,當您點選“百度首頁”時,您應該會看到手機的預設瀏覽器開啟,並顯示百度首頁。
建立一個平臺外掛
如果您希望在多個Flutter應用程式中使用特定於平臺的程式碼,將程式碼分離到位於主應用程式之外的目錄中,作為平臺外掛是很好的方案,甚至還能分享給所有Flutter開發人員。
您可以使用–plugin標記與flutter create建立一個外掛專案。使用–org選項指定您的組織,使用反向域名符號,該值用於生成的Android和iOS程式碼中的各種包和包識別符號。
flutter create --org com.example --plugin hello
這將在hello/資料夾中建立一個包含以下內容的外掛專案:
lib/hello.dart
外掛的Dart APIandroid/src/main/java/com/yourcompany/hello/HelloPlugin.java
Android平臺具體實現外掛APIios/Classes/HelloPlugin.m
iOS平臺具體實現外掛APIexample/
一個如何使用外掛的Flutter應用程式,外掛的使用說明
預設情況下,該外掛專案使用Objective-C的iOS程式碼和Java的Android程式碼。如果您喜歡Swift或Kotlin,則可以使用-i指定iOS語言或使用-a指定Android語言。
flutter create --plugin -i swift -a kotlin hello
編輯外掛的原始碼
外掛API程式碼(.dart)
要編輯Dart外掛API程式碼,需要在IntelliJ IDEA(或者您喜歡的Dart編輯器)中開啟hello/,外掛API位於專案檢視中顯示的lib/main.dart中。
要執行外掛,您需要啟動外掛示例應用程式,這需要定義啟動配置:
- 選擇“Run > Edit Configurations…”
- 選擇“+”,然後選擇“Flutter”
- 在“Dart entrypoint”,輸入
<plugin folder>/example/lib/main.dart
- 選擇“OK”
- 使用“Run”或“Debug”啟動示例應用程式
Android平臺的程式碼(.java/.kt)
在Android Studio中編輯Android平臺程式碼之前,首先要確保程式碼已經構建至少一次,即從IntelliJ執行示例應用程式,或在終端中執行cd hello/example; flutter build apk
。
接下來,進行以下操作:
- 啟動Android Studio
- 在“Welcome to Android Studio”對話方塊中選擇“Import project”,或者在選單中選擇“File > New > Import Project…”,然後選擇
hello/example/android/build.gradle
檔案 - 在“Gradle Sync”對話方塊中,選擇“OK”
- 在“Android Gradle Plugin Update”對話方塊中,選擇“Don’t remind me again for this project”
您的外掛的Android平臺程式碼位於hello/java/com.yourcompany.hello/HelloPlugin
中,您可以通過按▶按鈕從Android Studio執行示例應用程式。
iOS平臺的程式碼(.h+.m/.swift)
在編輯Xcode中的iOS平臺程式碼之前,首先要確保程式碼已經構建至少一次,即從IntelliJ執行示例應用程式,或在終端中執行cd hello/example; flutter build ios
。
接下來,進行以下操作:
- 啟動Xcode
- 選擇“File > Open”,然後選擇
hello/example/ios/Runner.xcworkspace
檔案
外掛的iOS平臺程式碼位於專案導航器中的Pods/Development Pods/hello/Classes/
中,您可以通過按▶按鈕執行示例應用程式。
管理從Flutter程式到Flutter外掛的依賴關係
一旦外掛已經發布,您可以依賴它,只需在pubspec.yaml中列出它的名稱,比如上面的例子。在開發尚未釋出的外掛或者不適用於公開發布的私有外掛的開發中,依賴於外掛還有其他的方法:
- Path依賴:Flutter應用程式可以通過檔案系統路徑依賴
path: dependency
,該路徑可以是相對的,也可以是絕對路徑。例如,要使用位於應用程式旁邊的目錄中的外掛“plugin1”,請使用以下語法:
dependencies:
flutter:
sdk: flutter
plugin1:
path: ../plugin1/
- Git依賴:您還可以依賴於儲存在Git儲存庫中的包,包必須位於報告(Repo)的根部,使用以下語法:
dependencies:
flutter:
sdk: flutter
plugin1:
git:
url: git://github.com/flutter/plugin1.git
釋出平臺外掛
一旦你實現了外掛,你可以在Pub釋出。這使得其他開發人員可以輕鬆地使用它,如同上述UrlLauncher的演示例項。釋出的方法會在以後的文章中詳細講解…