the making of the Dice rolling app

From array to randomization, the process of making this app is a real thrill!

It all began with my self-indulgent round corner and stroke design for the roll button, here’s where to find that attribute:

Now let’s take a look at this minor but really annoying “breakpoint“ that might pop up if are just clicking your way around, and suddenly this shows up when you try to run the app:

I was clicking around to try things out and see what happens because that’s the best way to learn IMO. And sure enough, I accidentally created these blue highlight marks that turned out to be the opportunity to learn what they do — creating breakpoints. Here’s how to either disable them (left click once) or delete them (right click):

Now we can finally talk about the fun part — imageLiteral that appeared to no longer work in the current version of Xcode by typing “imageLiteral”. Quoting my girl Gemini below:

Well, there are two solutions:

Solution #1:

Just totally forget about the beautiful thumbnail that comes with imageLiteral and use UIImage ( named: String ) instead, eg: UIImage ( named: “catPhoto“)

Solution #2:

Go the extra mile and use this code to summon the good old imageLiteral thumbnails which are visually more neat IMO, but this might not be for you if you need to always see the source code, here’s the code: #imageLiteral ( resourceName: String ), eg: #imageLiteral ( resourceName: "catPhoto") , result below with thumbnails as promised:

Something interesting happened with array and randomization!

Supposedly, the code .randomElement ( ) should do the magic, but here’s the error that appeared, this might be another Xcode version update related situation.

The solution is simply to add “!” at the end, so the code becomes .randomElement ( ) !

It works beautifully after that:

One more thing to be mindful is, when you delete the connection of your IBOutlet, notice that you just gotta click on this tiny little “x“ here, if you deleted the whole thing by accident, your whole design could be wiped clean and it is irreversible cuz I’ve done it 🥹

Well, all the hard work is worth it when you see the final code and the app below! (credit of class source material to The App Brewery )

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var imageView1: UIImageView!
    @IBOutlet weak var imageView2: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()
        
    imageView1.image = #imageLiteral(resourceName: "DiceTwo")
    imageView2.image = #imageLiteral(resourceName: "DiceSix")
        
    }

    @IBAction func rollbutton(_ sender: UIButton) {
        
    let diceArray = [#imageLiteral(resourceName: "DiceOne"), #imageLiteral(resourceName: "DiceTwo"), #imageLiteral(resourceName: "DiceThree"), #imageLiteral(resourceName: "DiceFour"), #imageLiteral(resourceName: "DiceFive"), #imageLiteral(resourceName: "DiceSix")]
    
        imageView1.image = diceArray.randomElement()!
        imageView2.image = diceArray.randomElement()!
        
    }
    
}
Previous
Previous

the making of the cyberpunk neon themed Magic 8 Ball app

Next
Next

Deep into the git matrix….