otp_timer_button

Description:

otp timer button

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
copied to clipboard
Usage #
Import #
import 'package:otp_timer_button/otp_timer_button.dart';
copied to clipboard
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,
),
),
);
}
copied to clipboard
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,
),
),
);
}
copied to clipboard

controller.startTimer();
controller.loading();
controller.enableButton();
copied to clipboard
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: () {},
),
copied to clipboard