A swift game of Chess, part II

Ok, if you read part I, this will all make sense; if you didn’t then read no further, read this first.

So, assuming you have read it and followed the brief tutorial; you now have a working chess board… but it needs more. It needs to keep track of the pieces you win/lose and it’s those code bytes I plan to share today. Are end game should look something like this.

Image for post
Image for post

The two columns you see on the left and right are the pieces taken. They are two UIStackViews, the perfect solution for this problem since I can dynamically add content to them. The first change you need to make it the code in part I is to add the code here to your ViewController.

whiteWin = UIStackView()
whiteWin.axis = UILayoutConstraintAxis.vertical
whiteWin.distribution = UIStackViewDistribution.equalSpacing
whiteWin.alignment = UIStackViewAlignment.center
whiteWin.spacing = 2.0

self.view.addSubview(whiteWin)
let margins = view.layoutMarginsGuide

whiteWin.translatesAutoresizingMaskIntoConstraints = false
whiteWin.leadingAnchor.constraint(equalTo: margins.leadingAnchor, constant: +32).isActive = true
whiteWin.centerYAnchor.constraint(equalTo: self.view.centerYAnchor).isActive = true

blackWin = UIStackView()
blackWin.axis = UILayoutConstraintAxis.vertical
blackWin.distribution = UIStackViewDistribution.equalSpacing
blackWin.alignment = UIStackViewAlignment.center
blackWin.spacing = 2.0

self.view.addSubview(blackWin)
blackWin.translatesAutoresizingMaskIntoConstraints = false
blackWin.trailingAnchor.constraint(equalTo: margins.trailingAnchor, constant: -32).isActive = true
blackWin.centerYAnchor.constraint(equalTo: self.view.centerYAnchor).isActive = true

Within it, you have two UIStackViews, with minimal configurations and most importantly layout constraints ensuring that flank our chess board.

I include the complete code of the method for the other major change here.

func dropInteraction(_ interaction: UIDropInteraction, performDrop     session: UIDropSession) {
// Consume drag items (in this example, of type UIImage).
session.loadObjects(ofClass: UIImage.self) { imageItems in
let images = imageItems as! [UIImage]
let dropLocation:CGPoint = session.location(in: self.view)
for image2X in self.image2A {
if (image2X.frame.contains(dropLocation) ) {
self.objectIndex = image2X.tag
if self.objectIndex == self.sourceIndex {
// abort the action
return
}
if self.cpmap[self.objectIndex] != nil {
let losingPiece = UIImageView()
losingPiece.image = UIImage(named:self.cpmap[image2X.tag]!)
losingPiece.heightAnchor.constraint(equalToConstant: 48).isActive = true
losingPiece.widthAnchor.constraint(equalToConstant: 48).isActive = true
losingPiece.alpha = 0.5
if ((self.cpmap[image2X.tag]?.prefix(1)) != “b”) {
self.blackWin.addArrangedSubview(losingPiece)
} else {
self.whiteWin.addArrangedSubview(losingPiece)
}
}
self.cpmap[self.objectIndex] = self.cpmap[self.sourceIndex]
self.cpmap[self.sourceIndex] = nil
image2X.image = images.first
self.image2M.image = nil
}
}
}
}

This code runs when you drag and drop a piece to a new location. It now checks to see via the cpmap variable if there was already a piece there and if so adds it to one of the two stackViews we created earlier. Since UIImageview doesn’t have an intrinsic size it also introduces a few more constraints too.

Sorry, yes cpmap we populated in the viewController when we built the board. The line of code you need to add in the conditional from part I reads…

if cpieces[imageIndex] != nil {
image2D.image = UIImage(named: cpieces[imageIndex]!)
cpmap[imageIndex] = cpieces[imageIndex]!
}

With cpmap nothing more than a dictionary, its declaration alongside cpieces.

var cpmap:[Int:String] = [:]

Which brings us to the end of this update. Should I do more? What do you think is missing; please comment?

Credit, note the chess pieces you see in the image where downloaded from https://thenounproject.com; they were created by jhonythomasang@gmail.com.

Written by

Coding for 35+ years, enjoying using and learning Swift/iOS development. Writer @ Better Programming, @The StartUp, @Mac O’Clock, Level Up Coding & More

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store