轻松打开Excel文件的多种实用方法与技巧探索
885
2022-05-30
背景
本文我们将开一下脑洞,在 Flutter 工程基础上下集成及运行小程序方案。
先看一下效果如下:
新建 Flutter 样例工程
Flutter 的安装
Flutter 的安装可参考https://flutterchina.club/get-started/install/具体上主要执行以下三步即可。本文将使用 Flutter1.12.hotfix8 稳定版作为开发环境。
下载 FlutterSDK
配置 PATH 环境路径
flutter doctor 检查环境
新建 Flutter 工程
flutter create --template=app --org=com.finogeeks.flutter --project-name=mini_flutter -i objc -a java ./mini_flutte
执行以上命令后,正常将会提示以下信息
All done! [✓] Flutter: is fully installed. (Channel stable, v1.12.13+hotfix.8, on Mac OS X 10.15.3 19D76, locale zh-Hans-CN) [✓] Android toolchain - develop for Android devices: is fully installed. (Android SDK version 29.0.3) [✓] Xcode - develop for iOS and macOS: is fully installed. (Xcode 11.3.1) [✓] Android Studio: is fully installed. (version 3.6) [!] IntelliJ IDEA Ultimate Edition: is partially installed; more components are available. (version 2019.3.3) [✓] VS Code: is fully installed. (version 1.42.1) [!] Proxy Configuration: is partially installed; more components are available. [✓] Connected device: is fully installed. (1 available) Run "flutter doctor" for information about installing additional components. In order to run your application, type: $ cd mini_flutte $ flutter run Your application code is in mini_flutter/lib/main.dart.
注意!flutter 需要依赖本地安装对应的 iOS,Android 开发工具,即需要安装 Xcode 和 AndroidStudio。具体安装使用方法这里不赘述。
这里我们用 VSCode+Xcode 作为开发组合环境,如果要正常调试需要确保以下三个检查项目是正常的。
[✓] Xcode - develop for iOS and macOS: is fully installed. (Xcode 11.3.1)
Flutter: is fully installed. (Channel stable, v1.12.13+hotfix.8, on Mac OS X 10.15.3 19D76, locale zh-Hans-CN)
VS Code: is fully installed. (version 1.42.1)
[!] Proxy Configuration: is partially installed; more components are available.
集成小程序解析引擎
这里我们采用凡泰免费社区版的小程序解析引擎,只需要 10 行代码量不到即可完成小程序集成。
引入小程序引擎插件。在 pubspec.yaml 文件中引入小程序 Flutter 插件
mop: ^0.2.0
2.在 main.dart 文件中增加以下小程序引擎初始化方法。Mop.instance.initialize这里需要用到 sdkkey 和 secret。可以直接在https://mp.finogeeks.com免费注册获取。注册使用方法可以参考接入指引
// Platform messages are asynchronous, so we initialize in an async method. Future
3、在主界面上增加三个按钮来打开小程序
Center( child: Container( padding: EdgeInsets.only( top: 20, ), child: Column( children:
4、运行 Flutter 程序
在代码根目录执行 flutter devices 查看本机安装的模拟器。
执行 flutter run --debug 运行示例,运行效果之如本文最前面所展示的图示。
文档中心: Document
本文示例代码: https://github.com/finogeeks/mop-flutter-demo
相关文章:深入小程序系列之一:小程序核心原理及模拟
关于凡泰极客:帮助金融机构乃至任何希望拥有类似技术的其他行业机构,建立“碎片”的集散地、降低管理成本、提高研发效能,形成自己的数字化生态、与客户和伙伴建立真正的数字化连接。
小程序
版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。