Flutter ListWheelScrollView , How to add horizontal lines

490

You can use a CupertinoPicker widget, which looks like this:

CupertinoPicker demo image

Or if you want to make a widget for selecting date and time, you can also use CupertinoDatePicker widget, which looks like this:

CupertinoDatePicker demo image

For more Cupertino (iOS-style) widgets, check out this page: https://flutter.dev/docs/development/ui/widgets/cupertino

Share:
490
Admin
Author by

Admin

Updated on December 25, 2022

Comments

  • Admin
    Admin over 1 year

    This is flutter_datetime_picker's UI. How to add horizontal lines like this:

    enter image description here

    This is my code and UI.

    ListWheelScrollView(
      itemExtent: 20,
      diameterRatio: 0.9,
      perspective: 0.003,
      controller: dayScrollController,
      physics: FixedExtentScrollPhysics(
        parent: BouncingScrollPhysics(),
      ),
      children: dayList.map((item) {
        return Container(
          height: 20,
          alignment: Alignment.center,
          child: Container(
            child: Text(
              '$item',
              style: TextStyle(
                color: dayList.indexOf(item) != dayIndex ? Colors.grey : Colors.black,
                fontSize: 20
              ),
            ),
          )
        );
      }).toList(),
      onSelectedItemChanged: (index) {
        setState(() {
          dayIndex = index;
        });
      },
    ),
    

    enter image description here