I'm trying to change colors manually in the code when the default theme config is dark.

Does anyone know how can I get a boolean value (true) when the deafult system theme of the user is dark on flutter?

I've spent a lot of time searching in google and pub.dev but I haven't found similar problems.

Here is a example

backgroundColor: _isthemedark ? Colors.blue : Colors.red

here is my code full code

import 'package:flutter/material.dart';
import 'package:hexcolor/hexcolor.dart';
import 'package:flutter/services.dart';




void main() {

  SystemChrome.setSystemUIOverlayStyle(
      const SystemUiOverlayStyle(statusBarColor: Colors.transparent));///status bar transparent
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {


  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  bool _isObscure = true;

  final bool _isthemedark = true;/// HERE IS WHERE I WANT TO CHANGE

  @override
  Widget build(BuildContext context) {


    return MaterialApp(

     /// color: HexColor("#fafafa"),
      themeMode: ThemeMode.system,
      darkTheme: ThemeData.dark(),
      home: Scaffold(
        backgroundColor: _isthemedark ? HexColor("#2b2e4a") : HexColor("#fafafa"),
        body: SafeArea(
          child: SingleChildScrollView(
            child: Column(
              children: [
                Row(
                  children: [
                    Padding(
                      padding: const EdgeInsets.only(top: 150, left: 20),
                      child: Text('Opa!',
                          style:
                              TextStyle(fontWeight: FontWeight.bold,
                                  fontSize: 30,
                                  color: _isthemedark ? Colors.white : HexColor("#2b2e4a") ,),),
                    ),
                  ],
                ),///texto

                const SizedBox(
                  height: 100,
                  width: 20,
                ),///blankspace

                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 30),
                  child: TextField(
                    cursorColor: _isthemedark ? Colors.white : Colors.black,
                    decoration: InputDecoration(
                        focusedBorder: UnderlineInputBorder(
                            borderSide: BorderSide(
                                color: _isthemedark? Colors.white : HexColor("#666a7b").withOpacity(0.7))),
                        labelText: 'Username',
                        labelStyle: TextStyle(color: HexColor("#666a7b")),
                        floatingLabelBehavior: FloatingLabelBehavior.always),
                  ),
                ),///Username field

                const SizedBox(
                  height: 70,
                ),///blankspace

                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 30),
                  child: TextField(
                    obscureText: _isObscure,
                    cursorColor: _isthemedark ? Colors.white : Colors.black,
                    decoration: InputDecoration(
                        suffixIcon: IconButton(
                          color: HexColor("#05c46b"),
                          icon: Icon(_isObscure
                              ? Icons.visibility_off
                              : Icons.visibility,
                              color: _isObscure ? HexColor("#fafafa"):HexColor("#05c46b")),
                          onPressed: () {
                            setState(() {
                              _isObscure = !_isObscure;
                            });
                          },
                        ),
                        focusedBorder: UnderlineInputBorder(
                            borderSide: BorderSide(
                                color: _isthemedark ? Colors.white : HexColor("#666a7b").withOpacity(0.7))),
                        labelText: 'Password',
                        labelStyle: TextStyle(color: HexColor("#666a7b")),
                        floatingLabelBehavior: FloatingLabelBehavior.always),
                  ),
                ),///password field

                const SizedBox(
                  height: 20,
                ),///blank space

                Row(
                  mainAxisAlignment: MainAxisAlignment.end,
                  children: [
                    Padding(
                      padding: const EdgeInsets.symmetric(horizontal: 20),
                      child: TextButton(
                          style:TextButton.styleFrom(
                              alignment: Alignment.topRight,
                              primary: HexColor("#666a7b")
                          ),
                          onPressed: () {}, child: const Text('Opa senha?')),
                    ),
                  ],
                ),///tanso?

                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 30),
                  child: SizedBox(
                    width: 450,
                    child: TextButton(
                      child: const Text ('LOGIN'),
                      onPressed: () {},
                      style: TextButton.styleFrom(
                        shadowColor: HexColor("#05c46b"),
                        elevation: 20,
                        primary: Colors.white,
                        backgroundColor: HexColor("#05c46b"),
                      ),
                    ),
                  ),
                ),///LOGIN button

                const SizedBox(
                  height: 30,
                ),///blank space

                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 20),
                  child: TextButton(
                      style:TextButton.styleFrom(
                          alignment: Alignment.topRight,
                          primary: HexColor("#666a7b")
                      ),
                      onPressed: () {}, child: const Text('Criar Conta')),
                )///criar acc

              ],
            ),
          ),
        ),
      ),
    );
  }
}///Login page

CodePudding user response：

Use MediaQuery widget to check whether the platform brightness is dark:

final dark = MediaQuery.of(context).platformBrightness == Brightness.dark;

Put the above line of code inside build method, so when the user changes the system setting, your app will be automatically rebuilt.

CodePudding user response：

Listen to changes using

void didChangePlatformBrightness()

https://docs-flutter-io.firebaseapp.com/flutter/widgets/WidgetsBindingObserver/didChangePlatformBrightness.html