Last active
August 29, 2015 14:11
-
-
Save morizotter/25e18308dbddf9bcb3de to your computer and use it in GitHub Desktop.
XcodeのLive Renderingを使って簡単に使い勝手の良いアイコンボタンをつくろう ref: http://qiita.com/morizotter/items/3483108f8e3266ef4c81
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@IBDesignable | |
class IconButton: UIControl { | |
@IBInspectable var iconImage: UIImage? | |
override func drawRect(rect: CGRect) { | |
if let iconImage = self.iconImage { | |
iconImage.drawInRect(self.bounds) | |
let maskPath = UIBezierPath(roundedRect: self.bounds, cornerRadius: CGRectGetWidth(self.bounds) / 2) | |
let maskLayer = CAShapeLayer() | |
maskLayer.path = maskPath.CGPath | |
self.layer.mask = maskLayer; | |
} | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@IBDesignable | |
class IconButton: UIControl { | |
@IBInspectable var iconImage: UIImage? | |
@IBInspectable var borderColor: UIColor = UIColor.clearColor() | |
@IBInspectable var lineWidth: CGFloat = 0.0 | |
var borderLayer: CAShapeLayer? | |
override func drawRect(rect: CGRect) { | |
if let iconImage = self.iconImage { | |
iconImage.drawInRect(self.bounds) | |
} | |
let path = UIBezierPath(roundedRect: self.bounds, cornerRadius: CGRectGetWidth(self.bounds) / 2) | |
let maskLayer = CAShapeLayer() | |
maskLayer.path = path.CGPath | |
self.layer.mask = maskLayer; | |
if self.borderLayer == nil { | |
self.borderLayer = CAShapeLayer() | |
self.borderLayer!.path = path.CGPath | |
self.borderLayer!.fillColor = UIColor.clearColor().CGColor | |
self.layer.addSublayer(self.borderLayer!) | |
} | |
self.borderLayer!.strokeColor = self.borderColor.CGColor | |
self.borderLayer!.lineWidth = self.lineWidth | |
self.borderLayer!.lineCap = kCALineCapRound | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@IBDesignable | |
class IconButton: UIControl { | |
@IBInspectable var normalImage: UIImage? { | |
didSet { | |
self.setNeedsDisplay() | |
} | |
} | |
@IBInspectable var highlightedImage: UIImage? { | |
didSet { | |
self.setNeedsDisplay() | |
} | |
} | |
@IBInspectable var normalBorderColor: UIColor = UIColor.clearColor() { | |
didSet { | |
self.setNeedsDisplay() | |
} | |
} | |
@IBInspectable var highlightedBorderColor: UIColor = UIColor.clearColor() { | |
didSet { | |
self.setNeedsDisplay() | |
} | |
} | |
@IBInspectable var lineWidth: CGFloat = 0.0 { | |
didSet { | |
self.setNeedsDisplay() | |
} | |
} | |
lazy var maskLayer: CAShapeLayer = { | |
return CAShapeLayer() | |
}() | |
lazy var borderLayer: CAShapeLayer = { | |
let borderLayer = CAShapeLayer() | |
borderLayer.fillColor = UIColor.clearColor().CGColor | |
self.layer.addSublayer(borderLayer) | |
return borderLayer | |
}() | |
var circlePath: UIBezierPath { | |
get { | |
return UIBezierPath(roundedRect: self.bounds, cornerRadius: CGRectGetWidth(self.bounds) / 2) | |
} | |
} | |
override var highlighted: Bool { | |
didSet { | |
self.setNeedsDisplay() | |
} | |
} | |
override func drawRect(rect: CGRect) { | |
var iconImage: UIImage? | |
var borderColor = UIColor.clearColor() | |
if self.highlighted { | |
if let highlightedImage = self.highlightedImage { | |
iconImage = highlightedImage | |
borderColor = self.highlightedBorderColor | |
} | |
} else { | |
if let normalImage = self.normalImage { | |
iconImage = normalImage | |
borderColor = self.normalBorderColor | |
} | |
} | |
iconImage?.drawInRect(self.bounds) | |
self.maskLayer.path = self.circlePath.CGPath | |
self.layer.mask = self.maskLayer | |
self.borderLayer.path = self.circlePath.CGPath | |
self.borderLayer.strokeColor = borderColor.CGColor | |
self.borderLayer.lineWidth = self.lineWidth | |
} | |
} | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import UIKit | |
class ViewController: UIViewController { | |
@IBAction func buttonTapped(sender: IconButton) { | |
println("button tapped!") | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment