Flutter Theme FlatButton textColor in ButtonBar

Question

After upgrading Flutter to version: [✓] Flutter (Channel master, v0.10.2-pre.82)

The primaryColor have disappeared from my FlatButton.

Widget:

new ButtonTheme.bar(
        // make buttons use the appropriate styles for cards

        child: new ButtonBar(
          children: <Widget>[
            new FlatButton(
              child: const Text('DISMISS'),
              onPressed: () {/* ... */},
            ),
            new FlatButton(
              child: const Text('LEARN MORE'),
              onPressed: () {/* ... */},
            ),
          ],
        ),
      ),

Theme:

final originalTextTheme = ThemeData.light().textTheme;
final originalButtonTheme = ThemeData.light().buttonTheme;    
final originalBody1 = originalTextTheme.body1;

    return ThemeData.light().copyWith(
        primaryColor: Colors.green[700],
        accentColor: Colors.green[500],
        buttonColor: Colors.grey[800],
        buttonTheme: originalButtonTheme,
        textTheme: originalTextTheme.copyWith(
            body1:
                originalBody1.copyWith(decorationColor: Colors.transparent))); 

How do I theme the textColor of my FlatButtons?

Solution

If you want the your FlatButton's textColor to be the same as ThemeData.primaryColor, you also need to set ColorScheme.primary with the same value.

const primaryColor = Colors.deepOrange;

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primaryColor: primaryColor,
        colorScheme: ColorScheme.light(
          primary: primaryColor, // -------> This will be your FlatButton's text color
        ),
        accentColor: Colors.amber,
      ),
      title: 'YourAwesomeApp',
      home: Scaffold(
        body: PageWithFlatButtons(),
      ),
    );
  }
}

class PageWithFlatButtons extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.center,
      child: ButtonBar(
        alignment: MainAxisAlignment.center,
        children: <Widget>[
          new FlatButton(
            child: const Text('DISMISS'),
            onPressed: () {},
          ),
          new FlatButton(
            child: const Text('LEARN MORE'),
            onPressed: () {},
          ),
        ],
      ),
    );
  }
}