flutterdialognumberpickerproduct-quantityflutter-alertdialog

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


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

enter image description here

I can I use Number Picker for that?


Solution

  • 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;
                                    });
                                  }),