modal_bottom_sheet icon indicating copy to clipboard operation
modal_bottom_sheet copied to clipboard

Using the ModalScrollController.of(context) doesnt allow dismissing scrollable views

Open cyberpwnn opened this issue 3 years ago • 6 comments

If you use ModalScrollController.of(context) in your scrollable view in some widget, then show that widget in a showMaterialModalBottomSheet builder, It will only dismiss if the scrollable view is shorter than the display height. If the scrollable view actually has something to scroll, then dragging down on the sheet will simply show the android "scroll edge" indicator, but wont even move the bottom sheet.

wow

cyberpwnn avatar Jan 27 '21 10:01 cyberpwnn

Please, provide an example of the issue that can be reproduced. This behavior should not happen and I am not aware that has been changed in latest releases. You can check here https://jamesblasco.github.io/modal_bottom_sheet/#/ and it scrolls as expected.

jamesblasco avatar Jan 27 '21 13:01 jamesblasco

I can confirm this issue, it is not working for me too. This is my code :

SingleChildScrollView(
      controller: ModalScrollController.of(context),
      child: Container(
        child: Padding(
          padding: EdgeInsets.symmetric(horizontal: 4.0.w),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Padding(
                padding: EdgeInsets.only(top: 2.0.h),
                child: Container(
                  decoration: new BoxDecoration(
                    color: Colors.grey.withOpacity(0.3),
                    borderRadius: BorderRadius.all(Radius.circular(8)),
                    shape: BoxShape.rectangle,
                  ),
                  height: 4.5.h,
                  child: TextFormField(
                    onChanged: (val) {},
                    maxLines: null,
                    controller: _searchController,
                    keyboardType: TextInputType.text,
                    style: TextStyle(color: Colors.black),
                    decoration: InputDecoration(
                      prefixIcon: Icon(
                        Icons.search,
                        color: Colors.grey,
                        size: 3.0.h,
                      ),
                      suffixIcon: IconButton(
                        onPressed: () {
                          _searchController.clear();
                        },
                        padding: EdgeInsets.all(0),
                        constraints: BoxConstraints(),
                        icon: Icon(
                          Icons.people,
                          color: Colors.grey,
                          size: 3.0.h,
                        ),
                      ),
                      border: InputBorder.none,
                      focusedBorder: InputBorder.none,
                      enabledBorder: InputBorder.none,
                      errorBorder: InputBorder.none,
                      disabledBorder: InputBorder.none,
                      hintText: "Search",
                      alignLabelWithHint: true,
                      hintStyle: TextStyle(color: Colors.grey, fontSize: 11.0.sp),
                    ),
                  ),
                ),
              ),
              Padding(
                padding: EdgeInsets.only(top: 2.5.h, bottom: 2.5.h),
                child: Text(
                  "Stories",
                  style: TextStyle(fontSize: 12.0.sp, color: Colors.black),
                ),
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Row(
                    children: [
                      Container(
                        decoration: new BoxDecoration(
                          shape: BoxShape.circle,
                          border: new Border.all(
                            color: Colors.grey,
                            width: 0.5,
                          ),
                        ),
                        child: CircleAvatar(
                          radius: 3.0.h,
                          backgroundColor: Colors.transparent,
                          backgroundImage: NetworkImage(CurrentUser().currentUser.image),
                        ),
                      ),
                      SizedBox(
                        width: 3.0.w,
                      ),
                      Text(
                        "Your Story",
                        style: TextStyle(fontSize: 10.0.sp, color: Colors.black),
                      ),
                    ],
                  ),
                  Row(
                    children: [
                      GestureDetector(
                        onTap: widget.onTap ?? () {},
                        child: Container(
                            decoration: new BoxDecoration(
                              color: primaryBlueColor,
                              borderRadius: BorderRadius.all(Radius.circular(5)),
                              shape: BoxShape.rectangle,
                            ),
                            child: Padding(
                              padding: EdgeInsets.symmetric(horizontal: 4.0.w, vertical: 0.8.h),
                              child: Text(
                                "Share",
                                style: whiteBold.copyWith(fontSize: 10.0.sp),
                              ),
                            )),
                      ),
                    ],
                  ),
                ],
              ),
              Padding(
                padding: EdgeInsets.only(top: 2.5.h, bottom: 2.5.h),
                child: Text(
                  "Messages",
                  style: TextStyle(fontSize: 12.0.sp, color: Colors.black),
                ),
              ),
              areFollowersLoaded
                  ? SingleChildScrollView(
                      physics: NeverScrollableScrollPhysics(),
                      child: Column(
                        children: followersList.followers
                            .map((followers) => Padding(
                                  padding: EdgeInsets.symmetric(vertical: 1.5.h),
                                  child: InkWell(
                                    onTap: () {},
                                    child: Row(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Row(
                                          children: [
                                            Container(
                                              decoration: new BoxDecoration(
                                                shape: BoxShape.circle,
                                                border: new Border.all(
                                                  color: Colors.grey,
                                                  width: 0.5,
                                                ),
                                              ),
                                              child: CircleAvatar(
                                                radius: 3.0.h,
                                                backgroundColor: Colors.transparent,
                                                backgroundImage: NetworkImage(followers.userImage),
                                              ),
                                            ),
                                            SizedBox(
                                              width: 3.0.w,
                                            ),
                                            Column(
                                              crossAxisAlignment: CrossAxisAlignment.start,
                                              children: [
                                                Text(
                                                  followers.shortcode,
                                                  style: blackBold.copyWith(fontSize: 10.0.sp),
                                                ),
                                                Text(
                                                  followers.memberFirstname,
                                                  style: TextStyle(fontSize: 9.0.sp),
                                                ),
                                              ],
                                            ),
                                          ],
                                        ),
                                        Row(
                                          children: [
                                            Container(
                                                decoration: new BoxDecoration(
                                                  color: primaryBlueColor,
                                                  borderRadius: BorderRadius.all(Radius.circular(5)),
                                                  shape: BoxShape.rectangle,
                                                ),
                                                child: Padding(
                                                  padding: EdgeInsets.symmetric(horizontal: 4.5.w, vertical: 0.8.h),
                                                  child: Text(
                                                    "Send",
                                                    style: whiteBold.copyWith(fontSize: 10.0.sp),
                                                  ),
                                                )),
                                          ],
                                        ),
                                      ],
                                    ),
                                  ),
                                ))
                            .toList(),
                      ),
                    )
                  : Container(),
            ],
          ),
        ),
      ),
    )

ali9653 avatar Mar 05 '21 08:03 ali9653

Please, if you can share an example code that has the error and I can use locate the error. That code does not compile for me as has dependencies to external code and packages

jamesblasco avatar Apr 04 '21 08:04 jamesblasco

@jamesblasco He says that, in your NestedScrollModal class, if you put:

return NestedScrollView(
      controller: ModalScrollController.of(context),

the modal is not dismissable anymore

strepier avatar Apr 19 '21 17:04 strepier

Yep, I'm seeing this issue too!

jagged91 avatar Apr 23 '21 19:04 jagged91

I have this same problem!

ziqq avatar Jul 02 '21 08:07 ziqq