solobrogrammer
solobrogrammer

Reputation: 57

Cupertino Picker content is squished together (see image below)

I created a Cupertinopicker widget that contains the 7 days of the week, but when you open the picker, they appear very squished together. Not sure why this is as another Cupertinopicker I created works fine.

I've copied exactly the code for the other Cupertinopicker I implemented (obviously changing the necessary components of the code), but it doesn't work in my second implementation.

Widget _buildWeeklyItemPicker() {
return Container(
  height: 250,
  child: CupertinoPicker(
    itemExtent: 7.0,
    backgroundColor: CupertinoColors.white,
    onSelectedItemChanged: (index1) {
      setState(() {
        selectedWItemString2 = daysOfTheWeek[index1];
      });
    },
    children: List<Widget>.generate(
      daysOfTheWeek.length,
      (index1) {
        return Center(
          child: Text(daysOfTheWeek[index1]),
        );
      },
    ),
  ),
);

}

^^ that's building the CupertinoPicker

List<String> daysOfTheWeek = [
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday'
'Sunday'

];

^^ that's my list of items that should appear in the picker

InkWell(
      child: Text(
          selectedWItemString2 == null ? "_______" : selectedWItemString2),
      onTap: () async {
        await showModalBottomSheet<int>(
          context: context,
          builder: (BuildContext context) {
            return _buildWeeklyItemPicker();
          },
        );
      },
    ),

^^ tapping the InkWell above open up the CupertinoPicker

I have attached a picture of what it should look like and what it does look like.

enter image description here

enter image description here

Upvotes: 0

Views: 591

Answers (1)

VipiN Negi
VipiN Negi

Reputation: 3108

It is because you've set itemExtent: 7.0. Increase the value according to your requirement.

Upvotes: 2

Related Questions