Hi people 👋.

For the second session of the Flutter Festival of IIT Goa, I gave a walkthrough of building a Dice rolling App that can be customized according to the number of dice and faces of each die required.

This App is great for beginners who are learning flutter and want to build a simple but useful small Flutter App. It can be used in many ways for example as a random number generator, coin toss, or as a replacement for the board game dice you lost somewhere.

I have made the App so that It can be run on both your Flutter Editor of choice as well as dartpad.dev.

The App works by taking the number of Faces and Dice as input from the user as input and returning the outcomes of the roll when we tap/click the ROLL button.

This App allows more freedom and creativity for example.

I have also uploaded it to my GitHub: https://github.com/anish-natekar/Flutter-Virtual-Dice-App

main.dart

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'dart:math';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Random Number Generator',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.yellow,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: HomeScreen(),
    );
  }
}


class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  TextEditingController _faceController = TextEditingController();
  TextEditingController _diceController = TextEditingController();
  int _result = 0;
  String _textResult = "...";
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Virtual Dice", style: TextStyle(color: Colors.black, fontWeight: FontWeight.w500, fontSize: 40)),
        backgroundColor: Colors.transparent,
        elevation:  0,
        centerTitle: true,
      ),
      backgroundColor: Colors.grey[800],
      body: SingleChildScrollView(
          child: Column(
              children: [
                SizedBox(height: 20),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    Container(
                      width: 130,
                      child: TextField(
                        controller: _faceController,
                        style: TextStyle(
                          fontSize: 42,
                          fontWeight: FontWeight.w300,
                          color: Colors.yellow,
                        ),
                        textAlign: TextAlign.center,
                        keyboardType: TextInputType.number,
                        decoration: InputDecoration(
                          border: InputBorder.none,
                          hintText: "Faces",
                          hintStyle: TextStyle(
                            fontSize: 42,
                            fontWeight: FontWeight.w300,
                            color: Colors.white.withOpacity(0.8),
                          ),
                        ),
                      ),
                    ),
                    Container(
                      width: 130,
                      child: TextField(
                        controller: _diceController,
                        style: TextStyle(
                          fontSize: 42,
                          fontWeight: FontWeight.w300,
                          color: Colors.yellow,
                        ),
                        textAlign: TextAlign.center,
                        keyboardType: TextInputType.number,
                        decoration: InputDecoration(
                          border: InputBorder.none,
                          hintText: "Dice",
                          hintStyle: TextStyle(
                            fontSize: 42,
                            fontWeight: FontWeight.w300,
                            color: Colors.white.withOpacity(0.8),
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
                SizedBox(height: 30),
                GestureDetector(
                  onTap: () {
                    int _f = int.parse(_faceController.text);
                    int _d = int.parse(_diceController.text);
                    _textResult = "";
                    setState(() {
                      if (_d == 1 && _f < 1000) {
                        if(_f == 2) {
                          if(Random().nextInt(2) == 0)
                            _textResult = "Heads";
                          else
                            _textResult = "Tails";
                        }
                        else
                          _textResult = (1+Random().nextInt(_f)).toString();
                      }
                      else if (_d > 1 && _d <= 20 && _f <= 1000) {
                        for (int i=0; i<_d; i++) {
                          _textResult += (1+Random().nextInt(_f)).toString() + " ";
                        }
                      }
                      else
                        _textResult = "Error";
                    });
                  },
                  child: Container(
                    child: Text("ROLL", style: TextStyle(fontSize: 32, fontWeight: FontWeight.bold, color: Colors.black)),
                  ),
                ),
                SizedBox(height:  30,),
                Visibility(
                  visible: _textResult.isNotEmpty,
                  child: Container(
                      child: Text(_textResult, style: TextStyle(fontSize: 52, fontWeight: FontWeight.w400, color: Colors.yellow), textAlign: TextAlign.center,)
                  ),
                ),
              ]
          )
      ),
    );
  }
}

Thank you for reading my Blog people.

If you have any questions you can mail me at "anish.natekar.20031@iitgoa.ac.in". Connect with me on LinkedIn: www.linkedin.com/in/anish-natekar-2667b61b0. Follow me on Github: https://github.com/anish-natekar

Blog by Anish Yeshwant Natekar (A.K.A anishsan).