Primary Color in theme data is not working

user_7352289 0
Viewed 716

I'm new to flutter and am following this tutorial: https://www.raywenderlich.com/24499516-getting-started-with-flutter#toc-anchor-019 Everything else works fine but the primary color in themeData which is specified as green is not working. The simulator still shows blue color. Can someone please help me figure out what I'm doing wrong. I've attached minimal code and the output I am getting

import 'package:flutter/material.dart';

void main() => runApp(const GHFlutterApp());

class GHFlutterApp extends StatelessWidget {
  const GHFlutterApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'GHFlutter',
      // this theme color green is not showing
      theme: ThemeData(primaryColor: Colors.green.shade800),
      home: Scaffold(
        appBar: AppBar(
          title: const Text('GHFlutter'),
        ),
        body: const Center(
          child: Text('GHFlutter'),
        ),
      ),
    );
  }
}

Output:

enter image description here

flutter
1 Answers

Well,inside the AppBar widget, there's a property called backgroundColor, where you can specify the color of your appBar. If you want to set a default color to your appBar's, you can try this:

Theme(
  data: ThemeData(appBarTheme: AppBarTheme(color: Colors.green.shade800)),
  child: Scaffold(
    appBar: AppBar(),
  ),
);

Two tips:

  1. When you try to set a theme, always specify what theme should be ( AppBar, CheckBox and so on )
  2. Whenever you try to change the color of a widget, try to look for an property inside the widget you wanna change.

Give me a feedback if it works!

user_144450580
Related