showModalBottomSheet() not opening a bottom modal in flutter

Question

The showModalBottomSheet does not pop up a modal. I am new to flutter and dart but I think this is a problem, I would not any help. The simple page to pop a bottom sheet modal below.. did not work.

```
  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
                  )
                )
              )
            );
          });
        }
      )
    )
  )
);

} } ```

I cannot seem to figure out what the probl

Answer 1

You can convert your body to a new widget.

Dart Pad Example

Full code:

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),
                      ),
                    ),
                  );
                });
          }),
    );
  }
}