Use cupertino picker instead of keyboard while inputting a textformfield flutter

Question

I am an ios developer who is new to Flutter. In my app, I have TextFormField, whose input type is the options give in the picker. I am struggling to show the picker view as an input view instead of the keyboard. My desired output is as follows

image link

Answer 1

TextEditingController _controller = TextEditingController();

 Future<void> _selectedNumber(BuildContext context) async {
    int number = await showCupertinoModalPopup(
      context: context,
      builder: (context) => Container(
        height: 250,
        child: CupertinoPicker(
          itemExtent: 50,
          onSelectedItemChanged: (int value) {
            _controller.text = (value + 1).toString();
          },
          children: numbers
              .map(
                (number) => Text(number.toString()),
              )
              .toList(),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: GestureDetector(
          onTap: () => _selectedNumber(context),
          child: AbsorbPointer(
            child: TextFormField(
              keyboardType: TextInputType.datetime,
              controller: _controller,
              decoration: InputDecoration(
                hintText: 'Select A Number',
                prefixIcon: Icon(
                  Icons.format_list_numbered,
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

Is this what you are looking for?