Flutter ThemeData Primary color not changing from theme when trying to add a primary color

Question

Im following the BMI Calculator app from the London App Brewery on LinkedIn Learning. when attempting to set the primaryColor to red, my emulator still shows the Light Blue default AppBar even though i am overriding the Primary Color. here's the code

    import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primaryColor: Colors.red,
      ),
      home: const InputPage(),
    );
  }
}

class InputPage extends StatefulWidget {
  const InputPage({Key? key}) : super(key: key);

  @override
  _InputPageState createState() => _InputPageState();
}

class _InputPageState extends State<InputPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('BMI CALCULATOR'),
      ),
      body: const Center(
        child: Text('Body Text'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        child: const Icon(Icons.add),
      ),
    );
  }
}

Answer 1

I am also attending same training from LondonAppBrewery. This code fixed the problem.

Widget build(BuildContext context) {
return MaterialApp(
  title: "BMI Calculator",
  debugShowCheckedModeBanner: false,
  theme: ThemeData.dark().copyWith(
    appBarTheme:AppBarTheme(
      backgroundColor: Color(0xff0a0e21),
    ),
    scaffoldBackgroundColor: Color(0xff0a0e21),
  ),
  home: InputPage(),
);

Answer 2

Use primarySwatch

theme: ThemeData(
    primarySwatch: Colors.red,
  ),