Golden Thumb Parenting Tips [011]

Line segment bisector in Xcode

6 min readApr 3, 2020

At the age of eleven, I began Euclid. . . . This was one of the great events of my life, as dazzling as first love. I had not imagined there was anything so delicious in the world.
Bertrand Russell

Most schools stopped. But you might be able to learn even more from home. Here is a good start point to kick off with Euclidean geometry and coding:

Let’s find out the middle point of a line segment, first on paper with ruler and compass, then on Xcode with Swift program. We’ll write code to demonstrate a traditional solution like this:

Ruler and compass:

My 8-year old MacBook Pro:

Launch Xcode:

Select “Create a new Xcode project”. Select “Single View App” under “iOS”. Then click “Next” button:

Input Product Name “RulerCompass”. Make sure User Interface is Storyboard. Click “Next” button:

Find or create a convenient folder to put Xcode project files in. Click “Create” button to create our project files:

Here is the newly created Xcode project RulerCompass:

Choose iPad Pro (9.7-inch) simulator near the top left area:

Then click the black triangle icon to launch this empty but runnable iOS app:

We’ll use a UIView subclass to draw our diagram. Create a new file under the yellow folder “RulerCompass”:

Select “Cocoa Touch Class” under “iOS”. And click “Next” button:

Let’s use a fancy name “EuclideanView”. Then click “Next” button:

Accept the default location and click “Create” button:

Select “Main.storyboard” on the left hand navigation panel:

Click “View as: iPhone 11” near the bottom to change UI template to “View as: iPad Pro 9.7”:

Click the “+” icon near the top right corner to show UI widget library:

Scroll down to find View:

Drag it onto the white area of UI template:

Bring up the property panel by clicking the top right icon. Also make our Euclidean view larger:

With our Euclidean view selected, change its class from the default UIView to EuclideanView:

Go back to EuclideanView.swift file and uncomment function draw(..):

Write code to draw a line segment:

import UIKitclass EuclideanView: UIView {override func draw(_ rect: CGRect) {
        let rulerPath1 = UIBezierPath()
        rulerPath1.move(to: CGPoint(x: 200, y: 350))
        rulerPath1.addLine(to: CGPoint(x: 500, y: 350))
        rulerPath1.lineWidth = 3
        rulerPath1.stroke()
    }
}

The coordinate (0, 0) is at the top left.

The complete code:

import UIKitclass EuclideanView: UIView {    override func draw(_ rect: CGRect) {
        let rulerPath1 = UIBezierPath()
        rulerPath1.move(to: CGPoint(x: 200, y: 350))
        rulerPath1.addLine(to: CGPoint(x: 500, y: 350))
        rulerPath1.lineWidth = 3
        rulerPath1.stroke()
        
        let compassPath1 = UIBezierPath()
        compassPath1.addArc(withCenter: CGPoint(x: 200, y: 350), radius: 300, startAngle: -0.5 * CGFloat.pi, endAngle: 0.5 * CGFloat.pi, clockwise: true)
        UIColor.green.setStroke()
        compassPath1.stroke()
        
        let compassPath2 = UIBezierPath()
        compassPath2.addArc(withCenter: CGPoint(x: 500, y: 350), radius: 300, startAngle: -0.5 * CGFloat.pi, endAngle: 0.5 * CGFloat.pi, clockwise: false)
        UIColor.brown.setStroke()
        compassPath2.stroke()
        
        let rulerPath2 = UIBezierPath()
        rulerPath2.move(to: CGPoint(x: 350, y: 10))
        rulerPath2.addLine(to: CGPoint(x: 350, y: 700))
        rulerPath2.lineWidth = 2
        UIColor.red.setStroke()
        rulerPath2.stroke()
    }
}

And we are done:

Golden Thumb Parenting Tips [011]

Line segment bisector in Xcode

Written by 拇指 muzhi.com

No responses yet