Question: I'm learning Flutter, and I'm starting from the very basics. I'm not using MaterialApp. What's a good way to set the background color of the whole screen?

Here's what I have so far:

```
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new Center(child: new Text("Hello, World!"));
  }
}

```

Some of my questions are:

* What's a basic way to set the background color?
* What exactly am I looking at, on the screen? Which code "is" the background? Is there a thing to set the background color on? If not, what's a simple and appropriate "simple background" (in order to paint a background color).

Thanks for the help!

The code above generates a black screen with white text:
[![enter image description here](https://i.stack.imgur.com/e2CIm.png)](https://i.stack.imgur.com/e2CIm.png)

Answer: 
Here's one way that I found to do it. I don't know if there are better ways, or what the trade-offs are.

[Container](https://docs.flutter.io/flutter/widgets/Container-class.html) "tries to be as big as possible", according to <https://flutter.io/layout/>. Also, Container can take a `decoration`, which can be a [BoxDecoration](https://docs.flutter.io/flutter/painting/BoxDecoration-class.html), which can have a `color` (which, is the background color).

Here's a sample that does indeed fill the screen with red, and puts "Hello, World!" into the center:

```
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new Container(
      decoration: new BoxDecoration(color: Colors.red),
      child: new Center(
        child: new Text("Hello, World!"),
      ),
    );
  }
}

```

Note, the Container is returned by the MyApp build(). The Container has a decoration and a child, which is the centered text.

See it in action here:

[![enter image description here](https://i.stack.imgur.com/LO4Ib.png)](https://i.stack.imgur.com/LO4Ib.png)
There are many ways of doing it, I am listing few here. 

1. Using `backgroundColor`

```
Scaffold(
  backgroundColor: Colors.black,
  body: Center(...),
)

```
2. Using `Container` in `SizedBox.expand`

```
Scaffold(
  body: SizedBox.expand(
    child: Container(
      color: Colors.black,
      child: Center(...)
    ),
  ),
)

```
3. Using `Theme`

```
Theme(
  data: Theme.of(context).copyWith(scaffoldBackgroundColor: Colors.black),
  child: Scaffold(
    body: Center(...),
  ),
)

```