Chris1234567899 / flutter_time_range_picker

A time range picker for Flutter
MIT License
33 stars 53 forks source link

ok and cancel text #24

Closed mbfakourii closed 3 years ago

mbfakourii commented 3 years ago

hi how cheng ok and cancel text ?

Chris1234567899 commented 3 years ago

The dialog uses the default MaterialLocalizations with cancelButtonLabel and okButtonLabel. There is no easy way to change these.

You could build your own dialog however and use the TimeRangePicker() widget as a normal widget within it. Something like this:

ElevatedButton(
          onPressed: () async {
            TimeRange? result = await showDialog(
              context: context,
              builder: (BuildContext context) {
                TimeOfDay _startTime = TimeOfDay.now();
                TimeOfDay _endTime = TimeOfDay.now();
                return AlertDialog(
                  contentPadding: EdgeInsets.zero,
                  title: Text("Choose a nice timeframe"),
                  content: Container(
                    width: MediaQuery.of(context).size.width,
                    height: 450,
                    child: TimeRangePicker(
                      hideButtons: true,
                      onStartChange: (start) {
                        setState(() {
                          _startTime = start;
                        });
                      },
                      onEndChange: (end) {
                        setState(() {
                          _endTime = end;
                        });
                      },
                    ),
                  ),
                  actions: <Widget>[
                    TextButton(
                        child: Text('My custom cancel'),
                        onPressed: () {
                          Navigator.of(context).pop();
                        }),
                    TextButton(
                      child: Text('My custom ok'),
                      onPressed: () {
                        Navigator.of(context).pop(TimeRange(
                            startTime: _startTime, endTime: _endTime));
                      },
                    ),
                  ],
                );
              },
            );

            print(result.toString());
          },
          child: Text("Custom Dialog"),
        )

(you'll have to fiddle around with paddings, dimensions, orientation etc. yourself then, but you get the idea)