Search code examples
flutterflutter-layoutflutter-bottomnavigationflutter-showmodalbottomsheet

Flutter SolidBottomSheet remove white edges


Using this package I can't seem to remove white space. The problem is that this package doesn't use show Modal Bottom Sheet.

bottomNavigationBar: SolidBottomSheet(
        controller: _controller,
        draggableBody: false,
        headerBar: Container(
          decoration: BoxDecoration(color:Colors.grey.shade200, borderRadius: BorderRadius.only(topLeft: Radius.circular(25),topRight: Radius.circular(25)),boxShadow: [
            BoxShadow(
              color: Colors.grey.withOpacity(0.5),
              spreadRadius: 5,
              blurRadius: 7,
              offset: Offset(0, 3), // changes position of shadow
            ),
          ],),
          child: ClipRRect(
            borderRadius:const BorderRadius.only(topRight: Radius.circular(25),topLeft: Radius.circular(25)),
            child: OutlinedButton(
                child: Column(

                  children: const [
                    Icon(Icons.expand_less, color: Colors.black,size: 40,),
                    Text("Choose Path",style: TextStyle(color: Colors.black, fontSize: 23),)
                  ],
                ),
                onPressed: () {
                  _controller.isOpened ? _controller.hide() : _controller.show();
                }),
          ),
        ),
        body: Container(

          color: Colors.white,
          height: 30,
          child: Column(
            children: [

              /*Row(
            children: [
              (ModalRoute.of(context)?.hasActiveRouteBelow ?? false) ? BackButton(
                onPressed: () {
                  Get.back();
              }) : Container(),
            ],
          ),*/
              Expanded(
                child: ListView.builder(
                  itemCount: _pathsController.pathsObx.value.length,
                  scrollDirection: Axis.vertical,
                  itemBuilder: (context, index) {
                    return PathCardBox(path: _pathsController.pathsObx.value[index]);
                  },
                ),
              )
            ],
          )
        ),
      )

Is there a way to remove those white spaces or do I need to use ShowModalBottomSheet?

ClipRRect didn't solve the problem, clipBehavior:hardEdge also doesn't work cause there is no ShowModalBottomSheet in my code.

image


Solution

  • That part is scaffold background, You can extendBody: true on scaffold

    return Scaffold(
      backgroundColor: Colors.cyanAccent,
      body: Container(
        color: Colors.red,
      ),
      extendBody: true,
      bottomNavigationBar: SolidBottomSheet(
        draggableBody: false,
        headerBar: Container(
          clipBehavior: Clip.hardEdge,
          decoration: BoxDecoration(
            color: Colors.grey.shade200,
            borderRadius: BorderRadius.only(
    

    enter image description here