MaterialKit

Material design components (inspired by Google Material Design) for iOS written in Swift

Please feel free to make pull requests.

Features

• Highly customizable

• Complete example

• Supports @IBDesignable to live-render the component in the Interface Builder

• By suporting @IBInspectable, the class properties can be exposed in the Interface Builder, and you can edit these properties in realtime

• MKButton: floating action button, raised button, flat button, ripple effect

• MKTextField: ripple effect, floating placeholder

• MKTableViewCell

• MKLabel

• MKImageView

• MKLayer

• MKColor

Components

MKButton

• There are 3 types of main buttons: Floating Action Button, Raised Button, Flat Button
• Custommizable attributes: color, ripple location, animation timing function, animation duration...

	let button = MKButton(frame: CGRect(x: 10, y: 10, width: 100, height: 35))
	button.maskEnabled = true
	button.rippleLocation = .TapLocation
	button.rippleLayerColor = UIColor.MKColor.LightGreen

MKTextField

• Single-line text field
• Floating placeholder
• Ripple Animation
• Custommizable attributes: color, ripple location, bottom border, animation timing function, animation duration...

	textField.rippleLocation = .Left
	textField.floatingPlaceholderEnabled = true
	textField.placeholder = "Description"
	textField.layer.borderColor = UIColor.MKColor.Green.CGColor
	textField.rippleLayerColor = UIColor.MKColor.LightGreen

MKTableViewCell

• Custommizable attributes: color, ripple location, animation timing function, animation duration...

	var cell = tableView.dequeueReusableCellWithIdentifier("MyCell") as MyCell
	cell.rippleLocation = .Center
	cell.rippleLayerColor = UIColor.MKColor.Blue

MKLabel, MKImageView (BarButtonItem)

• Custommizable attributes: color, ripple location, animation timing function, animation duration...

• Play ripple animation whenever you want by calling animateRipple method or by setting userInteractionEnabled = true ripple animation will be played when the label/imageview is tapped

• Easy to customize UIBarButtonItem or UITabBarButton by using MKLabel or MKImageView

	// customize UIBarButtonItem by using MKImageView
	let imgView = MKImageView(frame: CGRect(x: 0, y: 0, width: 44, height: 32))
	imgView.image = UIImage(named: "uibaritem_icon.png")
	imgView.rippleLocation = .Center
	imgView.userInteractionEnabled = true

	let rightBarButton = UIBarButtonItem(customView: imgView)
	self.navigationItem.rightBarButtonItem = rightBarButton

MKProgressView (Coming Soon)

MKLayer

A subclass of CALayer.

MKColor

A category for UIColor that adds some methods to get flat colors designed by Google

	// get color from UIColor
	let lightBlueColor = UIColor.MKColor.LightBlue

TODO

• MKTextView
• MKActivityIndicator (In progress)

Installation

• Installation with CocoaPods

	pod 'MaterialKit'

• Copying all the files into your project
• Using submodule

Requirements

• iOS 7.0+
• Xcode 6.1

License

MaterialKit is released under the MIT license. See LICENSE for details.