Continuing the previous blog post which explained flutter Scaffold() and AppBar() widgets. We had used home argument of MaterialApp() widget and the value of this argument was a Scaffold() Widget. Scaffold() Widget had appBar arugment that accepts AppBar() constructor, the consturctor accepts title argument with the value of Text() widget and body argument with a value of Text() widget.

In this post we’ll learn how to use or enable flutter dark theme in an application. Previously, we learned MaterialApp() Widget using only one parameter i.e, home

We’ll use a second parameter named theme that accepts ThemeData() constructor. Consider the following code.

import 'package:flutter/material.dart';

void main() => runApp(
      MaterialApp(
        theme: ThemeData(brightness: Brightness.dark),
        home: Scaffold(
          appBar: AppBar(
            title: const Text("Flutter Dark Theme"),
          ),
          body: const Text("Flutter Dark Theme"),
        ),
      ),
    );

We have used only one argument in ThemeData() i.e, brightness to convert app in to dark theme.

MaterialApp(
        theme: ThemeData(brightness: Brightness.dark),

Have a look at the complete code now.

import 'package:flutter/material.dart';

void main() => runApp(
      MaterialApp(
        theme: ThemeData(brightness: Brightness.dark),
        home: Scaffold(
          appBar: AppBar(
            title: const Text("Flutter Dark Theme"),
          ),
          body: const Text("Flutter Dark Theme"),
        ),
      ),
    );

Output

This was the simplest possible single-line code to use flutter dark theme. We’ll explore more parameters in the later lessons.

Comments

comments