Skip to main content

Flutter Set Entire App Background Color

Sometimes we want to set background color of entire app from one place in flutter. This will be possible via Scaffold widget. As you all know we follow Root and Children widget formatting in flutter. When we apply any customization on Root, It will directly apply on the Children also. So we can apply background color on Scaffold widget and automatically on it's entire children Sub-Widget Tree background color will be applied.

Flutter Set Entire App Background Color

1. Apply backgroundColor on Scaffold Root widget.
Scaffold(
            backgroundColor: Color.fromARGB(255, 255, 248, 225),
            body: MyApp())
Screenshot:
Flutter Set Entire App Background Color
Source code for main.dart file:
import 'package:flutter/material.dart';

void main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
        home: Scaffold(
            backgroundColor: Color.fromARGB(255, 255, 248, 225),
            body: MyApp()));
  }
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

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

class MyAppState extends State {
  @override
  Widget build(BuildContext context) {
    return const Center(
        child: Text(
      'Set Background Color',
      style: TextStyle(fontSize: 24),
    ));
  }
}

Comments