Android Dark Theme in Flutter

Matt Carroll
May 15 · 2 min read

A week ago at Google I/O 2019, the Android team announced support in Android Q for Dark Theme, a system-wide dark UI mode that is toggled by the user. This then begs the question, when will Flutter add support for this awesome new Android feature? Well, you might be surprised to find out that Flutter added support for dark theme back in February! Here’s how to use it.

First, let’s start with a typical MaterialApp that establishes the theme for the rest of the UI. The following is how a typical app would define its theme before Dark Theme.

In Flutter, we introduced a darkTheme property for MaterialApp, which allows you to specify a 2nd, independent theme to be used just for Android’s Dark Theme feature. Let’s introduce a theme with a setting of Brightness.dark for our MaterialApp’s darkTheme.

Tada! Now when you toggle Dark Theme in your system drawer, your Flutter app will automatically switch from your regular theme to your darkTheme!

Thanks to Flutter’s use of code for UI, updating your app to support a great new feature takes little more than adding a new property to your widget tree. No XML styles to update, no CSS to update, just a normal Dart parameter.

In Flutter, there’s no reason to be afraid of the dark.

Flutter

Flutter is Google's mobile UI framework for crafting high-quality native interfaces on iOS and Android in record time. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. Learn more at https://flutter.dev

Matt Carroll

Written by

Flutter

Flutter

Flutter is Google's mobile UI framework for crafting high-quality native interfaces on iOS and Android in record time. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. Learn more at https://flutter.dev

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade