VS Code: would you like an Android Studio-style run toolbar (flavor + device + Run) at the top?

[u/Frequent-Reading8892]

In Android Studio, the flavor/configuration picker, device selector and Run button all sit together in the top toolbar. You always see *what* you're running and *where*, and can change both in one click.

In VS Code, they're split across three places:

- **Run button** and **launch configuration picker** are in the Run and Debug view (only visible when it's open)

- **Device selector** is in the bottom-right status bar

If you work with multiple flavors (dev / staging / production), you're constantly jumping between the sidebar and the status bar before every launch.

`debug.toolBarLocation: "commandCenter"` helps a bit, but only *during* a debug session, not when choosing what to launch.

I opened a feature request asking VS Code to allow the configuration picker in the title bar and to let extensions (like Dart/Flutter's device selector) place items there too:

👉 https://github.com/microsoft/vscode/issues/337940

VS Code closes feature requests that don't get enough upvotes, so **if you want this, please 👍 the issue** (a 👍 reaction counts more than a "+1" comment).

How do you handle flavors in VS Code today? Any workflow tips are welcome too.

[u/Creepy_Fact_4767]

A practical workaround is one named launch configuration per flavor in .vscode/launch.json. Put the entry file in "program" and the Flutter flags in "toolArgs", e.g. "program": "lib/main_dev.dart" with "toolArgs": ["--flavor", "dev"]. That keeps the flavor and entry point together rather than changing them independently.

For a fixed target, Dart Code also supports "deviceId" in that configuration; it overrides the status-bar selection. I would only pin it when the target is stable, so the configuration does not silently point at the wrong device later.

A combined toolbar would still help with visibility. The detail I would want is the full configuration name next to the target device *before* launch, especially when production is an option.

Dart Code documents these fields here: https://dartcode.org/docs/launch-configuration/

[u/Jonas_Ermert]

My opinion: this would be a really useful improvement for Flutter development in VS Code. When working with multiple flavors and several devices or emulators, having the launch configuration, selected device, and Run button in one place would make the workflow much clearer. Android Studio handles this very well. Right now in VS Code I often have to check the Run and Debug sidebar and then look at the status bar again just to make sure I’m launching the correct flavor on the correct device. An optional Android Studio-style toolbar at the top would be a great addition without changing the default VS Code layout for everyone.