flutter_datetime_picker 1.5.1 modified

刘彦博 7fe355254b Merge pull request #65 from martin-danhier/patch-1 6 år sedan
example 269c752ab5 fix format 6 år sedan
lib 5e5f2d5584 Return a Future instead of a void 6 år sedan
test 4509c80e57 fix bug 7 år sedan
.gitattributes 01b97d2f29 Initial commit 7 år sedan
.gitignore f20c6ea596 gitignore 7 år sedan
CHANGELOG.md 55d1f6c1b1 add language 6 år sedan
LICENSE 01b97d2f29 Initial commit 7 år sedan
README.md 0b8f5e0c01 change seq of language 6 år sedan
main_page.png 4c099b37c6 add customize example 6 år sedan
pubspec.yaml 55d1f6c1b1 add language 6 år sedan
screen_date.png b9a83de866 fix 7 år sedan
screen_datetime_chinese.png b9a83de866 fix 7 år sedan
screen_datetime_dutch.png 290ed5aca3 add Russian 6 år sedan
screen_datetime_english.png b9a83de866 fix 7 år sedan
screen_datetime_russian.png 290ed5aca3 add Russian 6 år sedan
screen_time.png b9a83de866 fix 7 år sedan

README.md

Flutter Datetime Picker

(Pub) flutter_datetime_picker

A flutter date time picker inspired by flutter-cupertino-date-picker

you can choose date / time / date&time in multiple languages:

  • Arabic(ar)
  • Armenian(hy)
  • Bengali(bn)
  • Bulgarian(bg)
  • Chinese(zh)
  • Danish(da)
  • Dutch(nl)
  • English(en)
  • French(fr)
  • German(de)
  • Indonesian(id)
  • Italian(it)
  • Japanese(jp)
  • Korean(ko)
  • Persian(fa)
  • Polish (pl)
  • Portuguese(pt)
  • Russian(ru)
  • Spanish(es)
  • Turkish(tr)
  • Vietnamese(vi)

and you can also custom your own picker content

Date picker Time picker Date Time picker

International:

Date Time picker (Chinese) Date Time picker (America) Date Time picker (Dutch) Date Time picker (Russian)

Demo App

main page

Usage

FlatButton(
    onPressed: () {
        DatePicker.showDatePicker(context,
                              showTitleActions: true,
                              minTime: DateTime(2018, 3, 5),
                              maxTime: DateTime(2019, 6, 7), onChanged: (date) {
                            print('change $date');
                          }, onConfirm: (date) {
                            print('confirm $date');
                          }, currentTime: DateTime.now(), locale: LocaleType.zh);
    },
    child: Text(
        'show date time picker (Chinese)',
        style: TextStyle(color: Colors.blue),
    ));

Customize

If you want to customize your own style of date time picker, there is a class called CommonPickerModel, every type of date time picker is extended from this class, you can refer to other picker model (eg. DatePickerModel), and write your custom one, then pass this model to showPicker method, so that your own date time picker will appear, it’s easy, and will perfectly meet your demand

How to customize your own picker model:

class CustomPicker extends CommonPickerModel {
  String digits(int value, int length) {
    return '$value'.padLeft(length, "0");
  }

  CustomPicker({DateTime currentTime, LocaleType locale}) : super(locale: locale) {
    this.currentTime = currentTime ?? DateTime.now();
    this.setLeftIndex(this.currentTime.hour);
    this.setMiddleIndex(this.currentTime.minute);
    this.setRightIndex(this.currentTime.second);
  }

  @override
  String leftStringAtIndex(int index) {
    if (index >= 0 && index < 24) {
      return this.digits(index, 2);
    } else {
      return null;
    }
  }

  @override
  String middleStringAtIndex(int index) {
    if (index >= 0 && index < 60) {
      return this.digits(index, 2);
    } else {
      return null;
    }
  }

  @override
  String rightStringAtIndex(int index) {
    if (index >= 0 && index < 60) {
      return this.digits(index, 2);
    } else {
      return null;
    }
  }

  @override
  String leftDivider() {
    return "|";
  }

  @override
  String rightDivider() {
    return "|";
  }

  @override
  List<int> layoutProportions() {
    return [1, 2, 1];
  }

  @override
  DateTime finalTime() {
    return currentTime.isUtc
        ? DateTime.utc(currentTime.year, currentTime.month, currentTime.day,
            this.currentLeftIndex(), this.currentMiddleIndex(), this.currentRightIndex())
        : DateTime(currentTime.year, currentTime.month, currentTime.day, this.currentLeftIndex(),
            this.currentMiddleIndex(), this.currentRightIndex());
  }
}

Getting Started

For help getting started with Flutter, view our online documentation.

For help on editing package code, view the documentation.