Overview
Many board games are impossible to play without dice - they come in all sorts of shapes and sizes and are inevitably one of the first things to go missing. With Rollin, as long as you have your phone, you have your dice. In this app we will use a random number generator to simulate a dice roll and play some sound effects so that you can completely customise your own gaming experience.
Design
Since we want the image to be in the middle of the screen we can use a column almost like a screen within a screen. The image can be centered within the column and the button to roll the die is placed at the bottom of the screen, beneath the column.
Upload Files and Images
Underneath the invisible compoents area there is a section for files. We want to upload 6 images, one for each side of our die to this section. One way to do this is with the upload button. You can select one or more files and add them to your app very quickly.
Another, arguably faster way we can do this is by dragging and dropping all the files at once:
Blocks
Every time the die is rolled we want a new random image to appear. To do this we first need to create a list of all the images that we just uploaded:
Since we’ll be showing a new image every time the die is rolled we can create a function called “roll” for this task. At the moment all this function does is select a random image from our list of images:
Now, every time Button1 is clicked we can roll the die like this:
Don’t forget to roll it when the screen starts too:
Sound Effects
We can make our apps more engaging by adding in sound effects. First, let’s go back to the designer and add in a Sound component. Note that the sound component is an invisible component; intuitively this makes sense because we can play and pause sounds but we can’t see them. We can upload sound files in the exact same way that we uploaded our images and then set the source like this:
){kind=link}
Blocks 2
The nice thing about using functions is that if we update this one function then every event that calls the function will also be updated:
Remix
This app is also available in our gallery of open-source sample apps for you to remix.
Why not create your own images for the faces of the die?
You could add extra dice to the app?
How about creating an 8, 12 or 20 sided die?
