debugPaintSizeEnabled在Flutter中不起作用

Question

我刚开始学习颤振并构建了Building Layout tutorial中的示例应用程序。

  

在source code中建议取消注释两行，以查看可视调试行，但到目前为止还没有运气。

import 'package:flutter/material.dart';
// Uncomment lines 7 and 10 to view the visual layout at runtime.
//import 'package:flutter/rendering.dart' show debugPaintSizeEnabled;

void main() {
  //debugPaintSizeEnabled = true;
  runApp(new MyApp());
}

  

我尝试了什么？

1. 热重新载入
2. 完全重启
3. 将其他调试变量设置为true：

debugPaintPointersEnabled = 
    debugPaintBaselinesEnabled = 
    debugPaintLayerBordersEnabled = 
    debugRepaintRainbowEnabled = true;

，我从Docs读到。他们工作得很好。

  

我的设置？

1. Visual Studio代码
2. 无飞镖2预览模式
3. Flutter Beta
4. 我使用的是Android移动硬件，而不是虚拟（Moto G5）

  

问题：如何使可视化调试器工作？

Answer 1

我有完全相同的问题，我找到的唯一解决方案是从VSCode命令调色板切换调试绘画。

Flutter: Toggle Debug Painting

<强>更新

您也可以使用渲染库使其正常工作。

首先你需要导入它

import 'package:flutter/rendering.dart';

然后，在应用程序的main方法或小部件的构建方法中将debugPaintSizeEnabled设置为true

void main() {
  debugPaintSizeEnabled=true;
  runApp(MyApp());
}

您需要完全重新启动应用程序才能应用效果

这里是official documentation。

Answer 2

添加import语句：

import 'dart:developer';

import 'package:flutter/rendering.dart';

然后在构建中添加debugPaintSizeEnabled = true;喜欢：

Widget build(BuildContext context) {
    debugPaintSizeEnabled=true;

Answer 3

  

<强>更新

     

以下步骤适用于 android设备和 android   虚拟设备如果您正在使用ANDROID STUDIO。它只适用   在 Android虚拟设备上，如果您正在使用VSCode

我最近正在关注相同的教程，以了解Flutter中的所有布局元素。 为了在运行时启用可视化布局，我所做的非常简单 -

• 第一

  

我添加了 import＆＃39; package：flutter / rendering.dart＆＃39;在我的 main.dart 文件的顶部显示debugPaintSizeEnabled;

• 下一步

  

我将 debugPaintSizeEnabled = true; 添加到我的main（）方法

void main() {
  debugPaintSizeEnabled = true;
  runApp(new MyApp());
}

• 最后

  

我执行了应用的完全重启以反映所有更改。 如果您执行热重新加载，它不会反映更改。

希望这有帮助。

Answer 4

不必在VSCode中导入任何内容，只需：

1. 通过 Ctrl + Shift + P （ Cmd 用于mac）
2. 键入Flutter: Toggle Debug Painting，然后单击它：example。

Answer 5

我认为你需要import 'package:flutter/rendering.dart';

Answer 6

在终端按“p”

To toggle the display of construction lines (debugPaintSizeEnabled), press "p".

（这是最简单的选择！）

Answer 7

1. 导入“ package：flutter / material.dart”；

2.   

   void main（）{       debugPaintSizeEnabled = true;       runApp（new MyApp（））; }

3. 通过CTRL + SHIFT + P（用于窗口）打开命令选项板，

4. 键入Flutter：切换Debug Painting，然后单击它。