在 flutter 中的 singlechildscrollview 后，ModalBottomSheet 中的底部按鈕不可見

Question

我希望取消費用和底部按鈕保持固定在屏幕上，而選擇座位和乘客應該是可滾動的。 但是，每當我嘗試在 singlechildscrollview 之后插入任何小部件時，它都不會出現在底部。

因為，我的列有 3 個小部件，一行，singlechildscrollview 和按鈕，所以我的按鈕和頂行應該保留在那里，剩余的座位和乘客應該是可滾動的，但我看不到底部按鈕，而我的行工作正常，留在那里。

代碼 -

showCancellationCharges(BuildContext? context) {
    final DateTime currentDate = DateTime.now();
    if (ticketData!.data!.booking!.boarding!.eta! >
        currentDate.millisecondsSinceEpoch)
      showModalBottomSheet(
        backgroundColor: Colors.white,
          context: context!,
          builder: (context) => Wrap(
            children: [
              StatefulBuilder(
                    builder: (context, stateSetter) => Padding(
                      padding: MediaQuery.of(context).viewInsets,
                      child: Container(
                        //height: MediaQuery.of(context).size.height*0.7,
                        child: Container(
                          padding: EdgeInsets.symmetric(horizontal: 16),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            mainAxisSize: MainAxisSize.min,
                            children: [
                              Padding(
                                padding: const EdgeInsets.only(top: 5.0, bottom: 5.0),
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    Text(
                                      'Cancellation Charges',
                                      style: TextStyle(
                                        fontWeight: FontWeight.bold,
                                        fontSize: 20,
                                      )
                                    ),
                                    IconButton(
                                      icon: Icon(
                                        Icons.close,
                                        color: colorPrimary,
                                      ),
                                      onPressed: () {
                                        Navigator.of(context).pop();
                                      },
                                    ),
                                  ],
                                ),
                              ),
                              Container(
                                height: MediaQuery.of(context).size.height*0.5,
                                child: SingleChildScrollView(
                                  child: Column(
                                    crossAxisAlignment: CrossAxisAlignment.start,
                                    children: [
                                      Padding(
                                        padding: const EdgeInsets.symmetric(vertical: 8.0),
                                        child: Text(
                                          'Choose Seat(s)',
                                          style: TextStyle(color: popUpLightTextColor),
                                        ),
                                      ),
                                      Column(
                                        children: List.generate(
                                            ticketData!.data!.booking!.seats!.length,
                                                (index) => CancellationItem(
                                              checkBoxState: ticketData!.data!.booking!
                                                  .seats![index].selected,
                                              checkBox: (v) => stateSetter(() {
                                                print('seat at index $index $v');
                                                if (v)
                                                  totalSeatToCancel++;
                                                else
                                                  totalSeatToCancel--;
                                                ticketData!.data!.booking!.seats![index]
                                                    .selected = v;
                                              }),
                                              // checkBoxState: data[index.],
                                              imagePath:
                                              'assets/icons/ticket_seat_icon.svg',
                                              title: ticketData!
                                                  .data!.booking!.seats![index].code,
                                            )),
                                      ),
                                      // CancellationSeatItems(
                                      //   data: ticketData.data.booking.seats,
                                      // ),
                                      Padding(
                                        padding: const EdgeInsets.symmetric(vertical: 8.0),
                                        child: Text(
                                          'Choose Passenger(s)',
                                          style: TextStyle(color: popUpLightTextColor),
                                        ),
                                      ),

                                      Column(
                                        children: List.generate(
                                            ticketData!.data!.booking!.passengers!.length,
                                                (index) => CancellationItem(
                                              checkBoxState: ticketData!.data!.booking!
                                                  .passengers![index].selected,
                                              checkBox: (v) => stateSetter(() {
                                                if (v)
                                                  totalPassengerToCancel++;
                                                else
                                                  totalPassengerToCancel--;
                                                print('passenger at index $index $v');
                                                ticketData!.data!.booking!
                                                    .passengers![index].selected = v;
                                              }),
                                              imagePath: (ticketData!.data!.booking!
                                                  .passengers![index].gender ==
                                                  'MALE')
                                                  ? 'assets/icons/male_icon.svg'
                                                  : 'assets/icons/female_icon.svg',
                                              title: ticketData!.data!.booking!
                                                  .passengers![index].name,
                                            )),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                              Padding(
                                padding: const EdgeInsets.symmetric(vertical: 16),
                                child: Container(
                                  child: ValueListenableBuilder(
                                    valueListenable: isCalculating,
                                    builder: (BuildContext context, bool val, Widget? child) {
                                      return FlatButton(
                                        height: 44,
                                        minWidth: MediaQuery.of(context).size.width,
                                        color: val ? Colors.grey : colorPrimary,
                                        onPressed: () => calculateItem(),
                                        child: Text(
                                          val ? 'Calculating...' : 'Calculate',
                                          style: TextStyle(
                                              color: Colors.white,
                                              fontSize: 16
                                          ),
                                        ),
                                      );
                                    },
                                  ),
                                ),
                              ),
                              // CancellationPassengerItems(
                              //   data: ticketData.data.booking.passengers,
                              // ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ),
            ],
          ));
    else
      _snackbarService.showSnackbar(
          message: 'Sorry, ticket can not be cancelled');
  }

Answer 1

您可以將列表視圖放在具有高度的容器中

Answer 2

其實我解決了這個問題。 我剛剛使用了isScrollControlled: true, showModalBottomSheet的參數，它就完成了。