Update UIimage based when inserting item to an array

Question

I have 4 imageViews. When I append a color inside the for, array, the first image view background will change base on the content. My goal is to whenever I add a color, an image view background color will change. When I add the first color, the first image view will change, the second color , the second image view will change etc..

how could I achieve it ?

Tought by creating a collection of image view it would have been possible to achieve it.

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var image1: UIImageView!
    @IBOutlet weak var image2: UIImageView!
    @IBOutlet weak var image3: UIImageView!
    @IBOutlet weak var image4: UIImageView!
    @IBOutlet var images: [UIImageView]!
    
    var colors = ["Green","Red"]
    var forms = [String]()
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }


    @IBAction func buttonPressed(_ sender: UIButton) {
        if let randomColor = colors.randomElement() {
            forms.append(randomColor)
            
                switch forms.last {
                case "Green":
                    image1.backgroundColor = #colorLiteral(red: 0.1960784346, green: 0.3411764801, blue: 0.1019607857, alpha: 1)
                    
                case "L":
                    
                    image1.backgroundColor = #colorLiteral(red: 0.521568656, green: 0.1098039225, blue: 0.05098039284, alpha: 1)
                default:
                    print("Unknow")
                
            }
            
        }
        
    }
    
}

Answer 1

The index of the the next image is forms.count-1. Instead of assigning color to image1, try to set the color of images[forms.count-1]:

@IBAction func buttonPressed(_ sender: UIButton) {
    if let randomColor = colors.randomElement() {
        forms.append(randomColor)
        let index = forms.count - 1
        guard index < images.count else {
            // index out of bounds
            return
        }
        switch forms.last {
        case "Green":
            images[index].backgroundColor = #colorLiteral(red: 0.1960784346, green: 0.3411764801, blue: 0.1019607857, alpha: 1)    
        case "Red":
            images[index].backgroundColor = #colorLiteral(red: 0.521568656, green: 0.1098039225, blue: 0.05098039284, alpha: 1)
        default:
            print("Unknow")
            
        }
    }
}

UPDATE:

To show the last 4 items, try this code snippet:

@IBAction func buttonPressed(_ sender: UIButton) {
    if let randomColor = colors.randomElement() {
        forms.append(randomColor)
        if forms.count > images.count {
            forms.removeFirst()
        }
        for i in 0..<forms.count {
            switch forms[i] {
            case "Green":
                images[i].backgroundColor = #colorLiteral(red: 0.1960784346, green: 0.3411764801, blue: 0.1019607857, alpha: 1)
                
            case "Red":
                
                images[i].backgroundColor = #colorLiteral(red: 0.521568656, green: 0.1098039225, blue: 0.05098039284, alpha: 1)
            default:
                print("Unknow")
                
            }
        }
    }
}