flutter - showModalBottomSheet()未在flutter中打开底部模态

Question

showModalBottomSheet不会弹出模式。我不熟悉 Dart ，但是我认为这是一个问题，我没有任何帮助。在下面弹出底部工作表模式的简单页面无效。

```
  import 'package:flutter/material.dart';

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

   class MyApp extends StatelessWidget {
     @override
      Widget build(BuildContext context) {

        return new MaterialApp(
           home: new Scaffold(
             appBar: new AppBar(title: const Text('Modal bottom sheet')),
             body: new Center(
               child: new RaisedButton(
                child: const Text('SHOW BOTTOM SHEET'),
               onPressed: () {
                 showModalBottomSheet<void>(context: context, builder: (BuildContext context) 
               {
            return new Container(
              child: new Padding(
                padding: const EdgeInsets.all(32.0),
                child: new Text('This is the modal bottom sheet. Click anywhere to dismiss.',
                  textAlign: TextAlign.center,
                  style: new TextStyle(
                    color: Theme.of(context).accentColor,
                    fontSize: 24.0
                  )
                )
              )
            );
          });
        }
      )
    )
  )
);

}
}
```

我似乎无法弄清楚什么问题

Answer 1

您可以将您的 body 转换为新的小部件。

Dart Pad Example

完整代码:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        home: new Scaffold(
            appBar: new AppBar(title: const Text('Modal bottom sheet')),
            body: Sheet(), // new Widget
   ));
  }
}


class Sheet extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Center(
      child: new RaisedButton(
          child: const Text('SHOW BOTTOM SHEET'),
          onPressed: () {
            // Show sheet here
            showModalBottomSheet<void>(
                context: context,
                builder: (BuildContext context) {
                  return new Container(
                    child: new Padding(
                      padding: const EdgeInsets.all(32.0),
                      child: new Text(
                        'This is the modal bottom sheet. Click anywhere to dismiss.',
                        textAlign: TextAlign.center,
                        style: new TextStyle(
                            color: Theme.of(context).accentColor,
                            fontSize: 24.0),
                      ),
                    ),
                  );
                });
          }),
    );
  }
}