fconsole 0.0.4+1
fconsole: ^0.0.4+1

Flutter Android iOS

一个用于调试的面板组件

fconsole #

一个用于调试的面板组件,类似微信小程序的v-console:在页面上创建一个可拖拽的悬浮窗,点击悬浮窗可启用log列表面板。

意外情况 #

因为我的Mac mini坏了需要送修,直到1月份,开发进度可能较慢。

苹果💊

开发中 #

此组件仍在开发中,无法提供稳定的使用体验

安装 #

TODO: 上线后补全

使用 #

你需要将ConsoleWidget嵌套在MaterialApp

ConsoleWidget(
  child: MaterialApp(
    home: Scaffold(),
  ),
)

然后才可以使用下列方法:

启动悬浮窗 #

只需要调用顶层方法就可以打开悬浮窗

// 启动悬浮窗
showConsole();
// 隐藏悬浮窗
hideConsole();

拦截原生print函数和未捕获的异常 #

fconsole可以拦截原先的print函数,包括其他库中的print语句和未捕获的throw同样可以被拦截。

要使用此功能,请将runApp替换为runFConsoleApp:

// TODO: 此功能可能需要可配置的参数
void main() => runFConsoleApp(MyApp());

添加log #

使用FConsole添加log非常简单:

// 添加log
FConsole.log("打印了一行log");
FConsole.log("打印了一行log");
FConsole.log("打印了一行log");
// 添加error
FConsole.error("打印了一行error");
FConsole.error("打印了一行error");
FConsole.error("打印了一行error");
FConsole.error("打印了一行error");

然后就可以在FConsole内查看log记录。

创建FlowLog(未完成) #

可以使用FlowLog的形式记录Log:

FlowLog.of('分享启动').log('用户进入页面 $id');
FlowLog.of('分享启动').log('获取到分享值1 $shareId');
FlowLog.of('分享启动').log('查询分享信息1 成功');
FlowLog.of('分享启动').log('获取到分享值2 $shareId');
FlowLog.of('分享启动').log('查询分享信息2 成功');
FlowLog.of('分享启动').log('获取到分享值3 $shareId');
FlowLog.of('分享启动').log('查询分享信息3 成功');
FlowLog.of('分享启动').log('获取到分享值4 $shareId');
FlowLog.of('分享启动').error('查询分享信息4错误: $map');
FlowLog.of('分享启动').end();

FlowLog可以记录用户的一系列行为,在用户出现问题时,通过Console截图即可快速定位问题。

FlowLog的优势在于,在同一页面上的操作可以分开记录,不会互相干扰,例如同时处理两张图片,一张成功而另一张失败,会按id形成两个不同的FlowLog。

上传包 #

flutter packages pub publish --server=https://pub.dartlang.org

已知问题: #

  • 切换的Tab点击面积比看上去小
  • flowlog超时后只能在下一次添加时被记录,应该添加一个定时器记录
  • log功能代码在无需log时生效,可能影响性能,log部分功能最好不要被打包进正式版

待完成 #

  • flowlog的详情页
  • 导出并分享log
  • 增加设置以避免正式线上版出现悬浮窗