[ad_1]
I’ve a length bar and a countdown timer. the length bar merely shows a linear bar to start a session and the countdown timer converts time handed vs whole time right into a share in order that it may be displayed in a progress bar
my length bar appears like this.
class DurationBar extends HookWidget {
const DurationBar({Key? key}) : tremendous(key: key);
@override
Widget construct(BuildContext context) {
return const Expanded(
flex: 0,
baby: _SessionTimer(),
);
}
}
class _SessionTimer extends HookWidget {
const _SessionTimer({Key? key}) : tremendous(key: key);
@override
Widget construct(BuildContext context) {
var binah = Supplier.of<BinahModel>(context);
var storage = GetStorage();
var processingTime = storage.learn<int>(Keys.binahProcessingTime);
last time = processingTime ?? 120;
last countdown = useCountdownTimer(time, true);
useEffect(
() {
change (binah.sessionState) {
case SessionState.measuring:
countdown.begin();
break;
default:
countdown.cease();
break;
}
return null;
},
[binah.sessionState],
);
useEffect(
() {
countdown.label.worth="0";
return null;
},
[binah.sessionType],
);
useEffect(() => countdown.cease(), []);
var % =
((int.parse(countdown.label.worth) / time) * 100).toStringAsFixed(1);
// return Textual content('Length: ${countdown.label.worth}');
return LinearPercentIndicator(
width: MediaQuery.of(context).measurement.width,
lineHeight: 40.0,
barRadius: const Radius.round(100),
%: int.parse(countdown.label.worth) / time,
backgroundColor: kBaseThemeColor300,
progressColor: Colours.blueAccent,
middle: Middle(
baby: Textual content(
'$% %',
fashion: Theme.of(context).textTheme.headline4!.copyWith(
coloration: kDarkIconColor,
),
),
),
);
}
}
and my countdown timer (with methodology useCountdownTimer) appears like this
class CountdownTimer {
CountdownTimer(this.begin, this.cease, this.label, this.counting);
last Perform begin;
last Perform cease;
ValueNotifier<String> label;
last bool counting;
}
String formatTimer(int timeInSeconds) {
return timeInSeconds.toString();
}
var _isMounted = false;
CountdownTimer useCountdownTimer(int countdownTime, [bool useAsTimer = false]) {
last label = useState('0');
last timer = useState<Timer?>(null);
last counting = useState(false);
var stopTimer = useCallback(
() {
if (timer.worth != null) {
timer.worth!.cancel();
counting.worth = false;
}
},
[],
);
useEffect(
() {
_isMounted = true;
return () {
_isMounted = false;
};
},
[],
);
var startTimer = useCallback(
() {
stopTimer();
label.worth = formatTimer(useAsTimer ? 1 : countdownTime);
var length = const Length(seconds: 1);
var time = useAsTimer ? 1 : countdownTime;
counting.worth = true;
timer.worth = Timer.periodic(length, (Timer t) {
if (!_isMounted) {
return;
}
if (useAsTimer ? time == countdownTime : time == 0) {
t.cancel();
counting.worth = false;
} else {
useAsTimer ? time++ : time--;
label.worth = formatTimer(time);
}
});
},
[countdownTime],
);
return CountdownTimer(startTimer, stopTimer, label, counting.worth);
}
Now the weirdest factor is, this works completely on Android,
timer.worth = Timer.periodic(length, (Timer t) {
if (!_isMounted) {
return;
}
if (useAsTimer ? time == countdownTime : time == 0) {
t.cancel();
counting.worth = false;
} else {
useAsTimer ? time++ : time--;
label.worth = formatTimer(time);
}
});
This will get known as each 1 second.
However the identical code doesn’t work on ios. nothing modifications. until i’m lacking one thing key in direction of ios i’m not certain.
any help or steerage could be drastically appreciated
[ad_2]
