flutter踩坑之No Material widget found

错误代码

class _FavoriteWidgetState extends State {

  bool _isFavorited = true;
  int _favoriteCount = 41;


  void _toggleFavorite() {
    setState(() {
      if (_isFavorited) {
        _favoriteCount -= 1;
      } else {
        _favoriteCount += 1;
      }
      _isFavorited = !_isFavorited;
    });
  }

  @override
  Widget build(BuildContext context) {
    //因为这里返回的是需要状态的widget所以这里不能直接返回一个row 必须用Scaffold包裹
    return new Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        new Container(
          padding: EdgeInsets.all(10),
          child: new IconButton(
            icon: _isFavorited ? new Icon(Icons.star) : new Icon(
                Icons.star_border),
            color: Colors.red[500],
            onPressed: _toggleFavorite,
          ),
        ),
        new SizedBox(
          width: 100.0,
          child: new Container(
            child: new Text("$_favoriteCount人喜欢",
              style: new TextStyle(fontSize: 16, color: Colors.yellow[500]),),
          ),
        )
      ],
    );
  }

}

错误信息

I/flutter (11947): No Material widget found.
I/flutter (11947): IconButton widgets require a Material widget ancestor.
I/flutter (11947): In material design, most widgets are conceptually "printed" on a sheet of material. In Flutter's
I/flutter (11947): material library, that material is represented by the Material widget. It is the Material widget
I/flutter (11947): that renders ink splashes, for instance. Because of this, many material library widgets require that
I/flutter (11947): there be a Material widget in the tree above them.
I/flutter (11947): To introduce a Material widget, you can either directly include one, or use a widget that contains
I/flutter (11947): Material itself, such as a Card, Dialog, Drawer, or Scaffold.

分析

其实返回一个Row是没有问题的，因为Row也是继承自Widget，但是日志显示里面使用到了IconButton，这是一个material组件，所以外层必须使用material包裹，日志中说明了material根布局有Card, Dialog, Drawer Scaffold。按照所说修改代码

正确代码

class _FavoriteWidgetState extends State {

  bool _isFavorited = true;
  int _favoriteCount = 41;


  void _toggleFavorite() {
    setState(() {
      if (_isFavorited) {
        _favoriteCount -= 1;
      } else {
        _favoriteCount += 1;
      }
      _isFavorited = !_isFavorited;
    });
  }

  @override
  Widget build(BuildContext context) {
    //因为这里返回的是需要状态的widget所以这里不能直接返回一个row 必须用Scaffold包裹
    return new Scaffold(appBar: new AppBar(title: new Text("测试"),), body:
    new Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        new Container(
          padding: EdgeInsets.all(10),
          child: new IconButton(
            icon: _isFavorited ? new Icon(Icons.star) : new Icon(
                Icons.star_border),
            color: Colors.red[500],
            onPressed: _toggleFavorite,
          ),
        ),
        new SizedBox(
          width: 100.0,
          child: new Container(
            child: new Text("$_favoriteCount人喜欢",
              style: new TextStyle(fontSize: 16, color: Colors.yellow[500]),),
          ),
        )
      ],
    ),
    );
  }

}