ShowModalBottomSheet bottom overflow

  1. Summary of my problem
    I have an issue getting the showModalBottomSheet to display contents when device is in landscape orientation.
  • Details about my goal
    This is a screenshot to explaine the issue better - Screenshot_20200403-205751

I only have this issue in landscape orientation.

  • Here’s the minimum code you would need to reproduce the problem -
void _startAddNewTransaction(BuildContext ctx) {
    showModalBottomSheet(
      context: ctx,
      backgroundColor: Theme.of(context).scaffoldBackgroundColor,
      builder: (_) {
        return GestureDetector(
          child: TransactionNew(_addNewTransaction),
          behavior: HitTestBehavior.opaque,
          onTap: () {},
        );
      },
    );
  }

transaction_new.dart
@override
  Widget build(BuildContext context) {
    return Card(
      elevation: 5,
      child: Container(
        padding: EdgeInsets.all(Constants.containerPadding),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.end,
          children: <Widget>[
            TextField(
              decoration: InputDecoration(
                labelText: AppStrings.title,
                labelStyle: Theme.of(context).textTheme.body2,
              ),
              controller: _titleController,
              keyboardType: TextInputType.text,
              onSubmitted: (_) => _submitData(),
              style: Theme.of(context).textTheme.body2,
            ),
            TextField(
              decoration: InputDecoration(
                labelText: AppStrings.amount,
                labelStyle: Theme.of(context).textTheme.body2,
              ),
              controller: _amountController,
              keyboardType: TextInputType.number,
              onSubmitted: (_) => _submitData(),
              style: Theme.of(context).textTheme.body2,
            ),
            Container(
              height: 70,
              child: Row(
                children: <Widget>[
                  Expanded(
                    child: Text(
                      _selectedDate == null
                          ? AppStrings.noDateChosen
                          : AppStrings.chosenDate +
                              ' : ${DateFormat.yMd().format(_selectedDate)}',
                      style: Theme.of(context).textTheme.subtitle,
                    ),
                  ),
                  Container(
                    height: 30,
                    decoration: BoxDecoration(
                      border: Border.all(
                        color: Theme.of(context).primaryColor,
                        width: 1,
                      ),
                      borderRadius:
                          BorderRadius.circular(Constants.borderRadius_8),
                    ),
                    child: FlatButton(
                      child: Text(
                        AppStrings.choseDate,
                        style: Theme.of(context).textTheme.button,
                      ),
                      onPressed: _presentDatePicker,
                    ),
                  ),
                ],
              ),
            ),
            RaisedButton(
              child: Text(AppStrings.addTransaction),
              onPressed: _submitData,
            ),
          ],
        ),
      ),
    );
  } ```

Please add this property in your showModalBottomSheet.

  isScrollControlled: true,

This will allow your modal height to increase.