Saturday, June 20, 2015

iOS Drawing in swift playground

swift Playground can be used for prototype iOS Drawing



swift Plyaground    Select all
//: Playground - a place where programmer can prototype import UIKit class IconView: UIView { override func drawRect(rect: CGRect) { drawRawBackgroundWithBaseColor(UIColor.orangeColor(), backgroundRectangle: self.bounds) let textAttributes = [ NSForegroundColorAttributeName : UIColor.blackColor(), NSFontAttributeName : UIFont.systemFontOfSize(32.0) ] let FString: String = "Hello World" let distanceX: CGFloat = -12.0 let distanceY: CGFloat = 0.0 let centerX = CGRectGetMidX(self.bounds) let centerY = CGRectGetMidY(self.bounds) FString.drawAtPoint(CGPointMake(centerX + distanceX, centerY + distanceY), withAttributes:textAttributes) } } func drawRawBackgroundWithBaseColor(strokeColor: UIColor, backgroundRectangle:CGRect) { let lineWidth = backgroundRectangle.width/36.0 let cornerRadius = backgroundRectangle.width/16.0 // let tileRectangle = backgroundRectangle.rectByInsetting(dx: lineWidth/2.0, dy: lineWidth/2.0) let tileRectangle = backgroundRectangle.insetBy(dx: lineWidth/2.0, dy: lineWidth/2.0) // Stroke Drawing let strokePath = UIBezierPath(roundedRect:tileRectangle, cornerRadius:cornerRadius) strokeColor.setStroke() strokePath.lineWidth = lineWidth strokePath.stroke() // Draw an ellipse // let ovalPath = UIBezierPath(ovalInRect: backgroundRectangle.rectByInsetting(dx: lineWidth*1.5, dy: lineWidth*1.5)) let ovalPath = UIBezierPath(ovalInRect: backgroundRectangle.insetBy(dx: lineWidth*1.5, dy: lineWidth*1.5)) UIColor.blueColor().setStroke() ovalPath.lineWidth = lineWidth ovalPath.stroke() // let context:CGContextRef = UIGraphicsGetCurrentContext() let context:CGContextRef = UIGraphicsGetCurrentContext()! CGContextSetFillColorWithColor(context, UIColor.greenColor().CGColor) CGContextAddRect(context, CGRectMake(100.0, 100.0, 60.0, 60.0)) CGContextFillPath(context) } // Instantiate the UIView let rect = CGRect(x: 0.0, y: 0.0, width: 420.0, height: 320.0) let icon = IconView(frame: rect) icon.backgroundColor = UIColor.clearColor() icon




Updated for Swift 3.0 (Xcode 8 beta 6) syntax below

swift Plyaground 3.0     Select all
//: Playground - noun: a place where people can play #if os(iOS) import UIKit class IconView: UIView { override func draw(_ rect: CGRect) { drawRawBackgroundWithBaseColor(strokeColor: UIColor.orange, backgroundRectangle: self.bounds) let textAttributes = [ NSForegroundColorAttributeName : UIColor.black, NSFontAttributeName : UIFont.systemFont(ofSize: 32.0) ] /* Swift 4 let textAttributes: [NSAttributedString.Key : Any] = [ NSAttributedString.Key.foregroundColor: UIColor.black, NSAttributedString.Key.font: UIFont.systemFont(ofSize: 32.0) ] */ let FString: String = "Hello World" let distanceX: CGFloat = -12.0 let distanceY: CGFloat = 0.0 let centerX = self.bounds.midX let centerY = self.bounds.midY FString.draw(at: CGPoint(x:centerX+distanceX, y:centerY+distanceY), withAttributes: textAttributes) } } func drawRawBackgroundWithBaseColor(strokeColor: UIColor, backgroundRectangle:CGRect) { let lineWidth = backgroundRectangle.width/36.0 let cornerRadius = backgroundRectangle.width/16.0 let tileRectangle = backgroundRectangle.insetBy(dx: lineWidth/2.0, dy: lineWidth/2.0) // Stroke Drawing let strokePath = UIBezierPath(roundedRect:tileRectangle, cornerRadius:cornerRadius) strokeColor.setStroke() strokePath.lineWidth = lineWidth strokePath.stroke() // Draw an ellipse let ovalPath = UIBezierPath(ovalIn: backgroundRectangle.insetBy(dx: lineWidth*1.5, dy: lineWidth*1.5)) UIColor.blue.setStroke() ovalPath.lineWidth = lineWidth ovalPath.stroke() let context:CGContext = UIGraphicsGetCurrentContext()! context.setFillColor(UIColor.green.cgColor) context.addRect(CGRect(x: 100.0, y: 100.0, width: 60.0, height: 60.0)) context.fillPath() } // Instantiate the UIView let rect = CGRect(x: 0.0, y: 0.0, width: 420.0, height: 320.0) let icon = IconView(frame: rect) icon.backgroundColor = UIColor.clear icon #endif #if os(OSX) import Cocoa class IconView: NSView { override func draw(_ rect: CGRect) { drawRawBackgroundWithBaseColor(strokeColor: NSColor.orange, backgroundRectangle: self.bounds) let textAttributes = [ NSForegroundColorAttributeName : NSColor.black, NSFontAttributeName : NSFont.systemFont(ofSize: 32.0) ] /* Swift 4 let textAttributes: [NSAttributedString.Key : Any] = [ NSAttributedString.Key.foregroundColor: UIColor.black, NSAttributedString.Key.font: UIFont.systemFont(ofSize: 32.0) ] */ let FString: String = "Hello OSX" let distanceX: CGFloat = -12.0 let distanceY: CGFloat = 0.0 let centerX = self.bounds.midX let centerY = self.bounds.midY FString.draw(at: CGPoint(x:centerX+distanceX, y:centerY+distanceY), withAttributes: textAttributes) } } func drawRawBackgroundWithBaseColor(strokeColor: NSColor, backgroundRectangle:CGRect) { let lineWidth = backgroundRectangle.width/36.0 let cornerRadius = backgroundRectangle.width/16.0 let tileRectangle = backgroundRectangle.insetBy(dx: lineWidth/2.0, dy: lineWidth/2.0) // Stroke Drawing let strokePath = NSBezierPath(roundedRect: tileRectangle, xRadius: cornerRadius, yRadius: cornerRadius) strokeColor.setStroke() strokePath.lineWidth = lineWidth strokePath.stroke() // Draw an ellipse let ovalPath = NSBezierPath(ovalIn: backgroundRectangle.insetBy(dx: lineWidth*1.5, dy: lineWidth*1.5)) NSColor.blue.setStroke() ovalPath.lineWidth = lineWidth ovalPath.stroke() let context:CGContext = NSGraphicsContext.current()!.cgContext context.setFillColor(NSColor.green.cgColor) context.addRect(CGRect(x: 100.0, y: 100.0, width: 60.0, height: 60.0)) context.fillPath() } // Instantiate the UIView let rect = CGRect(x: 0.0, y: 0.0, width: 420.0, height: 320.0) let icon = IconView(frame: rect) extension NSView { var backgroundColor: NSColor? { get { guard let layer = self.layer, let backgroundColor = layer.backgroundColor else { return nil } return NSColor(cgColor: backgroundColor) } set { self.wantsLayer = true self.layer?.backgroundColor = newValue?.cgColor } } } icon.backgroundColor = NSColor.clear icon #endif




No comments: