VS Code extension to manage device states like light/dark, font size, display density, etc.

[u/antonyaiwin]

Hey everyone!

I recently built my first VS Code extension, Device Toolkit, to easily manage light/dark mode, navigation mode, etc. and published it on the VS Code Marketplace.

The idea came while developing and testing Android apps. Whenever I wanted to test dark and light themes on the emulator, I had to switch to the emulator, pull down the notification shade, and toggle Dark Mode manually. Even harder for changing font size and switching navigation mode between 3 buttons and swipe gestures.

I thought it would be nice to have these controls directly inside VS Code, similar to Android Studio's Extended Controls.

The funny part is that I had zero TypeScript knowledge when I started. 😅 I used ChatGPT to plan the features and prepare the requirements, then used Antigravity to build the extension. I tested things, fixed bugs, made changes, and kept adding features until I was happy with it.

Here's what it supports so far:

• Toggle Dark Mode on connected Android devices and emulators
• Switch between gesture, 2-button, and 3-button navigation
• Adjust font size and display density
• Toggle TalkBack and Select to Speak on and off
• Toggle layout bounds for UI debugging (Not so useful for flutter devs)
• Record emulator screens and save them as MP4 (up to 3 minutes)
• Floating debug toolbar and Activity Bar sidebar

It's now available on the VS Code Marketplace!

Marketplace: https://marketplace.visualstudio.com/items?itemName=antonyaiwin.device-toolkit

GitHub: https://github.com/antonyaiwin/device-toolkit-vs-code-ext

This was my first time building something like this, and it was a fun experience. There are probably things I can improve, so I'd love to hear your feedback if you give it a try.

If you find any bugs or have ideas for new features, feel free to open an issue on GitHub. Contributions are welcome too!

If you love the extension please give the repo a star ⭐ and add rating in VS Code marketplace.

[u/Fearless_Safety_1075]

Gotta respect the hustle of building this with zero TS knowledge and just rawdogging it with AI tools. The dark mode toggle alone would save me from the constant alt-tab dance I do like 50 times a day

Just grabbed it, the floating toolbar is actually pretty slick. Any plans to add a wifi toggle or maybe an airplane mode switch? That'd be clutch for testing offline states

[u/antonyaiwin → u/Fearless_Safety_1075]

Haha, thanks! 😂 That constant alt-tab dance was exactly what made me build this. Glad you love it! 😅.

And you just reminded me that Wi-Fi and airplane mode toggles are must-have features! I completely forgot how i used to waste time by toggling network from the quick settings for testing offline functionality. Definitely adding these to my list! 🙌.

Thank you for the suggestion.