Skip to content

Instantly share code, notes, and snippets.

@JohannMG
Created February 9, 2017 02:43
Show Gist options
  • Select an option

  • Save JohannMG/ac4ee00984b4c84fd0388bbc0a95575e to your computer and use it in GitHub Desktop.

Select an option

Save JohannMG/ac4ee00984b4c84fd0388bbc0a95575e to your computer and use it in GitHub Desktop.
Playground: Draws a little view with a triangle point at the center bottom pointing down.
//: Playground - noun: a place where people can play
import UIKit
import PlaygroundSupport
class ReminderView : UIView {
let popupColor = UIColor(white: 0.0, alpha: 0.16)
let drawingCornerRadius: CGFloat = 6.0
let bubbleHeightRatio: CGFloat = 0.83
let label = UILabel()
override init(frame: CGRect) {
super.init(frame: frame)
commonInit()
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
commonInit()
}
func commonInit(){
backgroundColor = UIColor.clear
addSubview(label)
label.frame = CGRect(x: 10, y: 0, width: frame.width - 20 , height: frame.height * bubbleHeightRatio)
label.text = "Something else should go here"
label.textAlignment = .center
label.adjustsFontSizeToFitWidth = true
label.font = UIFont(name: label.font.fontName, size: 22.0)
}
override func layoutSubviews() {
super.layoutSubviews()
label.frame = CGRect(x: 10, y: 0, width: frame.width - 20 , height: frame.height * bubbleHeightRatio)
}
override func draw(_ rect: CGRect) {
let bubbleHeight: CGFloat = round( frame.size.height * bubbleHeightRatio )
let pointWidth: CGFloat = frame.size.width * 0.07
let horizontalCenter: CGFloat = frame.size.width * 0.5
let context = UIGraphicsGetCurrentContext()
//----- Path Drawing --------
//Start at Center-top
context?.move(to: CGPoint(x: horizontalCenter, y: 0.0))
context?.addLine(to: CGPoint(x: frame.width - drawingCornerRadius , y: 0))
//Draw curve around right corner, then down
context?.addArc(center: CGPoint(x: frame.width - drawingCornerRadius, y: drawingCornerRadius),
radius: drawingCornerRadius , startAngle: CGFloat.pi / 2.0 * 3.0 , endAngle: 0.0 , clockwise: false)
context?.addLine(to: CGPoint(x: frame.width, y: bubbleHeight - drawingCornerRadius))
//bottom right corner and to the edge of the point
context?.addArc(center: CGPoint(x: frame.width - drawingCornerRadius ,y: bubbleHeight - drawingCornerRadius ),
radius: drawingCornerRadius, startAngle: 0.0 , endAngle: CGFloat.pi / 2.0 , clockwise: false)
context?.addLine(to: CGPoint(x: horizontalCenter + pointWidth, y: bubbleHeight))
//Point
context?.addLine(to: CGPoint(x: horizontalCenter, y: frame.height))
context?.addLine(to: CGPoint(x: horizontalCenter - pointWidth, y: bubbleHeight))
context?.addLine(to: CGPoint(x: drawingCornerRadius, y: bubbleHeight))
//Left Bottom corner and up
context?.addArc(center: CGPoint(x: drawingCornerRadius , y: bubbleHeight - drawingCornerRadius),
radius: drawingCornerRadius, startAngle: CGFloat.pi * 3.0 / 2.0, endAngle: CGFloat.pi , clockwise: false)
context?.addLine(to: CGPoint(x: 0, y: drawingCornerRadius))
//Topcorner and back to the top center
context?.addArc(center: CGPoint(x: drawingCornerRadius, y: drawingCornerRadius),
radius: drawingCornerRadius, startAngle: CGFloat.pi , endAngle: 3 * CGFloat.pi / 2 , clockwise: false)
context?.addLine(to: CGPoint(x: horizontalCenter, y: 0))
//END Path drawing ---------
context?.setFillColor(popupColor.cgColor)
context?.drawPath(using: CGPathDrawingMode.fill)
}
}
let mainView = UIView(frame: CGRect(origin: CGPoint.zero, size: CGSize(width: 600, height: 300)))
mainView.backgroundColor = UIColor(hue: 0.3, saturation: 0.00, brightness: 0.9, alpha: 1.0)
let reminder = ReminderView(frame: CGRect(x: 10, y: 50, width: mainView.frame.width - 20, height: (mainView.frame.width / 4.90) ))
//reminder.backgroundColor = UIColor.lightGray
reminder.clipsToBounds = false
mainView.addSubview(reminder)
PlaygroundPage.current.liveView = mainView
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment