Time travel with a little effort

[Amoo-Shahab-1]

This is a bug I faced. how can I fix it?

This is what I have done with no success:

Added onStartChange and onEndChange to handle this problem:

InkWell(
  splashFactory: NoSplash.splashFactory,
  splashColor: Colors.transparent,
  highlightColor: Colors.transparent,
  onTap: () async {
    var partialTime = await showTimeRangePicker(
      context: context,
      start: startTime,
      end: endTime,
      // Added this
      onStartChange: (TimeOfDay start) {
        if (toDouble(startTime) >= toDouble(endTime)) {
          endTime =
              TimeOfDay(hour: start.hour, minute: start.minute + 5);
        } else {
          startTime = start;
        }
        setState(() {});
      },
      // And this
      onEndChange: (TimeOfDay end) {
        if (toDouble(startTime) >= toDouble(endTime)) {
          startTime = TimeOfDay(hour: end.hour, minute: end.minute - 5);
          setState(() {});
        } else {
          endTime = end;
        }
        setState(() {});
      },
      disabledTime: TimeRange(
        startTime: const TimeOfDay(hour: 20, minute: 0),
        endTime: const TimeOfDay(hour: 8, minute: 0),
      ),
      disabledColor: Colors.red.withOpacity(0.5),
      minDuration: const Duration(minutes: 5),
      strokeWidth: 5,
      ticks: 24,
      ticksOffset: -20,
      ticksLength: 15,
      ticksColor: Colors.grey,
      labels: [
        "12 am",
        "3 am",
        "6 am",
        "9 am",
        "12 pm",
        "3 pm",
        "6 pm",
        "9 pm"
      ].asMap().entries.map((e) {
        return ClockLabel.fromIndex(
            idx: e.key, length: 8, text: e.value);
      }).toList(),
      labelOffset: 35,
      rotateLabels: false,
      padding: 60,
      snap: true,
    );
  },
  child: const Icon(
    Icons.add_circle_outline,
    size: 22,
    color: Colors.grey,
  ),
),

[quocviet1996]

Same problem, please fix this, I can't find another library that matches my requirement like this one.

[arjanmels]

I think pull request #47 may address your issue

[quocviet1996]

Hi @arjanmels , thanks for your solution, i tried but unfortunately it doesn't work well, if i try move the point too fast, it still happens

[arjanmels]

@quocviet1996 strange, I can move as fast as I react without hickups. What is your minimum duration? so I can try to reproduce.

Arjan

[quocviet1996]

I'm using default duration,so i think it about 30 minutes, @arjanmels

https://github.com/Chris1234567899/flutter_time_range_picker/assets/48380821/6a03e1e9-3782-4806-96a0-fcba263e7cdb

[arjanmels]

This now seems to occur when you got the forbidden zone. Maybe because it is >=180 degrees, can you try to make it smaller? (Maybe 11h instead of 12 as trial)

[quocviet1996]

Very strange, suddenly i don't see this issue anymore ,i don't change anything and everything just fine, i will check some time and give you feedback later, thanks a lot for your work.