How to resize text initialDate in showDatePicker

Question

I would like to resize text size of initialDate. I find it's too big on cellphone sized devices.

Future<Null> _selectDate(BuildContext context) async {
    var formatter = new DateFormat("yyyy-MM-dd");
    final DateTime picked = await showDatePicker(
        context: context,
        initialDate: selectedDate,
        firstDate: DateTime(1901, 1),
        lastDate: DateTime(2101),
        builder: (context, child) {
          return Column(
            children: <Widget>[
              Container(
                height: MediaQuery.of(context).size.height / 1.2,
                width: MediaQuery.of(context).size.width / 1.5,
                child: child,
              ),
            ],
          );
        });
    if (picked != null)
      setState(() {
        selectedDate = picked;
        dateController.value = TextEditingValue(text: formatter.format(picked));
      });
  }

I borrowed this example code from https://stackoverflow.com/a/60037183/9554434.

Image of issue:

child:

Child would be the widget that displays the calendar where you choose the date. — Michael T, Mar 27 '20 at 12:04

score 1 · Answer 1 · answered Mar 27 '20 at 12:16

1

Try to wrap child with ThemeData and TextTheme property and change font-size using TextStyle like this

ThemeData(
    textTheme: TextTheme(
        body1: TextStyle(fontSize: 10.0), // <-- here you can do your font smaller
        body2: TextStyle(fontSize: 8.0)
    )
)

answered Mar 27 '20 at 12:16

Kirill Matrosov

5,564
4
28
39

Thanks, but the issue isn't the child. It's the initialDate. – Michael T Mar 27 '20 at 12:25
Edited question with my actual code and images. Apologies for the unclarity. – Michael T Mar 27 '20 at 12:31

score 1 · Accepted Answer · answered Mar 27 '20 at 15:32

So the solution (for me) was that I was looking at the DatePicker and not the TextFormField in which the text was being held. It was a simple matter of:

TextFormField(
    style: TextStyle(
    fontSize: textSize,
),

This does not answer the question of how to resize initialDate, but it does solve the issue of the text being too big for the TextFormField.

How to resize text initialDate in showDatePicker

2 Answers2