【Flutter】Flutter 调试 ( Debug 调试窗口 | 手机日志信息查看 | 设置普通断点 | 设置表达式断点 )

举报
韩曙亮 发表于 2022/01/11 01:59:15 2022/01/11
【摘要】 文章目录 一、Flutter 调试简介二、Debug 调试窗口三、手机日志信息查看四、设置普通断点五、设置表达式断点六、相关资源 一、Flutter 调试简介 Fl...





一、Flutter 调试简介



Flutter 调试 : 定位问题点 , 运行时对表达式 , 变量的值进行实时跟踪 , 单步执行调试代码 ;

  • 断点调试
  • 变量视窗 Variables
  • 观察视窗 Watches
  • 调试时回退 Frames
  • 控制台窗口 Console




二、Debug 调试窗口



Flutter 调试工具 Debug : 点击下图的 Debug 按钮 , 即可进行调试 ,

在这里插入图片描述

调试 Flutter 项目时 , 底部显示 Debug 视窗 ,

在这里插入图片描述

Debug 视窗左侧是项目运行 , 停止 , 断点管理相关按钮 ,

在这里插入图片描述

Debug 视窗中的 Console 是 Flutter 的控制台 , 会显示 Flutter 应用 运行过程中的提示信息 , 报错信息 , print 打印信息等 ,

( 注意这不是 Android 的控制台 )

在这里插入图片描述





三、手机日志信息查看



Flutter 手机日志信息查看 :

调试 Android 项目 , 通过 Android Studio 打开 Flutter 中的 Android 部分代码 , 然后在 Logcat 中查看 ;

Android 平台的日志直接在 Android Studio 中的 Logcat 窗口中查看 ;

在这里插入图片描述


调试 iOS 项目 , 使用 Xcode 打开 Flutter 中的 iOS 项目进行调试 ;

iOS 平台的日志需要在 Mac 中 , 打开 Xcode , 在 Xcode 中的控制台中 , 会输出 iOS 手机的日志信息 ;

在这里插入图片描述





四、设置普通断点



鼠标左键在代码的行号右边点击 , 即可在某行代码的位置添加断点 , 然后点击 " Debug " 按钮 在这里插入图片描述 ,
,

在这里插入图片描述

代码运行到断点位置 , 就会被暂停 , 此时可以查看当前状态下运行情况 , 如变量值 ;

在这里插入图片描述





五、设置表达式断点



默认情况下设置的断点是普通断点 , 还可以设置 表达式断点 ,

右键点击断点 , 会弹出如下对话框 ,

在这里插入图片描述

在对话框中输入 5.0 , 意味着该表达式值为 5.0 时 , 断点才会被执行 ,

在这里插入图片描述

设置了表达式断点后 , 重新运行 , 程序运行到该 " 表达式断点 " 位置 , 获得

在这里插入图片描述





六、相关资源



参考资料 :


重要的专题 :


博客源码下载 :

文章来源: hanshuliang.blog.csdn.net,作者:韩曙亮,版权归原作者所有,如需转载,请联系作者。

原文链接:hanshuliang.blog.csdn.net/article/details/115333983

【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。