Question

我希望MenuPage中具有不同的背景颜色。我试图覆盖themeData-我已经从官方flutter页面上关注了themeData教程，但无法获得结果。你们有什么建议吗？

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

final ThemeData _themeData = new ThemeData( // app theme
        scaffoldBackgroundColor: darkNavy,
        canvasColor: lightNavy,
        accentColor: lightNavy,
        primarySwatch: Colors.grey,
        appBarTheme: AppBarTheme(
            color: darkNavy,
            brightness: Brightness.dark,
            elevation: 10,
            iconTheme: IconThemeData(
              color: lightGrey,
            ),
            textTheme: TextTheme(
                headline6: GoogleFonts.crimsonPro(
                    color: darkGrey,
                    fontSize: 20,
                    fontWeight: FontWeight.w400))),
      
);



class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.portraitUp,
    ]);

    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: _themeData,
      home: HomeScreen(),
    );
  }
}


class MenuDashBoard extends StatefulWidget {

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

class _MenuDashBoardState extends State<MenuDashBoard> {
  @override
  Widget build(BuildContext context) {
    return Theme(
        data: ThemeData(
              canvasColor: lightNavy,
              scaffoldBackgroundColor: lightNavy
            ),
      
      child: Scaffold(
        body: Container(
            padding: EdgeInsets.only(top: 30, bottom: 30, left: 20),
            child: Column(

我的主主屏幕具有深海军蓝色背景，我想在“菜单”页面中具有浅海军蓝色。

Answer 1

您可以在主题数据中使用属性'scaffoldBackgroundColor'，将其设置为所需的颜色。如果使用了脚手架小部件，则背景应用程序将具有所需的颜色。参见：

MaterialApp(
   title: 'App',
   theme: ThemeData(
     scaffoldBackgroundColor: Colors.blue,
   ),
   home: YourScreen()
),

无法覆盖ThemeData

1 个答案: