UPGRADE YOUR SKILLS: Learn advanced Swift and SwiftUI on Hacking with Swift+! >>

SOLVED: Isometric grid overlay

Forums > Swift


The following is supposed to create an isometric lattice pattern across a UIView, but all it does is turn the page black:

class IsometricGrid: UIView {

    let gridSpacing: CGFloat = 20

    override func draw(_ rect: CGRect) {

        let context = UIGraphicsGetCurrentContext()


        for x in stride(from: 0, through: self.frame.width, by: gridSpacing) {
            for y in stride(from: 0, through: self.frame.height, by: gridSpacing) {
                // Draw the diagonal lines for the isometric grid
                context?.move(to: CGPoint(x: x, y: y))
                context?.addLine(to: CGPoint(x: x + gridSpacing, y: y + gridSpacing))

                context?.move(to: CGPoint(x: x + gridSpacing, y: y))
                context?.addLine(to: CGPoint(x: x, y: y + gridSpacing))

        let isometricGridView = IsometricGrid()
        isometricGridView.frame = CGRect(x: 0, y: 0, width: view.bounds.width, height: view.bounds.height)

I am using an older version of Swift, but this is CoreGraphics and nothing new. Perhaps it is the iPhone XR emulator ?



Apparently I forgot to make the background to this mesh overlan (UIView) transparent !

isometricGridView.backgroundColor = .clear


Hacking with Swift is sponsored by Essential Developer

SPONSORED Join a FREE crash course for mid/senior iOS devs who want to achieve an expert level of technical and practical skills – it’s the fast track to being a complete senior developer! Hurry up because it'll be available only until April 28th.

Click to save your free spot now

Sponsor Hacking with Swift and reach the world's largest Swift community!

Reply to this topic…

You need to create an account or log in to reply.

All interactions here are governed by our code of conduct.

Unknown user

You are not logged in

Log in or create account

Link copied to your pasteboard.