CGPoint Examples in Swift From Lottie and Charts

CGPoint is a struct used to represent an x and y coordinate in a 2D plane. This post presents examples of how Lottie and Charts, two popular Cocoapods with over 44,000 combined GitHub stars, use CGPoint in Swift:

  1. Compute CGRect Corners and Center
  2. Describe A CoreGraphics Path
  3. Respond To Rotation Gestures

Compute CGRect Corners and Center

Lottie contains a custom implemented utility extension called MathKit (source) that extends CGRect.

The extension uses CGPoint to represent the center and corners of the added CGRect properties:

extension CGRect {
    // Implement a getter and setter for the center
    // of the on CGRect
    var center: CGPoint {
        get {
          return CGPoint(x: midX, y: midY)
        }
        set {
            origin = CGPoint(
                x: newValue.x - (size.width * 0.5),
                y: newValue.y - (size.height * 0.5)
            )
        }
    }

    // Implement a getter and setter for the top left
    // corner of the CGRect
    var topLeft: CGPoint {
        get {
            return CGPoint(x: minX, y: minY)
        }
        set {
            origin = CGPoint(
                x: newValue.x,
                y: newValue.y
            )
        }
    }

    // Implement a getter and setter for the bottom left
    // corner of the CGRect
    var bottomLeft: CGPoint {
        get {
            return CGPoint(x: minX, y: maxY)
        }
        set {
            origin = CGPoint(
                x: newValue.x,
                y: newValue.y - size.height
            )
        }
    }

    // Implement a getter and setter for the top right
    // corner of the CGRect
    var topRight: CGPoint {
        get {
            return CGPoint(x: maxX, y: minY)
        }
        set {
            origin = CGPoint(
                x: newValue.x - size.width,
                y: newValue.y
            )
        }
    }

    // Implement a getter and setter for the bottom right
    // corner of the CGRect
    var bottomRight: CGPoint {
        get {
          return CGPoint(x: maxX, y: maxY)
        }
        set {
            origin = CGPoint(
                x: newValue.x - size.width,
                y: newValue.y - size.height
            )
        }
    }
}

Describe A CoreGraphics Path

One of the ways Charts uses CGPoint is to create a path when drawing with CoreGraphics (source). In this example, Charts uses CGPoint to create a triangle path:

// In this example context is a CGContext, 
// which provides an interface to draw with

// setFillColor sets the drawing color to color.cgColor
context.setFillColor(color.cgColor)
        
// beginPath starts creating a path
context.beginPath()

// move and addLine specify how to append to the path
context.move(to: 
    CGPoint(
        x: point.x, 
        y: point.y - shapeHalf
    )
)

context.addLine(to: 
    CGPoint(
        x: point.x + shapeHalf, 
        y: point.y + shapeHalf
    )
)

context.addLine(to:
    CGPoint(
        x: point.x - shapeHalf, 
        y: point.y + shapeHalf
    )
)
     
// closePath followed by fillPath fills the path 
// with the fill color in the draw buffer
context.closePath()
context.fillPath()

Respond To Rotation Gestures

Another way Charts uses CGPoint is to handle rotation gestures (source). Gesture recognizers use CGPoint to represent the location a user touches the device’s screen. Charts implements a number of methods to handle rotation gestures at a specific location, a CGPoint argument:

processRotationGestureBegan(location: CGPoint)
processRotationGestureMoved(location: CGPoint)
processRotationGestureEnded(location: CGPoint)

When processing touch locations, a common operation is to get the distance between touches. Charts implements a distance(from:, to:) method taking in two CGPoint parameters (source):

private func distance(from: CGPoint, to: CGPoint) -> CGFloat {
    let dx = from.x - to.x
    let dy = from.y - to.y
    return sqrt(dx * dx + dy * dy)
}

CGPoint Examples in Swift

That’s it! By using CGPoint, you can compute attributes of 2D representations like CGRect, describe paths with CoreGraphics, and better handle gestures in Swift.