Skip to content

Instantly share code, notes, and snippets.

@Adobels
Created September 21, 2023 19:52
Show Gist options
  • Save Adobels/1d83193857192dd3bfa93cb5e64859bb to your computer and use it in GitHub Desktop.
Save Adobels/1d83193857192dd3bfa93cb5e64859bb to your computer and use it in GitHub Desktop.
Tappable Trapezoids and Rectangle UIView
import UIKit
class ShapeView: UIView {
private var topTrapezoidPath: UIBezierPath!
private var bottomTrapezoidPath: UIBezierPath!
private var leftTrapezoidPath: UIBezierPath!
private var rightTrapezoidPath: UIBezierPath!
private var rectanglePath: UIBezierPath!
override init(frame: CGRect) {
super.init(frame: frame)
setupTapGestureRecognizer()
}
required init?(coder: NSCoder) {
super.init(coder: coder)
setupTapGestureRecognizer()
}
private func setupTapGestureRecognizer() {
let tapGesture = UITapGestureRecognizer(target: self, action: #selector(handleTap))
self.addGestureRecognizer(tapGesture)
}
override func draw(_ rect: CGRect) {
let middleRect = CGRect(x: rect.width * 0.25, y: rect.height * 0.25, width: rect.width * 0.5, height: rect.height * 0.5)
// Top Trapezoid
topTrapezoidPath = UIBezierPath()
topTrapezoidPath.move(to: CGPoint(x: 0, y: 0))
topTrapezoidPath.addLine(to: CGPoint(x: rect.width, y: 0))
topTrapezoidPath.addLine(to: CGPoint(x: middleRect.maxX, y: middleRect.minY))
topTrapezoidPath.addLine(to: CGPoint(x: middleRect.minX, y: middleRect.minY))
topTrapezoidPath.close()
UIColor.red.setFill()
topTrapezoidPath.fill()
// Bottom Trapezoid
bottomTrapezoidPath = UIBezierPath()
bottomTrapezoidPath.move(to: CGPoint(x: 0, y: rect.height))
bottomTrapezoidPath.addLine(to: CGPoint(x: rect.width, y: rect.height))
bottomTrapezoidPath.addLine(to: CGPoint(x: middleRect.maxX, y: middleRect.maxY))
bottomTrapezoidPath.addLine(to: CGPoint(x: middleRect.minX, y: middleRect.maxY))
bottomTrapezoidPath.close()
UIColor.blue.setFill()
bottomTrapezoidPath.fill()
// Left Trapezoid
leftTrapezoidPath = UIBezierPath()
leftTrapezoidPath.move(to: CGPoint(x: 0, y: 0))
leftTrapezoidPath.addLine(to: CGPoint(x: middleRect.minX, y: middleRect.minY))
leftTrapezoidPath.addLine(to: CGPoint(x: middleRect.minX, y: middleRect.maxY))
leftTrapezoidPath.addLine(to: CGPoint(x: 0, y: rect.height))
leftTrapezoidPath.close()
UIColor.green.setFill()
leftTrapezoidPath.fill()
// Right Trapezoid
rightTrapezoidPath = UIBezierPath()
rightTrapezoidPath.move(to: CGPoint(x: rect.width, y: 0))
rightTrapezoidPath.addLine(to: CGPoint(x: middleRect.maxX, y: middleRect.minY))
rightTrapezoidPath.addLine(to: CGPoint(x: middleRect.maxX, y: middleRect.maxY))
rightTrapezoidPath.addLine(to: CGPoint(x: rect.width, y: rect.height))
rightTrapezoidPath.close()
UIColor.yellow.setFill()
rightTrapezoidPath.fill()
// Rectangle
rectanglePath = UIBezierPath(rect: middleRect)
UIColor.purple.setFill()
rectanglePath.fill()
}
@objc private func handleTap(gesture: UITapGestureRecognizer) {
let point = gesture.location(in: self)
if topTrapezoidPath.contains(point) {
print("Top Trapezoid tapped!")
} else if bottomTrapezoidPath.contains(point) {
print("Bottom Trapezoid tapped!")
} else if leftTrapezoidPath.contains(point) {
print("Left Trapezoid tapped!")
} else if rightTrapezoidPath.contains(point) {
print("Right Trapezoid tapped!")
} else if rectanglePath.contains(point) {
print("Rectangle tapped!")
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment