How To Create Number Picker as a alert dialog in flutter?

Question

I am developing e com application, when user click on quantity label want to show dialog box for select how many quantity he want to buy.

I tried to wrap number picker inside Alert dialog. It show alert dialog, but the problem is not updating value when scroll

I can I use Number Picker for that?

Answer 1

Use a drop button combo widget. The DropdownButtonFormField holds a collection of YourClassView type objects held in the list listStatusMenuItems. The _currentStatusComboView variable holds the selected value. It is assigned on the onChange event. I use a restful call to load the listStatusMenuItems.

 List<DropdownMenuItem> listStatusMenuItems = <DropdownMenuItem>[];

 StatusComboView _currentStatusComboView;

 _loadStatusCombo() {
      Provider.of<Api>(context, listen: false)
        .getYourClassViews()
       .then((listView) {
     setState(() {
        listStatusMenuItems =
            listView?.map<DropdownMenuItem<YourClassView>>((item) {
      return DropdownMenuItem<StatusComboView>(
          value: item, child: Text(item.displayValue));
    }).toList();
  });
});

 @override
 void initState() {
    super.initState();
    _loadStatusCombo();
 }

  DropdownButtonFormField<YourClassView>(
                              decoration: InputDecoration(
                                  border: OutlineInputBorder(
                                    borderRadius: const BorderRadius.all(
                                      const Radius.circular(5.0),
                                    ),
                                  ),
                                  filled: true,
                                  hintStyle:
                                      TextStyle(color: Colors.grey[800]),
                                  hintText: "Select a Value",
                                  fillColor: Colors.orange),
                              items: listStatusMenuItems,
                              isDense: true,
                              isExpanded: true,
                              value: this._currentStatusComboView,
                              validator: (value) =>
                                  value == null ? 'field required' : null,
                              onChanged: (StatusComboView value) {
                                setState(() {
                                  this._currentStatusComboView = value;
                                });
                              }),