how to use showbottomsheet with null safety in flutter?

Question

I'm still learning flutter new this week, seems the course is outdated, so i struggle every time I face null safety errors. Now, I can't use showbottomsheet.. tried null check(!) but onPressed() is always returning null , i can't figure what should i do to prevent that..

Error: The method 'showBottomSheet' can't be unconditionally invoked because the receiver can be 'null'.

and when i use null check: it says "can't use null operand"

here's the piece of code i use:

var scaffoldkey = GlobalKey<ScaffoldState>();


onPressed: () {
        scaffoldkey.currentState.showBottomSheet(
          (context) => Container(
            color: Colors.red,
            padding: EdgeInsets.all(
              20.0,
            ),
          ),
        );
      },

simply use: onPressed: () { showModalBottomSheet( context: context, builder: (BuildContext context) { — Jim, Oct 22 '21 at 08:57

score 1 · Accepted Answer · answered Oct 22 '21 at 08:54

Just put a question mark or interjection before errored code:

var scaffoldkey = GlobalKey<ScaffoldState>();
onPressed: () {
        scaffoldkey.currentState?.showBottomSheet(
          (context) => Container(
            color: Colors.red,
            padding: EdgeInsets.all(
              20.0,
            ),
          ),
        );
      },

The problem: currentState may be null. If you put a question mark, it does nothing when it's null, does not invoke the showBottomSheet method.

If you put an interjection, it forces to invoke the showBottomSheet method even if it's null, and if it is null, it throws an error like before null-aware era.

score 0 · Answer 2 · answered Oct 22 '21 at 08:58

Try below code hope its helpful to you. just click on other and see your result.refer official documentation here for bottomsheet

 ListTile(
    title: Text('Other '),
    trailing: Icon(Icons.arrow_forward_ios),
    onTap: () => bottomSheet(context),
  ),

Your bottomSheet Function :

bottomSheet(BuildContext context) {
    showModalBottomSheet(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(
          top: Radius.circular(30),
        ),
      ),
      context: context,
      builder: (context) {
        return Container(
          height: 100,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            // mainAxisSize: MainAxisSize.min,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: [
                  InkWell(
                    child: Icon(Icons.add),
                  ),
                  InkWell(
                    child: Icon(Icons.person),
                  ),
                  InkWell(
                    child: Icon(Icons.check),
                  ),
                  InkWell(
                    child: Icon(Icons.ac_unit),
                  ),
                ],
              ),
            ],
          ),
        );
      },
    );
  }

Your result screen->

@Nyctophilius welcome if your problem is solved by my answer so accept and upvote my answer — Ravindra S. Patil, Oct 22 '21 at 09:48

how to use showbottomsheet with null safety in flutter?

2 Answers2