otp_timer_button
This is a Flutter package for easy implementation otp timer button.
Installation
Add the following to your pubspec.yaml file:
dependencies:
otp_timer_button: ^1.1.1
Usage
Import
import 'package:otp_timer_button/otp_timer_button.dart';
Simple Example
OtpTimerButtonController controller = OtpTimerButtonController();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: OtpTimerButton(
controller: controller,
onPressed: () {},
text: Text('Resend OTP'),
duration: 60,
),
),
);
}
Controller
If you want to wait for the response to the OTP request, you can use the controller:
NOTE: if use controller, auto start timer is disabled on pressed button.
OtpTimerButtonController controller = OtpTimerButtonController();
_requestOtp() {
controller.loading();
Future.delayed(Duration(seconds: 2), () {
controller.startTimer();
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: OtpTimerButton(
controller: controller,
onPressed: () => _requestOtp(),
text: Text('Resend OTP'),
duration: 2,
),
),
);
}
controller.startTimer();
controller.loading();
controller.enableButton();
All options
OtpTimerButton(
controller: controller,
height: 60,
text: Text(
'Resend OTP',
),
duration: 60,
radius: 30,
backgroundColor: Colors.blue,
textColor: Colors.white,
buttonType: ButtonType.text_button, // or ButtonType.outlined_button
loadingIndicator: CircularProgressIndicator(
strokeWidth: 2,
color: Colors.red,
),
loadingIndicatorColor: Colors.red,
onPressed: () {},
),