Disable drag on bottom sheet modal

Viewed 733

I want to use an modal bottomSheetModal in which I want to show an gridView with some elements. I use showModalBottomSheet method to bring the modal into de view.

showModalBottomSheet(
    context: context,
    isScrollControlled: true,
    builder: (BuildContext context) {
        return Container(
            width: MediaQuery.of(context).size.width,
            height: MediaQuery.of(context).size.height / 2,
            color: Colors.grey[300],
            child: CategoryModal(),
        );
    },
);

In the CategoryModal I have a future which takes some data from database:

CategoryModal extends StatelessWidget {
Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
         ...
          Expanded(
            child: FutureBuilder<List<Category>>(
                future: CategoryRepository.getAll(),
                builder: (BuildContext context, AsyncSnapshot<List<Category>> snapshot) {
                  if (snapshot.connectionState == ConnectionState.done) {
                    if (snapshot.hasError) {
                      return Text(
                        snapshot.error.toString(),
                      );
                    }

                    return getCategoriesGrid(snapshot.data);
                  }

                  return Text("Loading");
                }),
          ),
        ],
      ),
    );
  }
}

The problem I encounter is that, the modal has the draggable option to close, and if I drag it down slowly, the data is refreshed every time. I found that there is a parameter for BottomSheet class, enableDrag which disable the drag, but is not available for the showModalBottomSheet method.

Is there a way of stopping the refresh of the data or to disable the drag option of the modal ?

1 Answers

Here is the solution for your problem,

   showModalBottomSheet(
    context: context,
    enableDrag: false,
    isScrollControlled: true,
Related