flutter在线开发,flutter开发工具

Flutter自制工具之fluct助力Flutter快速开发神器

一个帮助开发Flutter应用程序的工具

.----------------------------------------------

| github地址:

|

| pub地址：

|

`----------------------------------------------

该工具无需添加到依赖项中，我们只需要 激活 即可,使用如下命令：

fluct 目前只有两个命令 create 和 gen-assets

在 Flutter 开发过程中，我们创建文件是必须的，而AS自带的创建文件，并没有自动的生成相关的内容，这会让开发者非常的苦恼，类名还需要自己手动敲的话，而该命令，直接可以一步到位。

当运行此命令后，命令行会输出以下内容

可以看到，该命令输出的内容是简单易懂的，我们来简单使用一下吧。

创建 IndexPage 页面，继承自 StatefulWidget ,可以使用如下命令:

运行成功之后，我们会在项目下找到 index_page.dart 文件，内容为:

当然，你也可以指定哪个文件夹，例如，我要在./lib/src/page 文件夹下创建 IndexPage ，使用如下命令

在开始之前，我们需要在项目根目录下新建一个 fluct.yaml 文件,因为 fluct create -t custom 命令会找到它，内容如下：

这里，我声明了 inh 命令，然后运行这个命令之后会在生成文件的时候添加 inh 对应的内容，内容中我们值得注意的是 $NAME$ 占位符，该字符串会被替换成根据文件名生成的内容，例如： index_page 会插入 IndexPage 到 $NAME$ 占位符中，最后，我们运行以下命令:

运行成功之后，我们能够在根目录下找到 index_inherited.dart 文件，内容也是对应的自定义内容

我们在使用资源文件时，需要在 pubspec.yaml 文件声明资源文件的路径

例如：我在 ./assets/images 文件夹下添加 a.png 图片，需要在 pubspec.yaml 文件下声明

或者使用文件夹路径

这一步如果文件多起来，很容易出现混乱，导致声明麻烦，引用麻烦，并随着项目的迭代，资源文件有些不用了，也不知道哪个是哪个，这个时候， fluct gen-assets 命令帮到你

当运行 fluct gen-assets -h 会输出以下内容

到此，你已经拥有了自动资源绑定的功能了，输入 fluct gen-assets 即可

所有的内容都声明好了， very good ~

有小伙伴可能会疑惑， fluct create 运行之后会发现未找到命令，可能你使用了 flutter pub global activate fluct 命令激活，这个时候，我们可以使用 flutter pub run fluct create 运行

相关问答

Q1: Flutter开发--视频播放器

目前Flutter平台主流的两个播放器是video_player和fijkplayer

pub

github

1、Flutter平台官方插件，作者是国外的，有问题沟通比较困难，只能通过提交issue

2、硬解码

4、UI封装： better_player

基于video_player和Chewie的高级视频播放器。它解决了许多典型的用例，并且易于运行。

5、播放器宽高比例与视频内容宽高比例不一致时，会出现图像压缩变形的问题

6、调用原生内核播放器：iOS--AVPlayer， Android--ExoPlayer

7、对于分段源 m3u8 的播放不友好，如果一个切片播放超时，会导致整个播放都失败

8、better_player可以缓存视频，但不能自定义缓存的地址，只能指定key，和缓存的最大内存量（还未研究超出最大的话是不能缓存新的，还是删除最旧的）

9、better_player不能完全自定义UI，只能修改类中的一些开放属性，比如说icon图标，文字颜色啥的

10、无网络有缓存时，封面可以正常展示

11、better_player播放失败有手动retry的设计

pub

github

1、fijkplayer 是一个 Flutter 生态的媒体播放器，是对 ijkplayer 的 Flutter 封装，支持 Android 和 iOS。 fijkplayer 使用 ijkplayer 作为播放器内核，ijkplayer 使用 ffmpeg 进行音视频解封装和解码，同时添加了 Android 和 iOS 平台特有的硬件加速解码能力。

2 、国内有QQ群，但是活跃度也是不高。

3、可以缓存视频，可以自定义缓存的地址，方便后续的内存维护。

4、可以通过FijkPanelWidgetBuilder较大程度上自定义UI。

5、无网络有缓存视频时，无法展示封面，因为内部是通过imageProvider去加载网络图片的。

7、播放失败无手动retry的设计

1、两种播放器都是通过外接纹理方案 (Texture)，将播放器视频画面渲染接入 flutter 中，性能上优于 PlatformView 的接入方法。

如何自己实现？

下面以video_palyer的iOS源码部分解释：

iOS用CVPixelBufferRef将渲染出来的数据存在内存中，Flutter engine会将Texture的数据在内存中直接进行映射无需通过Channel传输，然后Texture Widget就可以把你提供的这些数据显示出来。在我们传输数据的时候会需要将其与 TextureID 绑定，绑定的过程通过BasicMessageChannel实现数据流的传输，以做到实时展示的效果

Q2: 看我如何使用Flutter开发一款盯盘小工具

前言

最近街边讨论买基金大佬们又多起来了，一些技术交流群也时不时看到某某某大佬在讨论股票，看来最近行情很好啊，虽然我不懂交易，但我总觉得可以做些什么来弥补我的不足，于是有了接下来要跟大家分享的“盯盘小工具”。

准备开干

那么接下来我的目标是开发一款PC端的桌面盯盘小工具，特点首先就是小、方便整天盯着电脑屏幕的白领们打开瞧瞧，省去费事各种操作；然后就是无需关注太多费脑筋的指标，所以能够显示名称和涨跌幅即可。有的上面的需求后，那就可以开始搬砖了，但是对于我这种只懂点Android皮毛又没做过桌面应用的人来说，简直是比登天还难，那该咋办？在夜深人静时，我恍然想起了Flutter，没错先来一张图：

还记得当时看Flutter的时候还是1.2版本，如今回过头来看，已经不是曾经那个Flutter了。

搬砖

为了实现这个小小的业余需求并且又能学习Flutter，于是我白天下班回来又开始不同场景不同程序语言的搬砖，重新安装了Flutter的最新开发环境，重新学习Flutter开发-万物皆widget。

功夫不负有心人

效果图展示

当前为最初版本，很多功能还不够完善，后续目标就是完善及优化，

GitHub项目地址：

致谢

为了实现这个小小的业余需求并且又能学习Flutter，我也参考了很多Flutter大佬的开源项目，在此感谢所有优秀的开源项目 _ 。

Q3: flutter 插件开发

new flutter project，选择Flutter Plugin，next，输入插件名，包名，运行平台及编写语言，finish!

如上图，笔者的插件名为log_plugin，选用Android，java语言开发

在自动打开和插件名同名的dart文件，声明要使用其他语言的方法，本例使用java 语言实现Android原生的log输出

编辑 android/src/main/java/com/whh/log_plugin/LogPlugin.java

在onMethodCall方法中，区别声明方法名，以实现该方法逻辑

至此，简单的插件开发完成，接下来测试

example是插件测试工程，打开其中的main.dart

打开已有的或者新建一个flutter app project，在其pubspec.yaml引入插件

使用pub get 关联到插件

详见官网文档

此文为 flutter 初学者记录学习过程，附上 github ，小小分享~

每天进步一点点。。。（2021-08-10）