How to apply theme on MaterialButton or RaisedButton?

前端 未结 4 1273
广开言路
广开言路 2021-02-19 15:08

Can someone help to point how do we define base theme for button and use it on every button? Everywhere I look only found textTheme but not buttonTheme

4条回答
  •  耶瑟儿~
    2021-02-19 15:37

    [August 2020 - Flutter 1.20]

    Since 1.20 you can create different button theme configurations based on button types.

    Sample code for color settings:

    void main() {
      runApp(
        MaterialApp(
          home: Home(),
          theme: ThemeData.from(
            colorScheme: ColorScheme.light(),
          ).copyWith(
            textButtonTheme: TextButtonThemeData(
              style: TextButton.styleFrom(
                primary: Colors.orange,
              ),
            ),
            elevatedButtonTheme: ElevatedButtonThemeData(
              style: ElevatedButton.styleFrom(
                onPrimary: Colors.yellow,
                primary: Colors.blue,
              ),
            ),
            outlinedButtonTheme: OutlinedButtonThemeData(
              style: OutlinedButton.styleFrom(
                primary: Colors.purple,
                backgroundColor: Colors.green,
              ),
            ),
          ),
        ),
      );
    }
    
    class Home extends StatelessWidget {
      Widget build(BuildContext context) {
        return Scaffold(
          body: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                TextButton(
                  onPressed: () {},
                  child: Text('TextButton'),
                ),
                ElevatedButton(
                  onPressed: () {},
                  child: Text('ElevatedButton'),
                ),
                OutlinedButton(
                  onPressed: () {},
                  child: Text('OutlinedButton'),
                ),
              ],
            ),
          ),
        );
      }
    }
    

    Important release notes from flutter (you can find more information about the options in the migration guide):

    FlatButton, RaisedButton, and OutlineButton have been replaced by TextButton, ElevatedButton, and OutlinedButton respectively. ButtonTheme has been replaced by TextButtonTheme, ElevatedButtonTheme, and OutlinedButtonTheme. The original classes will be deprecated soon, please migrate code that uses them. There's a detailed migration guide for the new button and button theme classes in flutter.dev/go/material-button-migration-guide.

提交回复
热议问题