CupertinoPicker textStyle flutter

Issue

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),
      )
    )
  )
)

Answered By – kashlo

Answer Checked By – David Marino (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *