flutter Material示例与MediaQuery.of(context) called with a context that does not contain a MediaQuery.

报错：

flutter MediaQuery.of(context) called with a context that does not contain a MediaQuery.

原因：

Scaffold必须放在MaterialApp里面，否则会报错

正确示例：

import 'package:flutter/material.dart';

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

//MaterialApp ： 将根布局换成一个 StatelessWidget
//Scaffold ： 必须放在MaterialApp里面
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Material",
      home: LearnMaterial(),
    );
  }
}

class LearnMaterial extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _LearnMaterial();
  }
}

class _LearnMaterial extends State<LearnMaterial> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("material"),
        ),
        body: Column(
          children: <Widget>[
            Center(
              child: Material(
                color: Colors.blueAccent,
                shape: BeveledRectangleBorder(
                  //斜角矩形边框
                  side: BorderSide(
                    width: 1.0,
                    color: Colors.blueAccent,
                    style: BorderStyle.none,
                  ),
                  borderRadius: BorderRadius.circular(50.0),
                ),
                child: Container(
                  padding: EdgeInsets.all(20.0),
                  child: Text('斜角矩形边框'),
                ),
              ),
            ),
            Center(
              child: Material(
                color: Colors.blueAccent,
                shape: BeveledRectangleBorder(
                  //斜角矩形边框
                  side: BorderSide(
                    width: 1.0,
                    color: Colors.blueAccent,
                    style: BorderStyle.none,
                  ),
                  borderRadius: BorderRadius.circular(10.0),
                ),
                child: Container(
                  padding: EdgeInsets.all(20.0),
                  child: Text('斜角矩形边框'),
                ),
              ),
            ),
            Center(
              child: Material(
                color: Colors.blueAccent,
                shape: BorderDirectional(
                    start: BorderSide(
                      color: Colors.yellow,
                      width: 10.0,
                    ),
                    top: BorderSide(
                      color: Colors.deepOrange,
                      width: 10.0,
                    ),
                    end: BorderSide(
                      color: Colors.black87,
                      width: 10.0,
                    ),
                    bottom: BorderSide(
                      color: Colors.purpleAccent,
                      width: 10.0,
                    )),
                child: Container(
                  padding: EdgeInsets.all(30.0),
                  child: Text('多彩边框'),
                ),
              ),
            ),
            Center(
              child: Material(
                color: Colors.blueAccent,
                shape: CircleBorder(
                    side: BorderSide(
                  color: Colors.yellow,
                  width: 10.0,
                )),
                child: Container(
                  padding: EdgeInsets.all(50.0),
                  child: Text('圆形边框'),
                ),
              ),
            ),
            Center(
              child: Material(
                color: Colors.blueAccent,
                shape: RoundedRectangleBorder(
                  side: BorderSide(
                    color: Colors.purpleAccent,
                    width: 5.0,
                  ),
                  borderRadius: BorderRadius.circular(
                      20.0), //如果[borderRadius]被指定，那么[type]属性不能是 [MaterialType.circle]。
                ),
                child: Container(
                  padding: EdgeInsets.all(30.0),
                  child: Text('圆角矩形'),
                ),
              ),
            ),
            Center(
              child: Material(
                color: Colors.purpleAccent,
                elevation: 10.0,
                shadowColor: Colors.yellow,
                shape: StadiumBorder(
                    side: BorderSide(
                  color: Colors.brown,
                  width: 5.0,
                )),
                child: Container(
                  padding: EdgeInsets.all(30.0),
                  child: Text('体育场形状'),
                ),
              ),
            )
          ],
        ));
  }
}

效果图：