【Flutter】开发 Flutter 包和插件 ( Flutter 包和插件简介 | 创建 Flutter 插件 | 创建 Dart 包 )(一)

简介: 【Flutter】开发 Flutter 包和插件 ( Flutter 包和插件简介 | 创建 Flutter 插件 | 创建 Dart 包 )(一)

文章目录

一、Flutter 包和插件简介

二、创建 Flutter 插件

1、Android Studio 中可视化创建

2、命令行创建

三、创建 Dart 包

1、Android Studio 中可视化创建

2、命令行创建





一、Flutter 包和插件简介


" Flutter 包 " 包含 pubspec.yaml 和 lib 代码目录 ;


pubspec.yaml 配置文件 : 配置各种依赖 , 资源等 ;

lib 目录 : 是 Dart 代码所在目录 ;


Flutter 包的类型 :


Dart 包 : 仅涉及 Dart 代码 , 将 Dart 代码封装一下 , 实现特定功能 , 如解析 JSON 字符串等 , 不涉及到与 Native 应用的交互 ;

插件包 : 是专用的 Dart 包 , 包含 Dart API , 针对 Android 的 Java / Kotlin , 或 针对 iOS 的 Objective-C / Swift 的实现 , 如之前使用的拍照插件包 , 在 Android 平台使用了 Android 相机的代码 , 在 iOS 中调用了 iOS 相机相关功能 ;





二、创建 Flutter 插件



1、Android Studio 中可视化创建


可视化方式创建 " Flutter 包或插件 " :


前提 : Android Studio 中 安装了 Flutter 和 Dart 插件 , 这也是开发 Flutter 的前提 ; 菜单栏选择 " Flie / Settings … " 弹出的如下对话框中 , 选择 " Plugin " 选项 , 如下就是安装了 Flutter 和 Dart 插件 ;

image.png



在 菜单栏 选择 " File / New / New Flutter Project… " 选项 ;

image.png



在弹出的如下对话框中 , 选择 " Flutter Plugin " 就是创建 Flutter 插件 , 这里选择创建 Flutter 插件 ;


( 如果选择 " Flutter Package " , 就是创建 Flutter 包 )


image.png


输入 Flutter 插件名称 , 然后点击 " Finish " 完成创建 ;


image.png


插件包创建完毕 :


image.png


插件包目录结构介绍 :


lib : Dart 代码目录 , 在默认生成的 flutter_plugin.dart 代码中 , 使用了 MethodChannel 与 Android / iOS 本地应用进行通信 ;

pubspec.yaml : 配置了依赖 , 以及相关说明 ;

android : 存放插件中 Android 部分代码 ; android\src\main\kotlin\com\example\flutter_plugin 目录中的 FlutterPlugin.kt 就是 Android 对应的插件 ; Android 开发者可以开发 android 目录下的代码 , 开发 Android 平台的对应功能 ;

ios : 存放插件中 iOS 部分代码 ; ios\Classes 目录中的 FlutterPlugin.m 就是 iOS 中对应的插件 ; iOS 开发者可以开发 iOS 目录下的代码 , 开发 iOS 平台的对应功能 ;


Flutter 与本地应用通信参考 【Flutter】Flutter 混合开发 ( Flutter 与 Native 通信 | 完整代码示例 ) 代码 ;



2、命令行创建


执行如下命令 , 创建 组织名为 com.example , 名称是 flutter_plugin 的 Flutter 插件包 ;


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


--org 设置组织名 , 即 Android 中的包名 ;

--template 设置当前创建的工程类型 , plugin 表示 Flutter 插件包 ;

flutter_plugin 表示插件包的名称 ;

image.png



D:\flutter>flutter create --org com.example --template=plugin flutter_plugin
Creating project flutter_plugin...
  flutter_plugin\.gitignore (created)
  flutter_plugin\.idea\libraries\Dart_SDK.xml (created)
  flutter_plugin\.idea\modules.xml (created)
  flutter_plugin\.idea\runConfigurations\example_lib_main_dart.xml (created)
  flutter_plugin\.idea\workspace.xml (created)
  flutter_plugin\.metadata (created)
  flutter_plugin\CHANGELOG.md (created)
  flutter_plugin\lib\flutter_plugin.dart (created)
  flutter_plugin\LICENSE (created)
  flutter_plugin\flutter_plugin.iml (created)
  flutter_plugin\pubspec.yaml (created)
  flutter_plugin\README.md (created)
  flutter_plugin\test\flutter_plugin_test.dart (created)
Running "flutter pub get" in flutter_plugin...                     721ms
  flutter_plugin\example\.gitignore (created)
  flutter_plugin\example\.idea\libraries\Dart_SDK.xml (created)
  flutter_plugin\example\.idea\libraries\KotlinJavaRuntime.xml (created)
  flutter_plugin\example\.idea\modules.xml (created)
  flutter_plugin\example\.idea\runConfigurations\main_dart.xml (created)
  flutter_plugin\example\.idea\workspace.xml (created)
  flutter_plugin\example\.metadata (created)
  flutter_plugin\example\lib\main.dart (created)
  flutter_plugin\example\flutter_plugin_example.iml (created)
  flutter_plugin\example\pubspec.yaml (created)
  flutter_plugin\example\README.md (created)
  flutter_plugin\example\test\widget_test.dart (created)
Running "flutter pub get" in example...                            758ms
Wrote 25 files.
All done!
Your plugin code is in flutter_plugin\lib\flutter_plugin.dart.
You example app code is in flutter_plugin\example\lib\main.dart.
You've created a plugin project that doesn't yet support any platforms.
To add platforms, run `flutter create -t plugin --platforms <platforms> .` under flutter_plugin.
For more information, see https://flutter.dev/go/plugin-platforms.
D:\flutter>


目录
相关文章
|
2月前
|
传感器 Android开发 iOS开发
Flutter插件开发指南02: 事件订阅 EventChannel
上一节我们讲了 Channel 通道,但是如果你是卫星定位业务,原生端主动推消息给 Flutter 这时候就要用到 EventChannel 通道了。 本节会写一个 1~50 的计数器,到 50 后自动关闭原生的消息订阅。
Flutter插件开发指南02:  事件订阅 EventChannel
|
2月前
|
Java Linux API
Flutter插件开发指南01: 通道Channel的编写与实现
Flutter插件是Flutter应用程序与原生平台之间的桥梁,使得Flutter应用程序可以与原生代码进行交互,从而扩展Flutter应用程序的功能和能力。Flutter插件通常包括Dart和原生代码(例如Java、Kotlin或Objective-C、Swift等),并可以通过Flutter插件框架来注册、管理和调用。
Flutter插件开发指南01: 通道Channel的编写与实现
Doodle Jump — 使用Flutter&Flame开发游戏真不错!
用Flutter&Flame开发游戏是一种什么体验?最近网上冲浪的时候,我偶然发现了一个国外的游戏网站,类似于国内的4399。在浏览时,我遇到了一款经典的小游戏:Doodle Jump...
112713 11
flutter-barrage-craft — 能成为pub.dev中最好用的弹幕插件吗🤔?
Hi👋,最近我开发了一个弹幕插件,想知道它是否有成为 pub.dev 中最好用的弹幕插件的潜力。能帮我评估一下吗?🐱‍🏍
|
11天前
|
移动开发 前端开发 JavaScript
移动端 Hybrid 开发:RN、Flutter与Webview的抉择与融合
【4月更文挑战第6天】本文对比了移动端Hybrid开发的三种主流方案——React Native (RN),Flutter和Webview。RN基于JavaScript,适合React熟练的团队,适用于性能要求高、跨平台的中大型应用。Flutter,使用Dart语言,以其高性能和自定义UI适用于追求极致体验的项目。Webview适合快速移植Web应用至移动端,开发成本低但性能受限。选择时要考虑项目规模、性能需求、团队技术栈等因素,实际应用中常采用混合策略,如RN/Flutter+Webview、原生模块集成等,以实现最佳开发效果和长期技术规划。
51 0
|
1月前
|
运维 监控 定位技术
应用研发平台EMAS常见问题之flutter插件不支持自定义图标如何解决
应用研发平台EMAS(Enterprise Mobile Application Service)是阿里云提供的一个全栈移动应用开发平台,集成了应用开发、测试、部署、监控和运营服务;本合集旨在总结EMAS产品在应用开发和运维过程中的常见问题及解决方案,助力开发者和企业高效解决技术难题,加速移动应用的上线和稳定运行。
76 0
|
2月前
|
Dart JavaScript
Flutter - Dart 基础(数据类型)
【2月更文挑战第3天】
61 1
|
2月前
|
Dart JavaScript 安全
|
2月前
|
Dart Shell 开发工具
解决windows安装Flutter时出现Unknown operating system. Cannot install Dart SDK.问题
解决windows安装Flutter时出现Unknown operating system. Cannot install Dart SDK.问题