0

My question is similar to Show datepicker on textfield tap but I need to do this in Flutter.

I have a TextField showing a date an I want to pop up a date dialog when user taps on it.

Is there another widget I should use instead of a TextField for this?

Anton Duzenko
  • 2,366
  • 1
  • 21
  • 26

3 Answers3

0

Try something like this

           TextField(
             onTap: () => print('tapped'),
                decoration: InputDecoration(
                    border: InputBorder.none,
                    hintText: 'Enter a search term'),

            );
F-1
  • 2,887
  • 20
  • 28
  • sorry updated code, just add onTap to textField just replace the print statement with your alert dialog call – F-1 Jun 26 '19 at 14:42
0

Short answer: as far as I know there's no widget specifically for this purpose.

Long answer: It depends on what you want to do after choosing the date. Another simple solution is to use a FlatButton for this. It does not have the unnecessary styling of a TextField that you seem not to want and at the same time gives the user some feedback of the tap.

FlatButton(
  onPressed: () {
    // call your dialog
  },
  child: Text(
    "Select date",
  ),
)
Loolooii
  • 8,588
  • 14
  • 66
  • 90
0

You can try this package here, it does exactly want you want to achieve.

import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:datetime_picker_formfield/datetime_picker_formfield.dart';

// ...

class BasicDateField extends StatelessWidget {
  final format = DateFormat("yyyy-MM-dd");
  @override
  Widget build(BuildContext context) {
    return Column(children: <Widget>[
      DateTimeField(
        format: format,
        decoration: InputDecoration(
                                    border: OutlineInputBorder(),
                                    labelText: "Tanggal Lahir"),
        onShowPicker: (context, currentValue) {
          return showDatePicker(
              context: context,
              firstDate: DateTime(1900),
              initialDate: currentValue ?? DateTime.now(),
              lastDate: DateTime(2100));
        },
      ),
    ]);
  }
}