Flutter Text and Text Color Not Updated After Hot Reload

To ensure that UI changes reflect properly after hot reload, it’s important to make those changes within the widget itself rather than relying on the main() function, which is executed only once in the entire app session.

Widget should have the text color change within the build method of the _MyHomePageState widget. Here’s the example to follow:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
 const MyApp({super.key});
 @override
 Widget build(BuildContext context) {
   return MaterialApp(
     title: 'Flutter Demo',
     theme: ThemeData(
       colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
       useMaterial3: true,
     ),
     home: const MyHomePage(),
   );
 }
}

class MyHomePage extends StatefulWidget {
 const MyHomePage({super.key});
 @override
 State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
 @override
 Widget build(BuildContext context) {
   return const Scaffold(
     body: SafeArea(
       child: Center(
         child: Text(
           'Bacancy',
           style: TextStyle(
             color: Colors.red, // text color 
           ),
         ),
       ),
     ),
   );
 }
}

By placing the text color change directly within the build method of the _MyHomePageState widget, any modifications to the text color will be reflected correctly after hot reload.