Flutter官方文档

这篇指南是针对Android开发者的,目的是让一个没有接触过Flutter的Android程序员快速开发出Flutter插件, 所以笔者默认各位读者已经有了JDK、SDK、Android Studio等开发环境和IDE。

Flutter环境搭建

1.下载Flutter SDK

Flutter SDK Archive

2.解压下载到的压缩包

解压路径如D:\env\flutter,不要解压到Program Files目录下,因为操作该目录需要更高的权限。

3.安装Flutter

进入flutter根目录,双击flutter_console.bat,等待flutter安装完成。

tips:

如果想要在一般的cmd中直接使用flutter commands,需要配置环境变量:
将你的flutter\bin路径添加到环境变量path
然后重新打开cmd,运行flutter help确认结果

4.确认Flutter环境

运行以下命令:

flutter doctor

一般输出如下:

C:\Users\wxj>flutter doctorDoctor summary (to see all details, run flutter doctor -v):[√] Flutter (Channel stable, v1.2.1, on Microsoft Windows [Version 6.1.7601],    locale zh-CN)[!] Android toolchain - develop for Android devices (Android SDK version 28.0.3)    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor      --android-licenses[!] Android Studio (version 2.3)    X Flutter plugin not installed; this adds Flutter specific functionality.    X Dart plugin not installed; this adds Dart specific functionality.[!] Android Studio (version 3.2)    X Flutter plugin not installed; this adds Flutter specific functionality.    X Dart plugin not installed; this adds Dart specific functionality.[!] Connected device    ! No devices available! Doctor found issues in 4 categories.C:\Users\wxj>

可见检查出了4个问题,除了Android Studio没有安装flutter插件的提示外,其他没什么需要注意的。

5.Android Studio安装Flutter插件

  • 启动AS
  • 进入插件页面 (Preferences > Plugins on macOS, File > Settings > Plugins on Windows & Linux).
  • 选择Browse repositories, 搜索flutter,安装Flutter plugin
  • 安装完成后重启AS

测试Flutter开发环境

创建一个test工程,测试flutter开发环境。

  • 选择File > New Flutter Project
  • 选择Flutter application作为应用类型
  • Flutter SDK Path一栏指定你的flutter SDK安装路径
  • 输入项目名称,点击下一步
  • 等待AS创建工程
  • 运行main.dart(第一次运行需要较长时间的编译)

运行成功后设备上会看到如下页面

说明flutter开发环境已就绪。接下来就可以开发你的flutter插件了。

开发你的Flutter项目

在开始前,首先要确定你是要开发一个dart package还是一个plugin package,我们是要为既存的sdk开发一个flutter插件,所以是plugin package。

创建项目有两种方式:命令行 和 Android Studio/create flutter project,下面是命令行创建,你也可以通过Android Studio的UI创建,注意在创建时选对你要创建Dart package还是plugin package即可。

dart package

Dart package是通过 --template=package 创建的:

 flutter create --template=package hello

该命令会创建一个 hello/ 目录,其中包括:

  • lib/hello.dart:
    该包的Dart代码.
  • test/hello_test.dart:
    该包的单元测试代码.

plugin package

创建package

plugin package是通过 --template=plugin 创建的。

 flutter create --org com.example --template=plugin hello

上述命令会创建一个 hello/ 文件夹,其内容如下:

  • lib/hello.dart:
    你要实现的插件的dart api
  • android/src/main/java/com/example/​hello/HelloPlugin.java:
    插件api的安卓平台实现
  • ios/Classes/HelloPlugin.m:
    插件api的ios平台实现
  • example/:
    flutter的示例应用

默认使用OC和java,如果想使用swift或者kotlin,那么可以指定,ios用-i,android用-a:

flutter create --template=plugin -i swift -a kotlin hello

接下来就可以开发你的flutter plugin了,最后你可能会想要写一些文档,可以参考:
Adding documentation

发布到pub.dartlang.org

开发完成后你可以将你的插件发布到Pub site,方便用户使用。

在发布之前,先确认一下pubspec.yaml文件中关于plugin的设置是否正确:

# The following section is specific to Flutter.flutter:  # This section identifies this Flutter project as a plugin project.  # The androidPackage and pluginClass identifiers should not ordinarily  # be modified. They are used by the tooling to maintain consistency when  # adding or updating assets for this project.  plugin:    androidPackage: cn.smssdk.flutter    pluginClass: MobsmsPlugin

这里要指定正确的plugin的包名和类名,androidPackage只有android用得到,而pluginClass则是iOS和Android都要用到的,所以类名需要统一。这里的设置会上传到flutter服务器,当用户在线集成你的plugin时,flutter会根据这个设置自动帮用户生成下面这个类:

package io.flutter.plugins;import io.flutter.plugin.common.PluginRegistry;import cn.smssdk.flutter.MobsmsPlugin;/** * Generated file. Do not edit. */public final class GeneratedPluginRegistrant {  public static void registerWith(PluginRegistry registry) {    if (alreadyRegisteredWith(registry)) {      return;    }    MobsmsPlugin.registerWith(registry.registrarFor("cn.smssdk.flutter.MobsmsPlugin"));  }  private static boolean alreadyRegisteredWith(PluginRegistry registry) {    final String key = GeneratedPluginRegistrant.class.getCanonicalName();    if (registry.hasPlugin(key)) {      return true;    }    registry.registrarFor(key);    return false;  }}

所以,如果之前没有指定正确的plugin包名和类名, 就会导致自动生成的代码中出现错误。

如果是在flutter项目下直接查看java代码,可能会提示import cn.smssdk.flutter.MobsmsPlugin找不到,无法使用相关类,不用在意,你可以"右键flutter项目 → Flutter → Open Android Module in Android Studio",直接打开flutter的安卓项目,AS会自动下载相关依赖(包括插件中的module),在该视图下编译就不会有报错了,并且这两边会自动同步,任意一边运行项目都会产生同一个flutter apk。

  1. 通过以下命令,验证项目没有问题:
flutter packages pub publish --dry-run
  1. 通过以下命令发布:
flutter packages pub publish

用户如何使用你的插件

以mobsms插件的集成为例。

1. dart代码集成

在 hello/pubspec.yaml 中添加以下代码:

dependencies:  mobsms: ^0.0.3

在你项目的Dart中添加以下代码:

 import 'package:mobsms/mobsms.dart'

这样,就可以在你的main.dart中使用mobsms plugin中定义的dart api了。

2. 平台相关(android/ios)代码集成

Android

在 hello/android/build.gradle中添加:

android {    // lines skipped    dependencies {        provided rootProject.findProject(":mobsms")    }}

这样就可以在你的hello/android/src下的类中import cn.smssdk.flutter.MobsmsPlugin并使用MobsmsPlugin中的api了。

Java代码仍然建议在Android视图下查看,不要在Flutter视图下查看。

iOS

hello/ios/hello.podspec中:

Pod::Spec.new do |s|  # lines skipped  s.dependency 'mob_smssdk'

这样就可以在你的hello/ios/Classes下的类中#import "MobsmsPlugin.h"并使用MobsmsPlugin中的api了。

更多信息可参考 Handling package interdependencies

Demo

如果你是要开发一个Plugin Package,可以参考 mobsms
SMSSDK-for-Flutter

如果你要开发一个Dart Package,需要集成第三方Plugin Package,可以参考:
sms_flutter_tester

更多相关文章

  1. Android省电开发 浅析
  2. Android(安卓)数据库创建字段时的数据类型
  3. android开发简单的计算器
  4. Android(安卓)开发——浅谈onInterceptTouchEvent、onTouchEvent
  5. Android(安卓)OpenGL ES 绘图 --简单绘图
  6. 入门: 在Windows上搭建Flutter开发环境
  7. Android中定时任务的实现(总结)
  8. 通过抢红包插件学习Accessibility Service
  9. (四)Kotlin 领域特定语言 DSL

随机推荐

  1. Android 采用HttpClient提交数据到服务器
  2. android TextView 加载html 显示图片并且
  3. Ubuntu 14.04 编译 Android(安卓)4.2.2 f
  4. Android弹出软键盘时如何将底部顶上去
  5. 初学Android,数据存储之使用SQLite数据库
  6. 【Android高级】Android系统以及Activity
  7. 关于Android这个名字。。。
  8. 为Android(和其他移动平台)安装MoSync
  9. android热更新
  10. Android(安卓)View 绘制刷新流程分析