flutter基础布局之MaterialApp

原创于 2021-04-04 11:41:56 发布 · 155 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#MaterialApp

flutter 专栏收录该内容

220 篇文章

订阅专栏

本文介绍了Flutter中的MaterialApp组件，展示了如何配置主页、定义路由和主题。MaterialApp是Flutter应用的基础，用于设置全局主题、导航和应用结构。示例中涵盖了基本的AppBar配置和创建多个页面路由的方法。

https://api.flutter.dev/flutter/material/MaterialApp-class.html

MaterialApp(
  home: Scaffold(
    appBar: AppBar(
      title: const Text('Home'),
    ),
  ),
  debugShowCheckedModeBanner: false,
)

MaterialApp(
  routes: <String, WidgetBuilder>{
    '/': (BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: const Text('Home Route'),
        ),
      );
    },
    '/about': (BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: const Text('About Route'),
        ),
      );
     }
   },
)

MaterialApp(
  theme: ThemeData(
    brightness: Brightness.dark,
    primaryColor: Colors.blueGrey
  ),
  home: Scaffold(
    appBar: AppBar(
      title: const Text('MaterialApp Theme'),
    ),
  ),
)