官方提供的是Flutter Widget Inspector,详见https://flutterchina.club/inspector/

我用的是另外一种好用的调试工具 Dart DevTools

步骤如下:

1 首先使用VS Code打开你的项目,并且运行(菜单栏 Debug --> Start Debugging(F5) ),运行项目前要打开模拟器或使用真机

2 在VS Code中通过F1或者Ctrl+Shift+P打开主命令面板,按输入Dart: Open DevTools

3 点击Activate/Upgrade Dart DevTools按钮,激活调试工具,该调试工具会自动打开浏览器(建议使用Chrome浏览器为默认浏览器,如果不是,打开网页后,将网页地址复制到Chrome浏览器中打开)

4  通过点击页面上不同的位置,可以在调试工具上显示出详情,下面是我写的微信页面demo,github地址为https://github.com/zhaoqiyin/wechat_clone

欢迎大家clone,也希望大家点赞。

使用VS Code调试Flutter(检查用户页面)的更多相关文章

  1. VS code 进行 flutter 调试时启动后就停止,无法调试的问题

    在编写flutter时,更新需要按 r 或着 R,这就有点麻烦,当然强大的VS code给我们提供了自动更新的功能,那就是调试功能. 首先需要给VS code安装Flutter与Dart插件. 在VS ...

  2. 【Flutter学习】页面跳转之路由及导航

    一,概述 移动应用通常通过成为‘屏幕’或者‘页面’的全屏元素显示其内容,在Flutter中,这些元素统称为路由,它们由导航器Navigator组件管理.导航器管理一组路由Route对象,并提供了管理堆 ...

  3. [原创]java WEB学习笔记45:自定义HttpFilter类,理解多个Filter 代码的执行顺序,Filterdemo:禁用浏览器缓存的Filter,字符编码的Filter,检查用户是否登陆过的Filter

    本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...

  4. vs code配置flutter开发android

    下载flutter_sdk压缩包,解压到指定目录,把sdk的bin目录添加到系统环境变量Path 设置中国临时镜像:添加两个系统变量 FLUTTER_STORAGE_BASE_URL=https:// ...

  5. VS Code 调试 Angular 和 TypeScript 的配置

    一.安装插件 在 Visual Studio Code 中打开扩展面板(快捷键 Ctrl+Shift+X),搜索安装 Debugger for chrome 插件). 二.配置启动参数 在 Visua ...

  6. Visual Studio Code 调试 PHP

    Visual Studio Code 调试 PHP 2018/12/4 更新 Nginx + php-cgi.exe 下与 Visual Studio Code 配合调试 必需环境 Visual St ...

  7. day108:MoFang:首页检测用户是否登录&在项目中使用MongoDB&用户页面更新用户信息&交易密码界面实现

    目录 1.首页页面也要检测用户是否登录 2.在flask中使用MongoDB 3.用户页面更新用户信息 4.交易密码界面/密码修改界面/昵称修改界面初始化 5.交易密码实现 1.首页页面也要检测用户是 ...

  8. VS Code 调试 OneFlow

    VS Code 调试 OneFlow 本文介绍如何配置 VS Code,搭建 OneFlow 的 GUI 开发环境. 如果对于 VS Code 及其插件系统还不熟悉,可以参阅官方文档. 本文包括: 如 ...

  9. VS Code调试.NET Core

    VS Code调试.NET Core应用遇到的坑 为什么会有”坑“ 博客园里有好多介绍怎么使用VS Code以及调试.NET Core的文章,但是都是基于直接构建Asp.Net Core Mvc单项目 ...

随机推荐

  1. easyui表格格线错位

    现象:如果easyui表格中存在后渲染的linkbutton,则可能会导致表格固定列的格线与内容列的格线不一致,出现这种情况的原因是在表格的onLoadSuccess事件中渲染linkbutton时, ...

  2. Android vector 标签 pathData 详解

    转载地址:http://www.jianshu.com/p/a3cb1e23c2c4#rd Android Support Library 23.2 出来以后,在Android 5.0(API级别21 ...

  3. 转【前端基础进阶之Promise】

    前言 Promise的重要性我认为我没有必要多讲,概括起来说就是必须得掌握,而且还要掌握透彻.这篇文章的开头,主要跟大家分析一下,为什么会有Promise出现. 在实际的使用当中,有非常多的应用场景我 ...

  4. MVC5 + EF6 简单示例(转载)

    原文地址:http://www.cnblogs.com/panchunting/p/creating-an-entity-framework-data-model-for-an-asp-net-mvc ...

  5. #if、#ifdef、#if defined之间的区别(转载)

    转自:http://www.yucoat.com/c_program/difference_if_ifdef_if_defined.html #if的使用说明 #if的后面接的是表达式 #if (MA ...

  6. linux中的C里面使用pthread_mutex_t锁(转载)

    转自:http://blog.csdn.net/w397090770/article/details/7264315 linux下为了多线程同步,通常用到锁的概念. posix下抽象了一个锁类型的结构 ...

  7. bzoj 1112: [POI2008]砖块Klo【对顶堆】

    priority_queue实现的对顶堆,细节超级多WA了十几次--但是理论上是最简便的orz其实是我已经不会写平衡树了 枚举左端点,显然要把这一段的高度搞成(l,l+k-1)的高度中位数,所以需要一 ...

  8. linux 文件 chgrp、chown、chmod

    linux 默认情况下有会提供6个terminal 来让用户登录,使用[Ctrl]+[Alt] +[F1]~[F6] 组合 linux 文件 任何一个文件都具有"user,Group及Oth ...

  9. ACM二分查找模板

    int main(){ == key int m; while ( l <= r ) { m = ( l + r ) >> 1; if ( x[m] == key ) return ...

  10. MFC显示文本文档 分类: MFC 2014-12-30 10:03 457人阅读 评论(1) 收藏

    新建基于对话框的MFC应用程序.资源视图的对话框上添加编辑框(Edit Control)和按钮(Button), 将编辑框属性:Mutiline.Auto HScroll.Auto VScroll设为 ...