Flutter - How can I change the background color of LicensePage?

Question

I'd like to set the background colour of every screen except LicensePage to some colour, so I've specified the scaffoldBackbroundColor via the theme argument of MaterialApp as follows.

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(scaffoldBackgroundColor: Colors.blue.shade200),
      home: HomeScreen(),
    );
  }
}

This changes the background colour of the licences page too, so in order to change it back to white, I tried overriding scaffoldBackbroundColor, but it did not work.

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Theme(
        data: Theme.of(context).copyWith(scaffoldBackgroundColor: Colors.white),
        child: Center(
          child: RaisedButton(
            child: const Text('Show licenses'),
            onPressed: () => showLicensePage(context: context),
          ),
        ),
      ),
    );
  }
}

How can I do it?

score 6 · Answer 1 · answered Mar 17 '21 at 12:17

In my case I found ThemeData(cardColor) was dictating the LicensePage background color. So,

showLicense(BuildContext context) {
  Navigator.of(context).push(
    MaterialPageRoute<void>(
      builder: (context) => Theme(
        data: ThemeData(
          cardColor: Colors.yellow,
        ),
        child: LicensePage(
          applicationVersion: '0.1',
          applicationIcon: Icon(Icons.person),
          applicationLegalese: 'Legal stuff',
        ),
      ),
    ),
  );
}

Setting the cardColor property was the only one that did the trick for me. Thank you! — PaianuVlad23, May 13 '21 at 12:33

score 3 · Accepted Answer · answered Jul 06 '20 at 11:57

3

I came up with this and it worked successfully.

Scaffold(
  body: Center(
    child: RaisedButton(
      child: const Text('Show licenses'),
      onPressed: () => Navigator.of(context).push(
        MaterialPageRoute<void>(
          builder: (context) => Theme(
            data: Theme.of(context).copyWith(
              scaffoldBackgroundColor: Colors.white,
            ),
            child: LicensePage(...),
          ),
        ),
      ),
    ),
  ),
)

answered Jul 06 '20 at 11:57

kaboc

814
1
6
23

2

`LicensePage` was changed to use `cardColor` instead of `scaffoldBackgroundColor` for the background colour. See [this issue](https://github.com/flutter/flutter/issues/63475) and [the related PR](https://github.com/flutter/flutter/pull/64639). – kaboc May 02 '21 at 10:09

Jitesh Mohite · Answer 3 · 2020-07-06T11:03:20.990

-1

This way you cannot set the theme, set color using Container

 Scaffold(
        body: Container(
        color: Colors.white,
          child: Center(
            child: RaisedButton(
              child: const Text('Show licenses'),
              onPressed: () => showLicensePage(context: context),
            ),
          ),
        ),
      ),

edited Jul 06 '20 at 11:03

answered Jul 06 '20 at 10:36

Jitesh Mohite

31,138
12
157
147

Which scaffold? Setting it to Scaffold of HomeScreen didn't work, and to make matters worse, it changed the background colour of the home screen to white, which I don't want. – kaboc Jul 06 '20 at 10:49
@kaboc: Edited the answer, try that – Jitesh Mohite Jul 06 '20 at 11:03
Did you try it yourself? It does not work. FYI, `ColoredBox` can be used instead of `Container` to change the colour of a widget in newer versions of Flutter. – kaboc Jul 06 '20 at 11:12
I wonder how come it can work. LicensePage is another screen opened from HomeScreen, so I doubt changing the colour of the content in HomeScreen affects the background colour of LicensePage. – kaboc Jul 06 '20 at 11:23

Flutter - How can I change the background color of LicensePage?

3 Answers3