Make a roll the dice application with List

In this article, we’ll learn how to build a dice rolling application with MIT App Inventor. Have you ever been looking for dice but couldn’t find one? Dice rolling is a useful app that may be used to play any kind of board game in daily life. MIT App Inventor is a great platform for kids since it is considered one of the best block-based programming for beginners.

From : www.unsplash.com

Design the Front end of the App

To start with, we will first design the front end of the app as shown below.

To do this, open up MIT App Inventor and create a new project named “DiceRoll”. We will need 6 images for six dice numbers. A sound file will be played when the dice is rolled. Upload all the 6 images and sound files (Tada.mp3) to the project from the ‘Media’ section.

Change the screen Title property to the name of the app “Roll the Dice”. Add an Image, Button, and Label component. Add a non-visible component Player from the Media category. Change the property of the component as shown in the table below.

Component          Property
ImageHeight:200 pixel Width:200 pixel Picture:d1.png
Button Rename it to ‘DiceRoll’BackgroundColor: any color of your choice Text: Roll the dice
LabelBackgroundColor: any color of your choice FontSie:18 Text: Click on the button to Roll the dice
ScreenBackgroundColor: any color of your choice AlignHorizontal:  Center AlignVertical:  Center
PlayerSource: Tada.mp3

The logic of the app

Now, we move to the blocks and add the logic of the app. We will be using the concept of List in this app. To know more about List, click on this link List Doc. Create a variable of type List which will store all the 6 dice images as a list item as shown below.

Please note that the dice image file names added in the List should be exactly same as the file uploaded in the project.

Blocks for the DiceRoll Button click event

Add the Click event for the DiceRoll button and add the logic to display a random dice image by getting a random item from the List.

Display the dice image on the Image component

Play the sound using the Sound component

Testing the app

The app is finished, and the AI companion can be used to test it. When the button is clicked, a random dice image and a sound will appear.

Things to try

  • Roll the dice when the phone is shaken(Hint: use Accelerometer sensor)
  • Create a double dice app

This dice rolling app can be a very useful tool in the game development courses for kids where they can create the game around this app. We can create a multi-player dice game or a game where the movement of the character is determined by the dice for e.g race game. The possibilities are endless, we just need to explore and start working.

Vineeta Chaudhary