Flutter - Make a Random Number Generator App
Last Updated :
24 Apr, 2025
In Flutter we can create a random object using the Random() method to create a random number. We can use this concept to make an OTP that can be used for various authentication. In this article, we are going to Generate a 4-digit random pin in every click. A sample video is given below to get an idea about what we are going to do in this article.
Step By Step Implementation
Step 1: Create a New Project in Android Studio
To set up Flutter Development on Android Studio please refer to Android Studio Setup for Flutter Development, and then create a new project in Android Studio please refer to Creating a Simple Application in Flutter.
Step 2: Import the Package
First of all import material.dart file.
import 'dart:math';
import 'package:flutter/material.dart';
Step 3: Execute the main Method
Here the execution of our app starts.
Dart
void main() {
runApp(MyApp());
}
Step 4: Create MyApp Class
In this class we are going to implement the MaterialApp , here we are also set the Theme of our App.
Dart
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: RandomNumberGenerator(),
theme: ThemeData(
primarySwatch: Colors.green, // Set the app's primary theme color
),
debugShowCheckedModeBanner: false,
);
}
}
Step 5: Create RandomNumberGenerator Class
In this class we are going to generate the 4 digit random number in every click and display it by the help of a TextView. This class contains a method named as generateRandomNumber() that is responsible for generating a 4 digit random number in every call. Comments are added for better understanding .
// Method ffor generating a random 4 digit number
void generateRandomNumber() {
setState(() {
_randomNumber =
1000 + _random.nextInt(9000); // Generates a random 4-digit number
},);
}
Dart
class RandomNumberGenerator extends StatefulWidget {
@override
_RandomNumberGeneratorState createState() => _RandomNumberGeneratorState();
}
class _RandomNumberGeneratorState extends State<RandomNumberGenerator> {
final Random _random =
Random(); // Create a Random object for generating random numbers
int _randomNumber = 0;
// Method ffor generating a random 4 digit number
void generateRandomNumber() {
setState(() {
_randomNumber =
1000 + _random.nextInt(9000); // Generates a random 4-digit number
},);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Random 4-Digit Number Generator'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'Random 4-Digit Number:', // Display a label for the random number
style: TextStyle(fontSize: 20),
),
Text(
'$_randomNumber', // Display the generated random number
style: TextStyle(fontSize: 48, fontWeight: FontWeight.bold),
),
SizedBox(height: 20),
ElevatedButton(
onPressed:
generateRandomNumber, // Call the function to generate a random number
child: Text(
'Generate Random 4-Digit Number'), // Button to trigger number generation
),
],
),
),
);
}
}