flutternumberpicker

Flutter number picker doesn't update on bottom sheet


I want to use Flutter number picker inside of bottom sheet dialog. But the number picker doesn't update when I change the value by swiping.

My code is below:

GestureDetector(
                      onTap: (){
                        showModalBottomSheet<int>(
                            context: context,
                            builder: (BuildContext context){
                              return new Container(
                                height: 350.0,
                                color: HexColor('FF737373'),
                                child: new Container(
                                    decoration: new BoxDecoration(
                                        color: Colors.white,
                                        borderRadius: new BorderRadius.only(
                                            topLeft: const Radius.circular(20.0),
                                            topRight: const Radius.circular(20.0))),
                                    child: new Center(
                                      child: Column(
                                        mainAxisAlignment: MainAxisAlignment.center,
                                        children: <Widget>[
                                          NumberPicker.integer(
                                              initialValue: _currentValue,
                                              minValue: 0,
                                              maxValue: 1000,
                                          ),
                                        ],
                                      ),
                                    )),
                              );
                            }
                        ).then((int value) {
                          if (value != null) {
                            setState(() => _currentValue = value);
                          }
                        });
                      },

                      child: Container(
                        //container
                      ),
                    ),

Solution

  • I don't understand what's your goal but I hope this helps :

    showModalBottomSheet<int>(
      context: context,
      builder: (BuildContext context){
        return StatefulBuilder(
          builder: (BuildContext context, StateSetter setModalState) {
            return Container(
              height: 350.0,
              child: Container(
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(
                    topLeft: const Radius.circular(20.0),
                    topRight: const Radius.circular(20.0)
                  )
                ),
                child: Center(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      NumberPicker.integer(
                        initialValue: _currentValue,
                        minValue: 0,
                        maxValue: 1000,
                        onChanged: (value) {
                          setModalState(() {
                            _currentValue = value;
                          });
                        } 
                      ),
                    ],
                  ),
                )
              ),
            );
          }
        );
      }
    ).then((int value) {
      if(value != null) {
        setState(() => _currentValue = value);
      }
    });