How to develop a Lottery App in Flutter with Game History

Hello everyone!

Today I am here to teach you to develop a lottery game in flutter with the runtime game history in the application. It is a simple but an interesting and full of fun game at the beginner level. It will include the UI components as well as the dart logic to run the game scenario. It will be a great opportunity for those who are beginner and want to do some practice in Flutter.

This application will generate random numbers within the limit of 1 to 10 and from these numbers 5 is the lucky number so if 5 appears the you win otherwise you lose. It will surely help you to understand basic UI components, user interaction, generation of the random numbers, and storing the history of the game using a list in the table.

Main Features

The game have the following main features.

• 🎲 Random number generation between 0–9 using dart:math
• 🧠 Winning logic to check if the player hits the winning number
• 📈 Game statistics: Wins and total attempts
• 📜 Game History Table that displays every round’s result
• 🔄 Reset button to clear scores and history
• 🎨 Colorful, clean UI with Material Design components

---

Tech Stack

Here is the the simple tech stack for the development of this lottery game application.

• Flutter for UI
• Dart as the programming language
• StatefulWidget to manage the state of the game
• Table widget to display game history

---

Development

First of all each application or website requires the development of the User Interface. So I will show you to develop the user interface and then we will implement the logic of the game to make it functional.

First of all I have created a project in flutter framework and I am using Android Studio.

• AppBar

Here I have created the app bar of the application. I have used Google fonts by exporting the .ttf file of Pacifico family. I added the fonts in the pubspec.yaml file so that it can be used in the application. I have used teal background colour and white colour for the text to make it look prominent and beautiful.

App Bar

• Body

In the body for the vertical development of the screen I have used Column widget as the parent widget. I wrapped the Column widget in a SingleChildScrollView widget to avoid bottom overflow problem on the screen. Due to this now the screen is scrollable.

• Image

To add some richness in the user interface I have used an AssetImage at the start of the body by wrapping it with the ClipRRect widget. Due to the ClipRRect widget I gave it rounded border radius. I only gave radius to topLeft and bottomRight to make it look unique instead of typical radius from all corners.

Image View

• Container to display the current state

Then I used a Text widget to display the lucky number or the winning number on the screen. After that I developed a container widget to display the current situation of the game to the user. As there are two conditions:

• Winning condition

• Loss condition

So in the container widget I used ternary operators to display the relevant column of information. If the random number is equal to winning number then the container will show congratulations quote and icon similarly if random number is not equal to winning number then it shows the other column of information.

• Game Statistics

Here I have used a Row widget to display the statistics of the game. I am showing total number of wins and total number of attempts to play the game.

• Buttons

Then I have used another Row widget and inside that row I have used two ElevatedButton to manage the functionality and play the game. One button is to play the game and the other is to clear the game data including game history as well as game statistics.

Game Statistics and Buttons view

• Game History Container

Then I have created another container to hold the history of the game. Inside the container I used Table widget to display the data in an aligned way. I used three columns to display the game history data as the number of attempt, current random number and result of that game.

To display the data dynamically in the table I am mapping the game data after getting from the gameHistory list which I have already created but I will show that in the logic section.

View of the game history section

---

Logic of the Game

The core logic of the game depends upon the generation of the random numbers. For this there is a built in math library in dart so I have imported that in the project and used it to generate random numbers. Here I have defined the variables and the random number generation function. At the end I have created a list of String to store the game history data in the string form and it is being used in the tale rows to display the data.

Here I have defined the generateNumber function which includes all the logic to generate the random number as well as game statistics and game history.

• Each random number generated is stored in the variable x.
• Each time the random is generated the attempt variable is incremented by 1.
• Then it checks if x == winningNumber then it returns Win otherwise Loss and this is stored in the variable result to use to display the result in the history of the game table.
• If x == winningNumber then it increments wins variable by 1.
• After checking all the conditions and getting the random number the data is stored in the string variables to use it to display the history of the game.

This is reset function to reset all the data in the game. Once it is called it resets wins, attempts, random number and also clears the game history data.

How It Works

Each time the player taps the “PLAY” button:

1. A random number between 0 and 9 is generated.
2. The app compares it with the winning number (5).
3. If it matches, the player wins; otherwise, it's a loss.
4. The result is added to the game history list.

The game displays:

• A message with the random number.
• Current total wins and total attempts.
• A scrollable table showing past results.

There's also a “CLEAR” button that resets everything — great for replaying fresh rounds.

---

This is how we can simply develop a flutter based lottery game for mobile and web interface. It is ready to use in the mobile as well as in the desktop.