无法在 VSCode 中删除 Flutter 的可视化调试答案

【问题标题】：Unable to remove visual debugging for Flutter in VSCode无法在 VSCode 中删除 Flutter 的可视化调试
【发布时间】：2020-12-28 02:13:06
【问题描述】：

我正在寻找一种禁用 Flutter 可视化调试的方法：（在 Chrome 模拟器上使用 VSCode、Flutter Web）

正如您所见，即使我的主题非常简单，没有底色或颜色，它也会添加一堆不需要的东西。我已经在代码中和通过选项禁用了 debugPaint，但这仍然存在。

以下是在 MaterialApp 层面导入的主题：

    theme: ThemeData(
      primarySwatch: Colors.blue,
    )

还有截图中显示的卡片本身：

  @override
    Widget build(BuildContext context) {
      print('Adding article: ' + article.title);
      return Column(children: [
        Container(
          height: 30,
          width: 30,
          decoration: BoxDecoration(
            border: Border.all(width: 3.0),
    ),
    child: Text(article.title),
  ),
  Text(
    article.title,
    style: TextStyle(fontSize: 21, fontWeight: FontWeight.bold),
  ),
  Text(
    article.description,
    style: TextStyle(fontSize: 16, color: Colors.grey[500]),
  ),
  Text(
    article.publishDate,
    style: TextStyle(fontSize: 14, color: Colors.grey[300]),
  )
      ]);
    }
  }

附加说明：将 debugLines 设置为 true 会添加更多元素：

【问题讨论】：

我猜debugPaintBaselinesEnabled 设置为true
我将所有我知道的 debugPaint 设置为 false：debugPaintPointersEnabled = debugPaintBaselinesEnabled = debugPaintLayerBordersEnabled = debugRepaintRainbowEnabled = false;
您有 Scaffold 作为您的小部件的父级吗？
谢谢我把导航搞砸了，这个屏幕没有脚手架。它解决了这个问题。编辑：如何将您的评论标记为答案？
然后随意写一个自我答案;-)

标签： flutter debugging visual-studio-code

【解决方案1】：

小部件树直接从 Material App 转到 SingleChildScrollView。它缺少 Scaffold 小部件（如颤振文档中所示）：

实现基本的材料设计视觉布局结构

Scaffold Flutter Documentation

【讨论】：