Listview bên trong DraggableScrollableSheet không cuộn trong rung

Tôi được thiết kế thiết kế lồng nhau rất nặng nề như bên dưới, vấn đề khi danh sách của tôi mở rộng listview dường như không cuộn là lý do cho việc này, bảng dưới được mở rộng nhưng không có sự tập trung vào listview bên trong nó, nếu tôi cuộn qua chạm vào văn bản 'Giờ hoạt động', nó bắt đầu cuộn nhưng khi nó đi lên tôi không thể trượt nó xuống.

_showDialog(BuildContext context) {
    print("_showDialog");
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      builder: (BuildContext context) {
        return DraggableScrollableSheet(
          expand: false,
          builder: (context, scrollController) {
            return Container(
              child: Stack(
                children: <Widget>[
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Align(
                          alignment: Alignment.topCenter,
                          child: Container(
                              margin: EdgeInsets.symmetric(vertical: 8),
                              height: 8.0,
                              width: 70.0,
                              decoration: BoxDecoration(
                                  color: Colors.grey[400],
                                  borderRadius: BorderRadius.circular(10.0)))),
                      SizedBox(height: 16),
                      Padding(
                        padding: const EdgeInsets.symmetric(horizontal: 24),
                        child: Text('Operational Hours',
                            style: TextStyle(
                                fontWeight: FontWeight.bold,
                                fontSize: widget.isTab(context)
                                    ? TabTextStyles.mediumText
                                        .copyWith()
                                        .fontSize
                                    : PhoneTextStyles.mediumText
                                        .copyWith()
                                        .fontSize)),
                      ),
                    ],
                  ),
                  ListView(
                    controller: scrollController,
                    children: <Widget>[
                      SizedBox(height: 54.0),
                      Padding(
                        padding: const EdgeInsets.symmetric(horizontal: 24),
                        child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: <Widget>[
                              SizedBox(height: 20.0),
                              Text('Select days to add hours',
                                  style: widget.isTab(context)
                                      ? TabTextStyles.mediumText.copyWith()
                                      : PhoneTextStyles.mediumText.copyWith()),
                            ]),
                      ),
                      DaysList()
                    ],
                  ),
                ],
              ),
              decoration: BoxDecoration(
                shape: BoxShape.rectangle,
                color: Theme.of(context).backgroundColor,
                borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(24.0),
                  topRight: Radius.circular(24.0),
                ),
              ),
            );
          },
        );
      },
    );
  }

Có một vài sai lầm bạn đang mắc phải. Đầu tiên, đặt các vật dụng trong Columnđó luôn luôn hiển thị ở trên cùng, thứ hai bọc bạn DaysListvào Expandedvà chuyển qua ScrollControllernó.

Đây là phương pháp của bạn:

void _showDialog(BuildContext context) {
  showModalBottomSheet(
    context: context,
    isScrollControlled: true,
    builder: (BuildContext context) {
      return DraggableScrollableSheet(
        expand: false,
        builder: (context, scrollController) {
          return Column(
            children: <Widget>[
              // Put all heading in column.
              column,
              // Wrap your DaysList in Expanded and provide scrollController to it
              Expanded(child: DaysList(controller: scrollController)),
            ],
          );
        },
      );
    },
  );
}

Đây là của bạn Column:

Widget get column {
  return Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: <Widget>[
      Align(
        alignment: Alignment.topCenter,
        child: Container(
          margin: EdgeInsets.symmetric(vertical: 8),
          height: 8.0,
          width: 70.0,
          decoration: BoxDecoration(color: Colors.grey[400], borderRadius: BorderRadius.circular(10.0)),
        ),
      ),
      SizedBox(height: 16),
      Padding(
        padding: const EdgeInsets.symmetric(horizontal: 24),
        child: Text('Operational Hours', style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),),
      ),
      Padding(
        padding: const EdgeInsets.symmetric(horizontal: 24),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            SizedBox(height: 20.0),
            Text('Select days to add hours'),
          ],
        ),
      ),
      SizedBox(height: 16),
    ],
  );
}

Và đây là cách bạn DaysListsẽ trông như thế nào:

class DaysList extends StatelessWidget {
  final ScrollController controller;

  const DaysList({Key key, this.controller}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      controller: controller, // assign controller here
      itemCount: 20,
      itemBuilder: (_, index) => ListTile(title: Text("Item $index")),
    );
  }
}

Đầu ra: