显示后 Flutter 更改对话框高度

Question

在显示对话框后出现抖动，我想更改它的高度，例如制作全屏对话框高度，我实现的代码无法正常工作，再次显示后我有全屏。如何实时更改对话框的高度？

void main() => runApp(MaterialApp(home: DialogCustomHeight(),));

class DialogCustomHeight extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => DialogCustomHeightState();
}

class DialogCustomHeightState extends State<DialogCustomHeight> {
  bool fullScreenDialog = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: RaisedButton(
          color: Colors.white,
          child: Text(
            'show dialog'
          ),
          onPressed: () => _showDialog(),
        ),
      ),
    );
  }

  _showDialog() {
    bool _fromTop = true;
    return showGeneralDialog(
      barrierLabel: "Label",
      barrierDismissible: true,
      barrierColor: Colors.black.withOpacity(0.5),
      transitionDuration: Duration(milliseconds: 200),
      context: context,
      pageBuilder: (context, anim1, anim2) {
        return Align(
          alignment: _fromTop ? Alignment.topCenter : Alignment.bottomCenter,
          child: Container(
            height: fullScreenDialog ? MediaQuery.of(context).size.height : MediaQuery.of(context).size.height * 0.500,
            child: SizedBox.expand(
                child: ClipRRect(
                    borderRadius: BorderRadius.only(
                      bottomRight: Radius.circular(10.0),
                      bottomLeft: Radius.circular(10.0),
                    ),
                    child: Container(
                      color:Colors.green,
                      child: Center(
                        child: RaisedButton(
                          color: Colors.white,
                          child: Text(
                            'change height'
                          ),
                          onPressed: () {
                            setState(() {
                              fullScreenDialog = !fullScreenDialog;
                            });
                          },
                        ),
                      ),
                    ))),
          ),
        );
      },
      transitionBuilder: (context, anim1, anim2, child) {
        return FadeTransition(
          opacity: new CurvedAnimation(parent: anim1, curve: Curves.easeOut),
          child: SlideTransition(
            position: Tween(begin: Offset(0, _fromTop ? -0.1 : 0.1), end: Offset(0, 0)).animate(anim1),
            child: child,
          ),
        );
      },
    );
  }
}

Answer 1

输出(自上而下):

输出(从底部开始)

void main() => runApp(MaterialApp(home: DialogCustomHeight()));

class DialogCustomHeight extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => DialogCustomHeightState();
}

class DialogCustomHeightState extends State<DialogCustomHeight> {
  bool fullScreenDialog = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: RaisedButton(
          color: Colors.white,
          child: Text('show dialog'),
          onPressed: () => _showDialog(),
        ),
      ),
    );
  }

  _showDialog() {
    bool _fromTop = false;
    return showGeneralDialog(
      barrierLabel: "Label",
      barrierDismissible: true,
      barrierColor: Colors.black.withOpacity(0.5),
      transitionDuration: Duration(milliseconds: 200),
      context: context,
      pageBuilder: (context, anim1, anim2) {
        return MyDialog(fromTop: _fromTop, fullScreen: fullScreenDialog);
      },
      transitionBuilder: (context, anim1, anim2, child) {
        return FadeTransition(
          opacity: new CurvedAnimation(parent: anim1, curve: Curves.easeOut),
          child: SlideTransition(
            position: Tween(begin: Offset(0, _fromTop ? -0.1 : 0.1), end: Offset(0, 0)).animate(anim1),
            child: child,
          ),
        );
      },
    );
  }
}

class MyDialog extends StatefulWidget {
  final bool fromTop;
  final bool fullScreen;

  const MyDialog({Key key, this.fromTop, this.fullScreen}) : super(key: key);

  @override
  _MyDialogState createState() => _MyDialogState();
}

class _MyDialogState extends State<MyDialog> {
  bool _fromTop, _fullScreen;

  @override
  void initState() {
    super.initState();
    _fromTop = widget.fromTop;
    _fullScreen = widget.fullScreen;
  }

  @override
  Widget build(BuildContext context) {
    return Align(
      alignment: _fromTop ? Alignment.topCenter : Alignment.bottomCenter,
      child: Container(
        height: _fullScreen ? MediaQuery.of(context).size.height : MediaQuery.of(context).size.height * 0.500,
        child: SizedBox.expand(
          child: ClipRRect(
            borderRadius: BorderRadius.only(
              bottomRight: Radius.circular(10.0),
              bottomLeft: Radius.circular(10.0),
            ),
            child: Container(
              color: Colors.green,
              child: Center(
                child: RaisedButton(
                  color: Colors.white,
                  child: Text('change height'),
                  onPressed: () {
                    setState(() {
                      _fullScreen = !_fullScreen;
                    });
                  },
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}