- Flutter 教程
- Flutter - 首页
- Flutter - 简介
- Flutter - 安装
- 在 Android Studio 中创建简单的应用程序
- Flutter - 架构应用程序
- Dart 编程简介
- Flutter - Widget 简介
- Flutter - 布局简介
- Flutter - 手势简介
- Flutter - 状态管理
- Flutter - 动画
- Flutter - 编写 Android 特定代码
- Flutter - 编写 iOS 特定代码
- Flutter - 包简介
- Flutter - 访问 REST API
- Flutter - 数据库概念
- Flutter - 国际化
- Flutter - 测试
- Flutter - 部署
- Flutter - 开发工具
- Flutter - 编写高级应用程序
- Flutter - 结论
- Flutter 有用资源
- Flutter - 快速指南
- Flutter - 有用资源
- Flutter - 讨论
Flutter - 包简介
Dart 组织和共享一组功能的方式是通过包。Dart 包只是可共享的库或模块。一般来说,Dart 包与 Dart 应用程序相同,只是 Dart 包没有应用程序入口点 main。
包的一般结构(考虑一个演示包 my_demo_package)如下:
lib/src/* - 私有的 Dart 代码文件。
lib/my_demo_package.dart - 主 Dart 代码文件。它可以像这样导入到应用程序中:
import 'package:my_demo_package/my_demo_package.dart'
如果需要,其他私有代码文件可以导出到主代码文件 (my_demo_package.dart) 中,如下所示:
export src/my_private_code.dart
lib/* - 任意数量的 Dart 代码文件,可以按任何自定义文件夹结构排列。代码可以这样访问:
import 'package:my_demo_package/custom_folder/custom_file.dart'
pubspec.yaml - 项目规范,与应用程序相同。
包中的所有 Dart 代码文件只是 Dart 类,对于将 Dart 代码包含在包中,没有特殊要求。
包的类型
由于 Dart 包基本上是类似功能的小集合,因此可以根据其功能进行分类。
Dart 包
通用的 Dart 代码,可以在 Web 和移动环境中使用。例如,english_words 就是这样一个包,它包含大约 5000 个单词,并具有基本的实用程序函数,例如名词(列出英语中的名词)、音节(指定单词中的音节数)。
Flutter 包
通用的 Dart 代码,依赖于 Flutter 框架,只能在移动环境中使用。例如,fluro 是 Flutter 的自定义路由器。它依赖于 Flutter 框架。
Flutter 插件
通用的 Dart 代码,依赖于 Flutter 框架以及底层平台代码(Android SDK 或 iOS SDK)。例如,camera 是一个与设备摄像头交互的插件。它依赖于 Flutter 框架以及底层框架来访问摄像头。
使用 Dart 包
Dart 包托管并在实时服务器 https://pub.dartlang.org 上发布。此外,Flutter 提供了简单的工具 pub 来管理应用程序中的 Dart 包。使用包所需的步骤如下:
将所需的包名称和版本包含到 pubspec.yaml 中,如下所示:
dependencies: english_words: ^3.1.5
可以通过检查在线服务器找到最新的版本号。
使用以下命令将包安装到应用程序中:
flutter packages get
在 Android Studio 中开发时,Android Studio 会检测 pubspec.yaml 中的任何更改,并向开发者显示 Android Studio 包警报,如下所示:
可以使用菜单选项在 Android Studio 中安装或更新 Dart 包。
使用如下所示的命令导入必要的文件并开始工作:
import 'package:english_words/english_words.dart';
使用包中可用的任何方法,
nouns.take(50).forEach(print);
这里,我们使用 nouns 函数获取并打印前 50 个单词。
开发 Flutter 插件包
开发 Flutter 插件类似于开发 Dart 应用程序或 Dart 包。唯一的例外是插件将使用系统 API(Android 或 iOS)来获取所需的平台特定功能。
正如我们已经在前面的章节中学习了如何访问平台代码,让我们开发一个简单的插件 my_browser 来理解插件开发过程。my_browser 插件的功能是允许应用程序在平台特定的浏览器中打开给定的网站。
启动 Android Studio。
单击文件 → 新建 Flutter 项目,然后选择 Flutter 插件选项。
您将看到一个 Flutter 插件选择窗口,如下所示:
输入 my_browser 作为项目名称,然后单击下一步。
在窗口中输入插件名称和其他详细信息,如下所示:
在下面的窗口中输入公司域名 flutterplugins.tutorialspoint.com,然后单击完成。它将生成启动代码来开发我们的新插件。
打开 my_browser.dart 文件,并编写一个方法 openBrowser 来调用平台特定的 openBrowser 方法。
Future<void> openBrowser(String urlString) async {
try {
final int result = await _channel.invokeMethod(
'openBrowser', <String, String>{ 'url': urlString }
);
}
on PlatformException catch (e) {
// Unable to open the browser print(e);
}
}
打开 MyBrowserPlugin.java 文件并导入以下类:
import android.app.Activity; import android.content.Intent; import android.net.Uri; import android.os.Bundle;
在这里,我们必须导入从 Android 打开浏览器所需的库。
在 MyBrowserPlugin 类中添加新的私有变量 mRegistrar,类型为 Registrar。
private final Registrar mRegistrar;
在这里,Registrar 用于获取调用代码的上下文信息。
在 MyBrowserPlugin 类中添加一个构造函数来设置 Registrar。
private MyBrowserPlugin(Registrar registrar) {
this.mRegistrar = registrar;
}
更改 registerWith 以在 MyBrowserPlugin 类中包含我们的新构造函数。
public static void registerWith(Registrar registrar) {
final MethodChannel channel = new MethodChannel(registrar.messenger(), "my_browser");
MyBrowserPlugin instance = new MyBrowserPlugin(registrar);
channel.setMethodCallHandler(instance);
}
更改 onMethodCall 以在 MyBrowserPlugin 类中包含 openBrowser 方法。
@Override
public void onMethodCall(MethodCall call, Result result) {
String url = call.argument("url");
if (call.method.equals("getPlatformVersion")) {
result.success("Android " + android.os.Build.VERSION.RELEASE);
}
else if (call.method.equals("openBrowser")) {
openBrowser(call, result, url);
} else {
result.notImplemented();
}
}
编写平台特定的 openBrowser 方法以在 MyBrowserPlugin 类中访问浏览器。
private void openBrowser(MethodCall call, Result result, String url) {
Activity activity = mRegistrar.activity();
if (activity == null) {
result.error("ACTIVITY_NOT_AVAILABLE",
"Browser cannot be opened without foreground activity", null);
return;
}
Intent intent = new Intent(Intent.ACTION_VIEW);
intent.setData(Uri.parse(url));
activity.startActivity(intent);
result.success((Object) true);
}
my_browser 插件的完整源代码如下:
my_browser.dart
import 'dart:async';
import 'package:flutter/services.dart';
class MyBrowser {
static const MethodChannel _channel = const MethodChannel('my_browser');
static Future<String> get platformVersion async {
final String version = await _channel.invokeMethod('getPlatformVersion'); return version;
}
Future<void> openBrowser(String urlString) async {
try {
final int result = await _channel.invokeMethod(
'openBrowser', <String, String>{'url': urlString});
}
on PlatformException catch (e) {
// Unable to open the browser print(e);
}
}
}
MyBrowserPlugin.java
package com.tutorialspoint.flutterplugins.my_browser;
import io.flutter.plugin.common.MethodCall;
import io.flutter.plugin.common.MethodChannel;
import io.flutter.plugin.common.MethodChannel.MethodCallHandler;
import io.flutter.plugin.common.MethodChannel.Result;
import io.flutter.plugin.common.PluginRegistry.Registrar;
import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
/** MyBrowserPlugin */
public class MyBrowserPlugin implements MethodCallHandler {
private final Registrar mRegistrar;
private MyBrowserPlugin(Registrar registrar) {
this.mRegistrar = registrar;
}
/** Plugin registration. */
public static void registerWith(Registrar registrar) {
final MethodChannel channel = new MethodChannel(
registrar.messenger(), "my_browser");
MyBrowserPlugin instance = new MyBrowserPlugin(registrar);
channel.setMethodCallHandler(instance);
}
@Override
public void onMethodCall(MethodCall call, Result result) {
String url = call.argument("url");
if (call.method.equals("getPlatformVersion")) {
result.success("Android " + android.os.Build.VERSION.RELEASE);
}
else if (call.method.equals("openBrowser")) {
openBrowser(call, result, url);
} else {
result.notImplemented();
}
}
private void openBrowser(MethodCall call, Result result, String url) {
Activity activity = mRegistrar.activity();
if (activity == null) {
result.error("ACTIVITY_NOT_AVAILABLE",
"Browser cannot be opened without foreground activity", null);
return;
}
Intent intent = new Intent(Intent.ACTION_VIEW);
intent.setData(Uri.parse(url));
activity.startActivity(intent);
result.success((Object) true);
}
}
创建一个新项目 my_browser_plugin_test 来测试我们新创建的插件。
打开 pubspec.yaml 并将 my_browser 设置为插件依赖项。
dependencies:
flutter:
sdk: flutter
my_browser:
path: ../my_browser
Android Studio 将提示 pubspec.yaml 已更新,如下所示的 Android Studio 包警报:
单击获取依赖项选项。Android Studio 将从互联网获取包并为应用程序正确配置它。
打开 main.dart 并包含 my_browser 插件,如下所示:
import 'package:my_browser/my_browser.dart';
从 my_browser 插件调用 openBrowser 函数,如下所示:
onPressed: () => MyBrowser().openBrowser("https://flutterdart.cn"),
main.dart 的完整代码如下:
import 'package:flutter/material.dart';
import 'package:my_browser/my_browser.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(
title: 'Flutter Demo Home Page'
),
);,
}
}
class MyHomePage extends StatelessWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(this.title),
),
body: Center(
child: RaisedButton(
child: Text('Open Browser'),
onPressed: () => MyBrowser().openBrowser("https://flutterdart.cn"),
),
),
);
}
}
运行应用程序并单击“打开浏览器”按钮,您将看到浏览器启动。您将看到浏览器应用程序 - 首页,如下面的屏幕截图所示:
您将看到浏览器应用程序 – 浏览器屏幕,如下面的屏幕截图所示: