Flutter showBottomModalPopup高度延伸的幅度不超过屏幕尺寸的50％

Question

我正在尝试使用showBottomModalPopup，但即使在使用屏幕上下文设置高度的情况下，我似乎也无法将其扩展到屏幕的50％以上。

任何人都可以发现我在做什么错吗？我正在尝试将其设置为80％

此showBottomModal函数

void _tripShowModalBottomSheet(context) {
    showModalBottomSheet(context: context, builder: (BuildContext bc) {
      return Container(
        height: MediaQuery.of(context).size.height * .80,
        color: Colors.white,
        child: Text('this is your first showBottomModal')
      );
    });
  }

我从这里打电话

onLongPress: () => {
        _tripShowModalBottomSheet(context)
     },

如果需要，则提供完整代码

import 'package:flutter/material.dart';

class TransportMenuBody extends StatelessWidget {
  const TransportMenuBody({Key key}) : super(key: key);

  void _tripShowModalBottomSheet(context) {
    showModalBottomSheet(context: context, builder: (BuildContext bc) {
      return Container(
        height: MediaQuery.of(context).size.height * 30,
        color: Colors.white,
        child: Text('this is your first showBottomModal')
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    return  
          ListView(children: <Widget>[
            Container(
              padding: EdgeInsets.symmetric(vertical: 20.0, horizontal: 10.0),
              alignment: Alignment.topLeft,
              child: Column(
                mainAxisSize: MainAxisSize.max,
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  Container(
                    alignment: Alignment.topLeft,
                    margin: EdgeInsets.only(bottom: 10.0),
                    child: Text('Kigali', style: TextStyle(fontSize: 20, fontWeight: FontWeight.w400, color: Colors.black),),
                  ),
                  InkWell(
                    onLongPress: () => {
                      _tripShowModalBottomSheet(context)       // calling the function from here
                    },
                    onTap: () => {},
                    child: Container(
                      color: Colors.white,
                      width: MediaQuery.of(context).size.width * 1,
                      padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 10.0),
                      child: Container(
                        child: Container(
                          child: Column(
                            children: <Widget>[
                              Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[
                                Container(child: Text('201', style: TextStyle(fontSize: 24.0, fontWeight: FontWeight.w600))),
                                Container(
                                  alignment: Alignment.topLeft,
                                  child: Text('20 active buses', style: TextStyle(color: Color(0xFFd9d9d9)),),),
                              ],),
                              Row(
                              children: <Widget>[
                                Container(
                                  alignment: Alignment.topLeft,
                                  child: Text('Kicukiro(saint-joseph) - Down town'),),

                              ],),
                              const Divider(
                                color: Color(0xFFD9D9D9),
                                thickness: .5,
                              ),
                              Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[
                                Container(child: Text('201', style: TextStyle(fontSize: 24.0, fontWeight: FontWeight.w600))),
                                Container(
                                  alignment: Alignment.topLeft,
                                  child: Text('20 active buses', style: TextStyle(color: Color(0xFFd9d9d9)),),),
                              ],),
                              Row(
                              children: <Widget>[
                                Container(
                                  alignment: Alignment.topLeft,
                                  child: Text('Kicukiro(saint-joseph) - Down town'),),

                              ],),
                              const Divider(
                                color: Color(0xFFD9D9D9),
                                thickness: .5,
                              ),
                            ],)
                        )
                      )
                    ),
                  ),

                ],
                )
            ),
            Text('data'),
        ],
    );
  }
}

Answer 1

[我不知道bottomSheetModal是否可以增加高度，但是如果您想要具有丰富自定义功能的底部工作表，您还可以使用DraggableScrollableSheet，默认情况下它可以与漂亮的动画DraggableScrollableSheet一起滚动，您可以在此处进行检查https://api.flutter.dev/flutter/widgets/DraggableScrollableSheet-class.html