flutterflutter-layoutflutter-cupertinocupertinopicker

CupertinoPicker textStyle flutter


I'm new to flutter and I need help.

I'm creating an app where the user can select data through a CupertinoPicker.

The picker works fine, but I would like to change its style.

Currently the style is like that, but I want it to be like that.

Unfortunately I can't understand how to do it, I read this but I can't do it, I would like to change the color and size of the selected element, the color of the elements not selected and the color of the lines.

But I do not know how I can do it.

Can anyone help me understand please?

The code is this :

Container(

          ˙child: _showCupertinoPicker(
           context,
           book[currentPage].orari.map((orario) {
           return Center(
                     child: Text(orario,
                     style: TextStyle(color: CupertinoColors.activeBlue

                         )));
           }).toList())),
.
.
.
.

_showCupertinoPicker(BuildContext context, List<Widget> orariWidget) {
  return CupertinoPicker(
    backgroundColor: Colors.white,
    onSelectedItemChanged: (value) {},
    itemExtent: 40.0,
    children: orariWidget,
  );
}

Solution

  • Its possible to style CupertinoPicker and CupertinoDatePicker using theme like this:

    return MaterialApp(
      theme: ThemeData(
        cupertinoOverrideTheme: CupertinoThemeData(
          textTheme: CupertinoTextThemeData(
            dateTimePickerTextStyle: TextStyle(color: Colors.blue, fontSize: 16),
            pickerTextStyle: TextStyle(color: Colors.blue, fontSize: 12),
          )
        )
      )
    )