Flutter MaterialApp 和 Scaffold 组件_flutter scaffold 必须写在materialapp中吗

● MaterialApp

MaterialApp 是一个方便的 widget，它封装了应用程序实现 Material Design 所需要的 一些 widget， 作为顶层 widget 使用； 那什么又是 Material design ? (一种设计语言)

Material Designhttps://www.youtube.com/watch?v=rrT6v5sOwJg

中文名：材料设计语言，是由Google推出的全新的设计语言，谷歌表示，这种设计语言旨在为手机、平板电脑、台式机和“其他平台”提供更一致、更广泛的“外观和感觉”;

Material Design正是通过还原物理世界的规则并对其进行抽象，从而让用户使用软件时更容易理解。从物理世界的纸墨中获得灵感，使用接近物理世界的纸张，来呈现用户界面。所以Material Design最恰当的翻译，应该是“质感设计”（“材料设计”亦可，不过“质感设计”可能更加信达雅）

MaterialApp 常用属性 ：

• home     (主页)
• title      （标题）
• color    （颜色）
• theme  （主题）
• router   （路由）

● Scaffold

Scaffold 是 material design 布局结构的基本实现。此类提供了用于显示 drawer， snackbar 和 底部 sheet  api

scaffold 常用属性 ：

• appbar  显示界面顶部（导航）的一个             AppBar
• body     当前界面所显示的主要内容  Widget
• drawer  抽屉菜单控件

 Scaffold 组件必须在  MaterialApp里面进行调用； 否则报错！No MediaQuery widget found.

也就是 根组件必须是 MaterialApp，Scaffold 需要包裹在 MaterialApp中使用！

import 'package:flutter/material.dart';
 
void main() {
  runApp(MyApp());
}
 
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('title'),
        ),
        body: HomeContent(),
      ),
    );
  }
}
 
class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Container(
      child: Text("老铁双击 666"),
    );
  }
}