Flutter Datetime Picker的自定义Picker

Question

我正在尝试使用自定义的datepicker来创建CustomPicker类，就像自述文件中的一样。问题是onChanged的回调和onConfirm没有返回更新日期。但是，当我将DatePicker.showPicker更改为DatePicker.showDatePicker时，回调将返回正确的日期。我使用了下面的代码。我花了几个小时来调查这件事，但没有任何进展。

class CustomPicker extends CommonPickerModel {
  CustomPicker({DateTime currentTime, LocaleType locale})
      : super(locale: locale) {
    this.currentTime = currentTime ?? DateTime.now();
  }

  String yearDigits(int value) {
    return '$value';
  }

  String monthDigits(int value) {
    return '$value';
  }

  @override
  String leftStringAtIndex(int index) {
    return index >= DateTime.now().year - 100 &&
            index <= DateTime.now().year - 18
        ? '$index'
        : null;
  }

  @override
  String middleStringAtIndex(int index) {
    return index <= 12 && index >= 1 ? monthDigits(index) : null;
  }

  @override
  String rightStringAtIndex(int index) {
    return null;
  }

  @override
  String leftDivider() {
    return '';
  }

  @override
  String rightDivider() {
    return '';
  }

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

  @override
  DateTime finalTime() {
    return currentTime.isUtc
        ? DateTime.utc(currentTime.year, currentTime.month, 1, 0, 0, 0)
        : DateTime(currentTime.month, currentTime.month, 1, 0, 0, 0);
  }
}

DatePicker.showPicker( 
   // ↑ When I change this to DatePicker.showDatePicker
   // and comment out pickerModel, the value of print(dateTime) gets selected value.
   context,
   showTitleActions: true,
   onConfirm: (dateTime) {
     print(dateTime); // output same value and not updated one
   },
   pickerModel: CustomPicker(
     currentTime: DateTime(_birthYear, _birthMonth, 1),
  ),
  locale: LocaleType.en
);

Answer 1

好吧。因此，我不是Flutter DateTime拾取器包的专家，但我需要在项目中使用它，因此需要为自定义拾取器找出一种方法，下面是我如何解决它的方法。

我意识到问题出在finalTime()方法和它返回的内容上。我检查了包的Github - https://github.com/Realank/flutter_datetime_picker/blob/0b0be9623e905299befc10569f83f3bd11b36125/lib/src/date_model.dart#L494上的实现，并选择了日期和时间的示例模型。它仍然不能工作，直到我确保更新当前的左索引和当前的中间索引。

我不知道我的方法是不是最好的，但这里是我如何解决它的。

以下是我的解决方案：

我更新了setLeftIndex()方法中的_currentLeftIndex变量：

void setLeftIndex(int index) {
    print('left index: '+index.toString());
    _currentLeftIndex = index;
    ....

然后更新了setMiddleIndex()方法中的_currentMiddleIndex变量：

void setMiddleIndex(int index) {
    print('middle index: '+index.toString());
    _currentMiddleIndex = index;
    ....

在下面找到完整的代码实现:注意:记得导入‘date_ full .dart’。

...
import 'package:flutter_datetime_picker/src/date_format.dart';

class CustomPicker extends CommonPickerModel {
  List<String> leftList;
  List<String> middleList;
  List<String> rightList;
  DateTime currentTime;
  int _currentLeftIndex;
  int _currentMiddleIndex;
  int _currentRightIndex;

  LocaleType locale;

  DateTime maxTime;
  DateTime minTime;

  CustomPicker({DateTime currentTime, DateTime maxTime, DateTime minTime, LocaleType locale})
      : super(locale: locale) {

    this.currentTime = currentTime ?? DateTime.now();

    _currentLeftIndex = 0;
    _currentMiddleIndex = this.currentTime.hour;
    _currentRightIndex = this.currentTime.minute;

    this.setLeftIndex(0);
    this.setMiddleIndex(this.currentTime.hour);
    this.setRightIndex(this.currentTime.minute);
    
    if (currentTime != null) {
      this.currentTime = currentTime ?? DateTime.now();
      if (maxTime != null &&
          (currentTime.isBefore(maxTime) || currentTime.isAtSameMomentAs(maxTime))) {
        this.maxTime = maxTime;
      }
      if (minTime != null &&
          (currentTime.isAfter(minTime) || currentTime.isAtSameMomentAs(minTime))) {
        this.minTime = minTime;
      }
    } else {
      this.maxTime = maxTime;
      this.minTime = minTime;
      var now = DateTime.now();
      if (this.minTime != null && this.minTime.isAfter(now)) {
        this.currentTime = this.minTime;
      } else if (this.maxTime != null && this.maxTime.isBefore(now)) {
        this.currentTime = this.maxTime;
      } else {
        this.currentTime = now;
      }
    }

    if (this.minTime != null && this.maxTime != null && this.maxTime.isBefore(this.minTime)) {
      // invalid
      this.minTime = null;
      this.maxTime = null;
    }

    

    if (this.minTime != null && isAtSameDay(this.minTime, this.currentTime)) {
      _currentMiddleIndex = this.currentTime.hour - this.minTime.hour;
      if (_currentMiddleIndex == 0) {
        _currentRightIndex = this.currentTime.minute - this.minTime.minute;
      }
    }
  }

  bool isAtSameDay(DateTime day1, DateTime day2) {
    return day1 != null &&
        day2 != null &&
        day1.difference(day2).inDays == 0 &&
        day1.day == day2.day;
  }

  @override
  void setLeftIndex(int index) {
    print('left index: '+index.toString());
    _currentLeftIndex = index;
    // TODO: implement setLeftIndex
    super.setLeftIndex(index);

    DateTime time = currentTime.add(Duration(days: index));
    if (isAtSameDay(minTime, time)) {
      var index = min(24 - minTime.hour - 1, _currentMiddleIndex);
      this.setMiddleIndex(index);
    } else if (isAtSameDay(maxTime, time)) {
      var index = min(maxTime.hour, _currentMiddleIndex);
      this.setMiddleIndex(index);
    }
  }

  @override
  void setMiddleIndex(int index) {
    print('middle index: '+index.toString());
    _currentMiddleIndex = index;
    // TODO: implement setMiddleIndex
    super.setMiddleIndex(index);
    DateTime time = currentTime.add(Duration(days: _currentLeftIndex));
    if (isAtSameDay(minTime, time) && index == 0) {
      var maxIndex = 60 - minTime.minute - 1;
      if (_currentRightIndex > maxIndex) {
        _currentRightIndex = maxIndex;
      }
    } else if (isAtSameDay(maxTime, time) && _currentMiddleIndex == maxTime.hour) {
      var maxIndex = maxTime.minute;
      if (_currentRightIndex > maxIndex) {
        _currentRightIndex = maxIndex;
      }
    }
  }

  @override
  String leftStringAtIndex(int index) {
    print('left string index: '+index.toString());
    DateTime time = currentTime.add(Duration(days: index));
    if (minTime != null && time.isBefore(minTime) && !isAtSameDay(minTime, time)) {
      return null;
    } else if (maxTime != null && time.isAfter(maxTime) && !isAtSameDay(maxTime, time)) {
      return null;
    }
    return formatDate(time, [ymdw], locale);
  }

  @override
  String middleStringAtIndex(int index) {
    print('middle string index: '+index.toString());
    if (index >= 0 && index < 24) {
      DateTime time = currentTime.add(Duration(days: _currentLeftIndex));
      if (isAtSameDay(minTime, time)) {
        if (index >= 0 && index < 24 - minTime.hour) {
          return digits(minTime.hour + index, 2);
        } else {
          return null;
        }
      } else if (isAtSameDay(maxTime, time)) {
        if (index >= 0 && index <= maxTime.hour) {
          return digits(index, 2);
        } else {
          return null;
        }
      }
      return digits(index, 2);
    }

    return null;
  }

  @override
  String rightStringAtIndex(int index) {
    print('right string index: '+index.toString());
    if (index >= 0 && index < 60) {
      DateTime time = currentTime.add(Duration(days: _currentLeftIndex));
      if (isAtSameDay(minTime, time) && _currentMiddleIndex == 0) {
        if (index >= 0 && index < 60 - minTime.minute) {
          return digits(minTime.minute + index, 2);
        } else {
          return null;
        }
      } else if (isAtSameDay(maxTime, time) && _currentMiddleIndex >= maxTime.hour) {
        if (index >= 0 && index <= maxTime.minute) {
          return digits(index, 2);
        } else {
          return null;
        }
      }
      return digits(index, 2);
    }

    return null;
  }

  @override
  DateTime finalTime() {
    print('all index: ');
    print('left index: '+_currentLeftIndex.toString());
    print('middle index: '+_currentMiddleIndex.toString());
    print('right index: '+_currentRightIndex.toString());
    DateTime time = currentTime.add(Duration(days: _currentLeftIndex));
    var hour = _currentMiddleIndex;
    var minute = _currentRightIndex;
    if (isAtSameDay(minTime, time)) {
      hour += minTime.hour;
      if (minTime.hour == hour) {
        minute += minTime.minute;
      }
    }

    return currentTime.isUtc
        ? DateTime.utc(time.year, time.month, time.day, hour, minute)
        : DateTime(time.year, time.month, time.day, hour, minute);
  }

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

  @override
  String rightDivider() {
    return ':';
  }

}