Unable to remove visual debugging for Flutter in VSCode

Question

I'm looking for a way to disable the Flutter visual debugging: (using VSCode, Flutter Web on Chrome emulator)

As you can see even though I have a very simple theme with no underlying or colors, it adds a bunch of unwanted stuff. I have disabled the debugPaint in code and via the options but this remains.

Following is the theme imported at the MaterialApp level:

    theme: ThemeData(
      primarySwatch: Colors.blue,
    )

And the card itself that is shown in the screenshots:

  @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]),
  )
      ]);
    }
  }

Additional note: with the debugLines set to true it adds even more elements:

Answer 1

The widget tree is going directly from a Material App to a SingleChildScrollView. It is missing the Scaffold Widget that (as in the flutter documentation):

Implements the basic material design visual layout structure

Scaffold Flutter Documentation