how not to generate red box in flutter, android studio, - flutter

how not to generate a red box in flutter when create widgets??
it`s so super annoying
I`ve been searching this for a while
but still couldn`t figure it out
can anyone help this please?

When you create widget using Context Actions, it seems Android Studio holds onto this widget and shows this with a red box. You can get rid of this grip by typing a <TAB> on any empty space.

Related

Unable to Extract Widget Android studio

I am using Android studio chipmunk 2021.2.1 patch 2 for Apple M1 chip ... created a flutter project with patch 1 ... code is working fine but some android studio features not working ...
Flutter Outline shows the source code tree but I am unable to Export any widget nither directly from the editor nor from Eflutter Outline Tab ...
doubleclick on widget tree -> refector -> Extract Flutter Widget ...
Following popup appears but nothing happens on clicking Refactor...
The same thing works fine for the Extract Method...
Flutter Outline shows the code tree but it's also not extracting any Widget...
Only the Export Method button works fine here... it also does not show Wrapping any widget all buttons are disabled ...
The following suggestion bulb is also not showing anything for this project... (This screenshot is from another project)
Unable to rename anything... it shows an error...
This error does not make any sense.
And all things are working fine for the other flutter project I downloaded from Github...
I don't know why this thing happening only for this project and working fine for other projects.

Object Browser / Class Browser for Visual Studio Code

I am just getting started with Visual Studio Code. I am really liking it better than the full Visual Studio, but I was wondering how to show the object browser?
Along the left icon bar where I would expect it to be, all I see is Explorer, Search, Source Control, Run, and Extensions. Then at the bottom are Accounts and Settings.
How do I show the object browser? Is there a setting somewhere, or do I need to install an extension, or what?
I found it.
Just in case anyone is as blind as I am and stumbles across this question:
Under the "Explorer" button on the left. Way down at the bottom there is an "OUTLINE" section. Twirl that open and there it is!
Because I could not find it using the explanation above, I found the Object Browser under the View menu, somewhere at the middle of the list.
Or...you can press CTRL+ALT+J
enter image description here

How to prevent Visual Studio Code Flutter/Dart Editor from formatting new line/wrapping code?

I recently started working on Flutter/Dart, I like the flutter autoformatting on-save, but one thing might or might not be related is the code wrapping for long code even if code is still fitting my 4k editor window.
Is there a way to prevent new line but keep the comma auto format?
Thanks
Follow the instructions below:
Open Settings.
Expand Extensions and click Dart & Flutter on the left.
Find Dart: Line Length.
Change it to the value you want.

the mistakes that Visual Studio Code shows, are they real?

When developing a flutter app using Visual Studio Code
App freezing errors appear on the phone
And the error appears in a new tab, like the one shown in the picture below
Note that these errors do not appear in the rest of the editors
Like android studio and intellij
Are they mistakes that I should fix or not
thank you
Whenever you debug the flutter code it automatically breakpoint whenever there is some error or chance of future breakdown. If you run the application it will not show error. In visual studio try to run code not debug code. Even if you debug in android studio it will show you those screen.
The error is true
You have put an Expanded (inside a Padding) in a Column, which means the Expanded widget will try to take as much space as possible in a Column widget which will have the height of its childs, making the Column’s height infinite. Try nesting the Column in a SizedBox or Container with height and width

Hover option in Google chrome devtools not working

Im facing a problem with google chrome devtools....
I used to hover on a variables and it would pop up a tooltip telling me the value and other info, also on a function it would pop a link to click and it will take me to the definition location of that function, but all that is gone now and not working anymore...
Now i just see my cursor blinking when i hover over the variables... and im coding using VS Code i dont know if that might also be a problem, but i think i got this problem from a recent chrome update.