CupertinoPicker example

main.dart

/// https://dartpad.dev/179b4b1c46d0eace0e5765aab6ca6410
/// Answer to the Stack Overflow question: https://stackoverflow.com/questions/71504718/animated-moveable-list-in-flutter
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        scaffoldBackgroundColor: darkBlue,
      ),
      debugShowCheckedModeBanner: false,
      home: const Scaffold(
        body: Center(
          child: PickerPage(),
        ),
      ),
    );
  }
}

class PickerPage extends StatefulWidget {
  const PickerPage();

  @override
  _PickerPageState createState() => _PickerPageState();
}

class _PickerPageState extends State<PickerPage> {
  final _items = [
    'Flat Rate',
    'Hourly',
    'Request for Price',
  ];
  int _selectedItem = 0;

  void _onSelectedItemChanged(int value) => setState(
        () => _selectedItem = value,
      );

  void _showPicker() {
    showCupertinoModalPopup(
      context: context,
      builder: (_) => PickerExample(
        items: _items,
        selectedItem: _selectedItem,
        onSelectedItemChanged: _onSelectedItemChanged,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Text(_items[_selectedItem]),
        const SizedBox(height: 10.0),
        ElevatedButton(
          child: const Text('Show picker'),
          onPressed: _showPicker,
        ),
      ],
    );
  }
}

class PickerExample extends StatefulWidget {
  final List<String> items;
  final int selectedItem;
  final ValueSetter<int> onSelectedItemChanged;

  const PickerExample({
    required this.items,
    required this.selectedItem,
    required this.onSelectedItemChanged,
  });

  @override
  _PickerExampleState createState() => _PickerExampleState();
}

class _PickerExampleState extends State<PickerExample> {
  late final FixedExtentScrollController _controller;

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

    _controller = FixedExtentScrollController(initialItem: widget.selectedItem);
  }

  @override
  void dispose() {
    _controller.dispose();

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 300,
      child: CupertinoPicker(
        scrollController: _controller,
        backgroundColor: Colors.white,
        itemExtent: 30.0,
        children: [
          for (final item in widget.items) Center(child: Text(item)),
        ],
        onSelectedItemChanged: widget.onSelectedItemChanged,
      ),
    );
  }
}